How to change the Fontsize for text in tabs in TabbedPage

Question

I am working on Xamarin forms, it seems I need to adjust the FontSize for text in each tabs when I have to include a number of tabs for TabbedPage.

Problem: How to adjust the fontsize for the Tabs?

I tried to use the properties of the tab, but there is none.

public Product()
{
    InitializeComponent();  

    this.title = ??
}



<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"          
            xmlns:local ="clr-namespace:MyApp.View"  
            BackgroundColor="White"
            Title="Product and Service"          
            x:Class="MayApp.View.MainMenu">
    <ContentPage.ToolbarItems>
        <ToolbarItem Name="MenuItem1" Order="Primary" Icon="itemIcon1" Command="{Binding Item1Command}"  Priority="0" />
        <ToolbarItem Name="MenuItem2" Order="Primary" Icon="itemIcon2" Priority="1" />
    </ContentPage.ToolbarItems>

    <local:Product>
    </local:Product>

    <local:Service>
    </local:Service>   

</TabbedPage>

My previous [answer](https://stackoverflow.com/a/38916926/5912513) might be helpful — Yehor Hromadskyi, Jul 05 '17 at 07:59
@Yehor how to handle for both iOS and Android? Your solution applies to Droid only. — MilkBottle, Jul 05 '17 at 08:12
Please consider marking as an answer/upvoting if an answer helped you. — Steven Thewissen, Jul 11 '17 at 12:07

score 0 · Answer 1 · answered Jul 06 '17 at 07:01

0

To change this for iOS you will need a custom renderer with code that iterates over the TabBar items and changes their font size using UITextAttributes. There is no way to do it in Xamarin.Forms itself.

if (TabBar.Items != null)
{
    foreach (var t in TabBar.Items)
    {
        var fontSize = new UITextAttributes() { Font =   UIFont.SystemFontOfSize(15) };
        t.SetTitleTextAttributes(fontSize, UIControlState.Normal);
    }
}

answered Jul 06 '17 at 07:01

Steven Thewissen

2,971
17
23

Do I need to create a custom class that inherits a Custom renderer? Which Custom Renderer to subclass. Use the same approach for Android? – MilkBottle Jul 10 '17 at 06:25
I believe an Android solution has been given above already. You should be subclassing TabBarRenderer. – Steven Thewissen Jul 10 '17 at 06:28

How to change the Fontsize for text in tabs in TabbedPage

1 Answers1