Question

我想在保留导航栏的同时删除汉堡菜单图标。我想将内容添加到NavigationPage.TitleView属性中，并且希望它占据页面的整个宽度。在我粘贴的图像中，黄色背景颜色显示TitleView当前占据的宽度。

我知道在表格中您可以控制后退按钮的可见性，有没有办法可以控制汉堡菜单图标？根据我一直在阅读的内容，很可能需要自定义渲染器，但我尝试过没有运气。我需要支持iOS和Android。

Answer 1

在android中，您可以使用以下自定义渲染器代码。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Support.V7.Graphics.Drawable;
using Android.Views;
using Android.Widget;
using MesterDetailspage.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android.AppCompat;

[assembly: ExportRenderer(typeof(MasterDetailPage), typeof(MyMasterDetailRenderer))]
namespace MesterDetailspage.Droid
{
    public class MyMasterDetailRenderer : MasterDetailPageRenderer
    {

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

        }

        protected override void OnLayout(bool changed, int l, int t, int r, int b)
        {
            base.OnLayout(changed, l, t, r, b);
            var toolbar = FindViewById<Android.Support.V7.Widget.Toolbar>(Resource.Id.toolbar);
            if (toolbar != null)
            {
                for (var i = 0; i < toolbar.ChildCount; i++)
                {
                    var imageButton = toolbar.GetChildAt(i) as Android.Widget.ImageButton;
                    var drawerArrow = imageButton?.Drawable as DrawerArrowDrawable;
                    if (drawerArrow == null)
                        continue;
                    bool displayBack = false;
                    var app = Xamarin.Forms.Application.Current;
                    var detailPage = (app.MainPage as MasterDetailPage).Detail;
                    var navPageLevel = detailPage.Navigation.NavigationStack.Count;
                    if (navPageLevel > 1)
                        displayBack = true;
                    if (!displayBack)
                        ChangeIcon(imageButton, Resource.Drawable.test1);
                    if (displayBack) ;
                        //ChangeIcon(imageButton, Resource.Drawable.back1);
                }
            }
        }
        private void ChangeIcon(Android.Widget.ImageButton imageButton, int id)
        {
            if (Android.OS.Build.VERSION.SdkInt >= Android.OS.BuildVersionCodes.Lollipop)
                imageButton.SetImageDrawable(Context.GetDrawable(id));
            imageButton.SetImageResource(id);
        }
    }
}

我设置了透明的背景图像。

此处正在运行屏幕截图。

对于iOS，只需在xamarin形式xaml的IconImageSource="test1.png"标签中设置MasterDetailPage。

<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:d="http://xamarin.com/schemas/2014/forms/design"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            mc:Ignorable="d"
            IconImageSource="test1.png"
            xmlns:views="clr-namespace:MesterDetailspage.Views"
            x:Class="MesterDetailspage.Views.MainPage">

Answer 2

事实证明，目前这是不可能的。您可以隐藏汉堡菜单，但它仍会占用空间（请参阅卢昂的答案）。

我的解决方案是创建一个自定义导航栏，这样我就可以完全控制。如果要执行此操作，请先删除导航栏：

NavigationPage.SetHasNavigationBar(this, false);

然后使用常规xaml代码添加自定义导航，就像使用其他任何组件一样。

要记住的一件事是，在ios中，您的导航可以显示刻痕的位置，要解决此问题，您需要使用以下代码：

On<iOS>().SetUseSafeArea(true);

Xamarin表单-删除汉堡菜单图标，但保留导航栏

2 个答案: