在 Xamarin Forms 的主从导航中更改汉堡菜单图标

Question

我正在开发Xamarin Forms应用程序，需要在成功登录后显示主细节导航。我想更改默认的汉堡图标，但无法更改。

请查看下面的代码：

由于我的应用程序有登录屏幕，因此我不想在登录屏幕上显示任何导航。我只是在app.xaml.cs中设置了主页面。

public App()
{
    InitializeComponent();

    MainPage = new Login();
}

现在，我在点击登录后尝试了以下方法来更改图标，但没有成功。

var dashboard = new Dashboard(){Icon = "Menuicon.png" };
Application.Current.MainPage = dashboard;

Dashboard是一个主从页面，它的构造函数中，我像下面这样设置了详细页面：

Detail = new NavigationPage((Page)Activator.CreateInstance(typeof(DashbaordDetail))) { Icon = "Menuicon.png" };

它没有反映出新图标。

- Mahajan344

Answer 1

您应该使用自定义渲染器。

在您的Android项目中，就像这样：

[assembly: ExportRenderer(typeof(CustomIcon.Views.MainPage), typeof(IconNavigationPageRenderer))]
namespace CustomIcon.Droid
{
    public class IconNavigationPageRenderer : MasterDetailPageRenderer
    {
        private static Android.Support.V7.Widget.Toolbar GetToolbar() => (CrossCurrentActivity.Current?.Activity as MainActivity)?.FindViewById<Android.Support.V7.Widget.Toolbar>(Resource.Id.toolbar);

        protected override void OnLayout(bool changed, int l, int t, int r, int b)
        {
            base.OnLayout(changed, l, t, r, b);
            var toolbar = GetToolbar();
            if (toolbar != null)
            {
                for (var i = 0; i < toolbar.ChildCount; i++)
                {
                    var imageButton = toolbar.GetChildAt(i) as ImageButton;

                    var drawerArrow = imageButton?.Drawable as DrawerArrowDrawable; 
                    if (drawerArrow == null)
                        continue;

                    imageButton.SetImageDrawable(Forms.Context.GetDrawable(Resource.Drawable.newIcon));
                }
            }
        }
    }
}

在你的iOS项目中，只需使用来自PCL项目中xaml文件的相同图标，如下所示：

<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage  xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:CustomIcon.Views;assembly=CustomIcon"
         Title="MainPage"
         Icon="newIcon.png"
         x:Class="CustomIcon.Views.MainPage">
<MasterDetailPage.Master>
    <local:MasterPage x:Name="masterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
    <NavigationPage>
        <x:Arguments>
            <local:Page1 />
        </x:Arguments>
    </NavigationPage>
</MasterDetailPage.Detail>

更多信息请参考我的github存储库：https://github.com/wilsonvargas/CustomIconNavigationPage

- Wilson Vargas

---

我是唯一一个找不到“CrossCurrentActivity”的人吗？ - Ahmed Salah

@AhmedSalah 你需要安装这个包 "CurrentActivityPlugin"。 - VahidShir

@WilsonVargas 当我从未包装在NavigationPage中的登录页面切换到MainePage时，GetToolbar()返回null。 - VahidShir

为什么这个答案被标记了？这不是正确的答案。我尝试运行相同的代码，但在返回按钮方面遇到了相同的问题。 - Sagar Panwala

@Gold.strike 的解决方案：https://dev59.com/Kabja4cB1Zd3GeqPlMB0 - BrianSouza

Answer 2

我使用了这个技巧，它帮助了我。现在即使在导航后我也能看到返回按钮。

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 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.iconMenu2);
            if (displayBack)
                ChangeIcon(imageButton, Resource.Drawable.back1);
        }
    }
}
private void ChangeIcon(ImageButton imageButton, int id)
{
    if (Android.OS.Build.VERSION.SdkInt >= Android.OS.BuildVersionCodes.Lollipop)
        imageButton.SetImageDrawable(Context.GetDrawable(id));
    imageButton.SetImageResource(id);
}

- Ronak Shethia

---

你能帮忙处理iOS渲染器吗？ - Blu

@Blu 我建议在你的基础页面上创建一个自定义布局，隐藏你的导航栏，并在所有内容页面中使用该自定义布局。 - Ronak Shethia