Forum Xamarin Xamarin.Forms

How to Change Tab's Title Font-Family?

AzizAziz Member ✭✭

Hi There,

I'm using a custom font in my XF project (Embedded resource) and setting the style for each control in the applicaion.resources, which is working great.

However, I also need to set the FontFamily for the Tabs in my TabBar, preferably without CustomShellRenderer and copying fonts in each target platform. Any hints on how to do so?

Thanks,

Best Answers

Answers

  • AzizAziz Member ✭✭

    @ColeX many thanks for the clear answer. For Android I got stuck at (MainActivity.Instance.Assets), MainActivity doesn't contain Instance!

    For iOS, I did add the *.tff to the Resources folder and set the build action to "BundleResource" , added the two lines in the AppDelegate::FinishedLaunching just before the "return base.FinishedLaunching(app, options)" ... but didn't have any effect.

  • AzizAziz Member ✭✭

    @ColeX beautiful, many thanks! now it works with iOS.

    However, with Android, I don't have compilation issue anymore, but still doesn't work. It seems that ResetAppearance(BottomNavigationView bottomView) is never called. I set breaking point on IMenu menu = bottomView.Menu; which is never reached.
    However, moving the code into SetAppearance instead did the trick! but I'm not sure if this would result in any other unexpected behavior.

  • ImTornImTorn USMember

    @ColeX This is really helpful - thanks! Are you able to tell me how to change the font for top tabs on Android, please?

    I've worked out how to do this for iOS but cannot figure out Android. To assist others in future, the iOS solution follows...

    First, copy the font (e.g. Pacifico.ttf) file into Resources/Fonts in the iOS project, with the Build Action set to BundleResource. Then, create the following custom renderer...

    using CoreGraphics;
    using Foundation;
    using Test.iOS.Renderers;
    using UIKit;
    using Xamarin.Forms;
    using Xamarin.Forms.Platform.iOS;
    
    [assembly: ExportRenderer(typeof(Test.Views.AppShellPage), typeof(CustomShellRenderer))]
    namespace Test.iOS.Renderers
    {
        public class CustomShellRenderer : ShellRenderer
        {
            protected override IShellSectionRenderer CreateShellSectionRenderer(ShellSection shellSection)
            {
                var renderer = new CustomShellSectionRenderer(this);
                if (renderer != null)
                    renderer.NavigationBar.Translucent = false;
                return renderer;
            }
    
            protected override IShellItemRenderer CreateShellItemRenderer(ShellItem item)
            {
                var renderer = base.CreateShellItemRenderer(item);
                if (renderer != null)
                    (renderer as ShellItemRenderer).TabBar.Translucent = false;
                return renderer;
            }
        }
    
        public class CustomShellSectionRenderer : ShellSectionRenderer
        {
            public CustomShellSectionRenderer(IShellContext context) : base(context)
            {
            }
    
            protected override IShellSectionRootRenderer CreateShellSectionRootRenderer(ShellSection shellSection, IShellContext shellContext)
            {
                var renderer = new CustomShellSectionRootRenderer(shellSection, shellContext);
                return renderer;
            }
        }
    
        public class CustomShellSectionRootRenderer : ShellSectionRootRenderer
        {
            public CustomShellSectionRootRenderer(ShellSection section, IShellContext context) : base(section, context)
            {
            }
    
            protected override IShellSectionRootHeader CreateShellSectionRootHeader(IShellContext shellContext)
            {
                var renderer = new CustomShellSectionRootHeader(shellContext);
                return renderer;
            }
        }
    
        public class CustomShellSectionRootHeader : ShellSectionRootHeader
        {
            public CustomShellSectionRootHeader(IShellContext context) : base(context)
            {
    
            }
    
            public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath)
            {
                var cell = base.GetCell(collectionView, indexPath) as ShellSectionHeaderCell;
                cell.Label.Font = UIFont.FromName("Pacifico", 13);
                return cell;
            }
        }
    
        public class CustomUICollectionViewFlowLayout : UICollectionViewFlowLayout
        {
            public override UICollectionViewLayoutAttributes[] LayoutAttributesForElementsInRect(CGRect rect)
            {
                return base.LayoutAttributesForElementsInRect(rect);
            }
        }
    }
    
  • ImTornImTorn USMember

    @ColeX Incidentally, in trying to change the font on Shell top tabs on Android, I have tried following your solution here but that doesn't work - I suspect it is because Shell is working from a different class. Is some adjustment needed to get that working in Shell or is the approach completely different? Any help gratefully received...

Sign In or Register to comment.