Search code examples
androidiosxamarin.formsheighttabbar

Xamarin.Forms.Shell: how to get the bottom TabBar height?


I work on a Xamarin.Forms.Shell app using the default bottom TabBar, and I need to know the TabBar height to adjust some items.

I've found a way to get the StatusBar height on both platforms there, but I didn't found a solution for the TabBar.

Is it possible? I only found requests about changing the TabBar height on Stack...


Solution

  • We could get the height by using Custom Renderer

    in AppShell

    public partial class AppShell : Xamarin.Forms.Shell
    {
       public static double TabHeight { get; set; }
    
      //...
    }
    

    in iOS project

    Option 1:

    
    using App33;
    using App33.iOS;
    using Foundation;
    using UIKit;
    using Xamarin.Forms;
    using Xamarin.Forms.Platform.iOS;
    
    [assembly: ExportRenderer(typeof(AppShell), typeof(ShellCustomRenderer))]
    namespace App33.iOS
    {
        public class ShellCustomRenderer : ShellRenderer
        {
            protected override IShellTabBarAppearanceTracker CreateTabBarAppearanceTracker()
            {
                return new TabBarAppearance();
            }
    
        }
    
        public class TabBarAppearance : IShellTabBarAppearanceTracker
        {
            public void Dispose()
            {
    
            }
    
            public void ResetAppearance(UITabBarController controller)
            {
                
    
    
            }
    
            public void SetAppearance(UITabBarController controller, ShellAppearance appearance)
            {
                base.ViewWillAppear(animated);
    
                UITabBar myTabBar = this.TabBarController.TabBar;
    
                myTabBar.TintColor = UIColor.Red;
                myTabBar.BarTintColor = UIColor.LightGray;
                //... you can set style like above in iOS
    
                AppShell.TabHeight  = myTabBar.Bounds.Height;
    
            }
    
            public void UpdateLayout(UITabBarController controller)
            {
               
            }
        }
    }
    

    Option 2:

    Actually, The height of UITabbar on iOS is a fixed value . On iPhone 8 and before is 49 and iPhone X and after(full-screen) will have an extra safeArea bottom height . So if you just want to get it (don't need to set the height) , you could get it directly by using DependencyService like following

    AppShell.TabHeight = 49 + UIApplication.SharedApplication.Delegate.GetWindow().SafeAreaInsets.Bottom;
    
    

    in Android

     public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
        {
            protected override void OnCreate(Bundle savedInstanceState)
            {
                TabLayoutResource = Resource.Layout.Tabbar;
                ToolbarResource = Resource.Layout.Toolbar;
    
                base.OnCreate(savedInstanceState);
        //        var hei=SupportActionBar.Height;
                Xamarin.Essentials.Platform.Init(this, savedInstanceState);
                global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
                LoadApplication(new App());
    
    
                int resourceId =Resources.GetIdentifier("design_bottom_navigation_height", "dimen", this.PackageName);
                int height = 0;
                if (resourceId > 0)
                {
                    height = Resources.GetDimensionPixelSize(resourceId);
                    AppShell.TabHeight = height;
                }
    
             
    
    
            }
            public override void OnRequestPermissionsResult(int requestCode, string[] permissions, [GeneratedEnum] Android.Content.PM.Permission[] grantResults)
            {
                Xamarin.Essentials.Platform.OnRequestPermissionsResult(requestCode, permissions, grantResults);
    
                base.OnRequestPermissionsResult(requestCode, permissions, grantResults);
            }
        }
    }