在 Android 和 Xamarin.Forms 的标签页中隐藏底部标签栏

Question

我创建了一个标签页并将导航栏设置在底部。现在我需要隐藏特定页面上的导航栏。对于 iOS，我使用了这个渲染器：here，但我找不到 Android 的类似解决方案。我试过这个：

public TabbedPageRendererDroid(Context context) : base(context)
        {

        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if (e.PropertyName == "IsHidden")
            {
                TabLayout TabsLayout = null;
                for (int i = 0; i < ChildCount; ++i)
                {
                    Android.Views.View view = (Android.Views.View)GetChildAt(i);
                    if (view is TabLayout)
                        TabsLayout = (TabLayout)view;
                }
                if ((Element as CustomTabbedPage).IsHidden)
                {
                    TabsLayout.Visibility = ViewStates.Invisible;
                }
                else
                {
                    TabsLayout.Visibility = ViewStates.Visible;
                }
            }
        }

这仅适用于顶部的普通导航栏，但不适用于底部导航栏，并且应用程序崩溃并出现此错误：System.NullReferenceException。

Android有解决办法吗，先谢谢了。

Answer 1

如果你想在自定义渲染器中隐藏它，你可以使用下面的代码来隐藏 bottom navigation bar,

    public class ExtendedTabbedPageRenderer: TabbedPageRenderer
    {
        public ExtendedTabbedPageRenderer(Context context) : base(context) { }
        protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
        {
            base.OnElementChanged(e);
            if (e.OldElement == null && e.NewElement != null)
            {
                for (int i = 0; i <= this.ViewGroup.ChildCount - 1; i++)
                {
                    var childView = this.ViewGroup.GetChildAt(i);
                    if (childView is ViewGroup viewGroup)
                    {
                        for (int j = 0; j <= viewGroup.ChildCount - 1; j++)
                        {
                            var childRelativeLayoutView = viewGroup.GetChildAt(j);
                            if (childRelativeLayoutView is BottomNavigationView)
                            {
                                ((BottomNavigationView)childRelativeLayoutView).Visibility = ViewStates.Gone;
                            }
                        }
                    }
                }
            }
        }

顺便说一句，如果您显示一些需要使用导航隐藏 BottomNavigationView 的页面。您不需要使用上面的代码。只需使用await Navigation.PushAsync(new ItemDetailPage(new ItemDetailViewModel(item)));，这个BottomNavigationView就会像这个GIF一样被隐藏。

Answer 2

@Leon Lu 的贡献 - MSFT 帮助我找到了解决方案。这是与 this 一起工作的 Android 渲染器。

using System;
using System.ComponentModel;
using Android.Content;
using Android.Support.Design.Widget;
using Android.Views;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android.AppCompat;

[assembly: ExportRenderer(typeof(CustomTabbedPage), typeof(TabbedPageRendererDroid))]
namespace myApp.Droid.Platform
{
    [Obsolete]
    public class TabbedPageRendererDroid : TabbedPageRenderer
    {
        private int TabBarHeight;

        public TabbedPageRendererDroid(Context context) : base(context) { }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            ShowOrHideBottomNavBar((Element as CustomTabbedPage).IsHidden);
        }

        private void ShowOrHideBottomNavBar(bool hide)
        {
            for (int i = 0; i <= this.ViewGroup.ChildCount - 1; i++)
            {
                var childView = this.ViewGroup.GetChildAt(i);
                if (childView is ViewGroup viewGroup)
                {
                    for (int j = 0; j <= viewGroup.ChildCount - 1; j++)
                    {
                        var childRelativeLayoutView = viewGroup.GetChildAt(j);
                        if (childRelativeLayoutView is BottomNavigationView)
                        {
                            if (((BottomNavigationView)childRelativeLayoutView).LayoutParameters.Height != 0) TabBarHeight = ((BottomNavigationView)childRelativeLayoutView).LayoutParameters.Height;

                            var parameters = ((BottomNavigationView)childRelativeLayoutView).LayoutParameters;
                            parameters.Height = hide ? 0 : TabBarHeight;

                            ((BottomNavigationView)childRelativeLayoutView).LayoutParameters = parameters;
                        }
                    }
                }
            }
        }
    }
}

在 Android 和 Xamarin.Forms 的标签页中隐藏底部标签栏

Hide bottom tab bar in tabbed page in Android with Xamarin.Forms

android

xamarin.forms

android-bottomnav

android-bottomnavigationview