Forum› Xamarin.Forms

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

PacodosoPacodoso FRUniversity ✭✭✭
in Xamarin.Forms

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...

Tagged:

Answers

  • LeonLuLeonLu Member, Xamarin Team Xamurai

    You can create an custom renderer for your shell.

    In Android,you cannot get the height at the beginning, when you switch the tab, you can get the height value:

    [assembly: ExportRenderer(typeof(AppShell), typeof(ShellCustomRenderer))]
namespace XamarinShell.Droid
{
    public class ShellCustomRenderer : ShellRenderer
    {
        public ShellCustomRenderer(Context context) : base(context)
        {

        }

        protected override IShellBottomNavViewAppearanceTracker CreateBottomNavViewAppearanceTracker(ShellItem shellItem)
        {
            return new MarginedTabBarAppearance();
        }
    }


    public class MarginedTabBarAppearance : IShellBottomNavViewAppearanceTracker
    {
        public void Dispose()
        {

        }

        public void ResetAppearance(BottomNavigationView bottomView)
        {

        }

        public void SetAppearance(BottomNavigationView bottomView, IShellAppearanceElement appearance)
        {

            int myTabbarHeight = bottomView.Height;

            if (myTabbarHeight>0)
            {
               AppShell.AndroidTabbarHeight = myTabbarHeight;
            }
        }
    }
}

    In the iOS, you can get the height like following code.

    [assembly: ExportRenderer(typeof(AppShell), typeof(ShellCustomRenderer))]
namespace XamarinShell.iOS
{
    public class ShellCustomRenderer : ShellRenderer
    {
        protected override IShellTabBarAppearanceTracker CreateTabBarAppearanceTracker()
        {
            return new TabBarAppearance();
        }

    }

    public class TabBarAppearance : IShellTabBarAppearanceTracker
    {
        public void Dispose()
        {

        }

        public void ResetAppearance(UITabBarController controller)
        {
            UITabBar myTabBar = controller.TabBar;

            double mytabbarHeight=myTabBar.Bounds.Height;
            AppShell.iOsTabbarHeight = mytabbarHeight;
        }

        public void SetAppearance(UITabBarController controller, ShellAppearance appearance)
        {
        }

        public void UpdateLayout(UITabBarController controller)
        {
        }
    }
}
  • PacodosoPacodoso FRUniversity ✭✭✭

    Hi @LeonLu
    As I need to get this information on the HomePage, this solution wouldn't help me :/
    In add, I lose the styles specified inShell.xaml when I use the renderers.

  • LeonLuLeonLu Member, Xamarin Team Xamurai

    If you cannot accept way in android, you can set the height that you want, if you want to adjust your view.

    public void SetAppearance(BottomNavigationView bottomView, IShellAppearanceElement appearance)
        {

            int myTabbarHeight = bottomView.Height;

            var layoutParams = bottomView.LayoutParameters;
            layoutParams.Height = 200;
            bottomView.LayoutParameters = layoutParams;

        }
  • PacodosoPacodoso FRUniversity ✭✭✭

    I don't want to change the TabBar height, but I need to know the TabBar height to set limit of a scrollable item.

  • LeonLuLeonLu Member, Xamarin Team Xamurai
    edited November 2020

    You can get the height in the OnCreate() method directly.

     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);
            }

        }
        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);
        }
    }
}
  • PacodosoPacodoso FRUniversity ✭✭✭

    @LeonLu
    This sounds good for Android. For iOS I need to use the renderer?

  • LeonLuLeonLu Member, Xamarin Team Xamurai

    In the IOS, you do not need to use custom renderer to achieve it.

    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;

    You can see Lucas's reply.

    https://stackoverflow.com/questions/64892392/xamarin-forms-shell-how-to-get-the-bottom-tabbar-height

  • LeonLuLeonLu Member, Xamarin Team Xamurai

    @Pacodoso Are there any update for this issue, please reply is helpful, please click the Yes tab under the helpful answer.

Sign In or Register to comment.