Phill
Phill

Reputation: 427

IOS Tabs Title without icons white space on the top

I a have page with tabs, in the tabs i only want text, in android the text is centered both vertically and horizontally, without any white spaces, but in the ios version there is a white space on the top of the text, because there isnt icons. How can i remove the white space on the top?

Upvotes: 1

Views: 1365

Answers (1)

Steven Thewissen
Steven Thewissen

Reputation: 2981

You can use a custom renderer for that:

[assembly: ExportRenderer(typeof(TabbedPage), typeof(CustomTabBarRenderer))]
namespace MyProject.iOS.Renderers
{
    public class CustomTabBarRenderer : TabbedRenderer
    {
        public override void ViewWillAppear(bool animated)
        {
            if (TabBar?.Items == null)
                return;

            // Go through our elements and change them
            var tabs = Element as TabbedPage;
            if (tabs != null)
            {
                for (int i = 0; i < TabBar.Items.Length; i++)
                    UpdateTabBarItem(TabBar.Items[i]);
            }

            base.ViewWillAppear(animated);
        }

        private void UpdateTabBarItem(UITabBarItem item)
        {
            if (item == null)
                return;

            // Set the font for the title.
            item.SetTitleTextAttributes(new UITextAttributes() { Font = UIFont.FromName("Your-Font", 10) }, UIControlState.Normal);
            item.SetTitleTextAttributes(new UITextAttributes() { Font = UIFont.FromName("Your-Font", 10) }, UIControlState.Selected);

            // Moves the titles up just a bit.
            item.TitlePositionAdjustment = new UIOffset(0, -2);
        }
    }
}

The TitlePositionAdjustment is what you're looking for. You can also use this to change the font size if needed using the SetTitleTextAttributes method.

Upvotes: 3

Related Questions