Set Text Size on Android Bottom Navigation View in android 9 and before

Question

we have a few apps where we support android from Version 6 to 10.

Now I have a bottom Navigation bar (tabbedpage) 5 tabs and when tapping on it , the title gets cut off.
In android 9 I have implemented as recommended https://montemagno.com/control-text-size-on-android-bottom-navigation/

and works ,but it does not work on android 9

<resources xmlns:tools="http://schemas.android.com/tools">
    <dimen name="design_bottom_navigation_text_size" tools:override="true">10sp</dimen>
    <dimen name="design_bottom_navigation_active_text_size" tools:override="true">12sp</dimen>
</resources>

Can the size of the text be changed on android 9 and how? I am using the latest xamarin.forms

Answer 1

Hello,

Welcome to our Microsoft Q&A platform!

Once we put the navigation at the bottom, the tab has been changed to BottomNavigationView. We need to use a custom renderer of the Tabbed Page to change the font of the title on the bar. Here is the code.

[assembly: ExportRenderer(typeof(MyTabbedPage), typeof(MyTabbedPageRenderer))]  
namespace Sample.Droid  
{  
    public class MyTabbedPageRenderer : Xamarin.Forms.Platform.Android.AppCompat.TabbedPageRenderer  
    {  
        Context context;  
        public MyTabbedPageRenderer(Context context) : base(context)  
        {  
            this.context = context;  
        }  
  
        protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)  
        {  
            base.OnElementChanged(e);  
  
            if (e.OldElement == null && e.NewElement != null)  
            {  
                for (int i = 0; i <= this.ViewGroup.ChildCount - 1; i++)  
                {  
                    var childView = this.ViewGroup.GetChildAt(i);  
                    if (childView is ViewGroup viewGroup)  
                    {  
                        for (int j = 0; j <= viewGroup.ChildCount - 1; j++)  
                        {  
                            var childRelativeLayoutView = viewGroup.GetChildAt(j);  
                            if (childRelativeLayoutView is BottomNavigationView bottomBar)  
                            {  
                                for (int k = 0; k < bottomBar.Menu.Size(); k++)  
                                {  
                                    IMenuItem menuItem = bottomBar.Menu.GetItem(k);  
                                    SpannableString spanString = new SpannableString(menuItem.TitleFormatted.ToString());  
                                    spanString.SetSpan(new RelativeSizeSpan(0.5f), 0, spanString.Length(), SpanTypes.ExclusiveExclusive);  
                                    menuItem.SetTitle(spanString);  
                                }  
                            }  
                        }  
                    }  
                }  
            }  
        }  
    }  
}  

Change the multiplier to meet your request:

spanString.SetSpan(new RelativeSizeSpan(0.5f), 0, spanString.Length(), SpanTypes.ExclusiveExclusive);  

Best Regards,

Jessie Zhang

---
If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.