Customize the Tab Bar "More" Title with .NET MAUI on Android

The other day an issue was opened on the .NET MAUI repository with the question: how do I customize the More title on the tab bar on Android? Since it’s not really that obvious, I’ll write about it here!

What it’s all about #

When you add more than a certain number of tabs in a mobile app it will add a tab at the end which typically says something like “More”.

In the case of Android, when you have more than 5 tabs, you will get 4 tabs which brings you to the content for each tab directly, the 5th tab will become the “More” tab and will show you a list of the remaining tabs you can go to.

The More label is nice and all, but if you want it to say something differently, or even more common, if you want to add localization to your app, how do we do that?!

Customizing the title #

Luckily the solution is pretty straight-forward and leverages Android’s built-in resources system. In .NET MAUI we have implemented the title in such a way that it reads it from the Android strings.xml file. The way Android works with these resources, you can override them inside of your own app.

What you need to do is under the Android/Resources/values folder add a file strings.xml and add the following:

<?xml version="1.0" encoding="utf-8"?>
<resources>
	<string name="overflow_tab_title">Moooore</string>
</resources>

The value can be anything you want of course, this is just to show you that there is a difference. If you run the app now, you will see that the title has changed to this value.

Adding localization to the mix #

Android has support for localization built-in. If you want to also add that here, what you want to do is add another folder under Android/Resources/ but this time name it values-nl where nl here is the ISO language code for Dutch, you want to replace that with whatever language you want to support.

From here, under Android/Resources/values-nl/ add another file strings.xml with the contents above, but change the value to whatever you want it to be when the device language is set to Dutch. More in Dutch is Meer, so I’ve added that for my app, you can see it below.

Wrapping up #

If you want to see the full running example, check this GitHub repository on my account. This has everything I described above and you can see for yourself how it all fits together.

The Android documentation on the usage of resources this way can be found here.