How to customize the TabbedPage's Tab-Items in Xamarin.Forms?

Viewed 3067

I'm using a TabbedPage as my MainPage of my Xamarin.Forms app (Xamarin.Forms Version: 2.3.5.239-pre3). My MainActivity inherits from FormsAppCompatActivity.

There are four pages of type ContentPage added to the TabbedPage like:

<TabbedPage ... >    

   <pages:FirstPage Title="Testpage1" Icon="icon.png" />
   <pages:SecondPage Title="Testpage2"  Icon="icon.png" />
   <pages:ThirdPage Title="Testpage3"  Icon="icon.png" />
   <pages:FourthPage Title="Testpage3"  Icon="icon.png" />

</TabbedPage>

However, the tabs are displayed like:

enter image description here

Now I need to change the font size of the title property, so the whole title will be displayed. Whats the best way to do this? I tried a CustomRenderer but I couldn't figure out how to access the tab-items.

I tried:

      [assembly: ExportRenderer(typeof(TabbedPage), typeof(CustomTab))]
       namespace AdvancedForms.Droid.CustomRenderer
       {
            public class CustomTab : TabbedRenderer
            {
                protected override void DispatchDraw(Canvas canvas)
                {    
                  base.DispatchDraw(canvas);
                  ActionBar actionBar = activity.ActionBar;
                  // Do Stuff here
                }
            }
        }

But activity.ActionBar is always null.

2 Answers

For Custom tab view/page i am using the xam.Tabview (Xamarin.Forms) Component and it's working as expected. It has the support for custom header and content view.

Install Nuget: TabView Nuget

Sample: Tabview Sample

Related