Xamarin.Forms：如何在Android上禁用向漢堡包過渡的箭頭動畫？

Question

我已經使用Xamarin.Forms創建了一個基本的示例應用程序，在該應用程序中 ，我嘗試使用以下方法重新推崇Twitter或Instagram這樣的UI：

• MasterDetail頁面作為主頁，其中默認的“漢堡”圖標被自定義圖標替換
• “底部” TabbedPage作為MasterDetail頁面的詳細信息
• 允許在TabbedPage中實現頂部Tabs的控件
• 在NavigationPage中為TabbedPage的每個選項卡托管的ContentPages

因此，我的應用程序的頁面架構如下所示：

|-MasterDetailPage
.. | --TabbedPage
.... |-導航頁
...... |-ContentPage

為了實現這一目標，我使用了：

• Naxam BottomTabedPage ，以在Android上實現“底部” TabbedPage（例如BottomNavigationView）
• Syncfusion SfTabView控件以實現“頂部”標簽
• 一個自定義渲染器，用於管理自定義圖標在主級別上的使用，例如“漢堡”圖標，在子級上使用“箭頭”圖標

該渲染器如下所示：

public class CustomNavigationPageRenderer : MasterDetailPageRenderer
{
    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);

        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 navPage = ((app.MainPage.Navigation.ModalStack[0] as MasterDetailPage).Detail as NavigationPage);
            var detailPage = (app.MainPage as MasterDetailPage).Detail;
            if (detailPage.GetType() == typeof(BottomTp.Views.NaxamMainPage))
            {
                var tabPage = detailPage as BottomTabbedPage;
                var curPage = tabPage.CurrentPage;
                var navPageLevel = curPage.Navigation.NavigationStack.Count;
                if (navPageLevel > 1)
                    displayBack = true;
            }

            if (!displayBack)
                ChangeIcon(imageButton, Resource.Drawable.icon);
        }
    }

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

這很好用，但是當我“返回”主頁時有最后一個問題 ：

• 從箭頭到“漢堡”圖標都有默認的過渡動畫
• 之后，“漢堡包”圖標將替換為我的自定義圖標

這是一個簡短的動畫來說明此問題：

有沒有辦法停用此動畫？ 我該如何解決？

Answer 1

您需要使用自定義NavigationPage 。 這是根據您的演示 。

要實現它，需要三個步驟：

1）添加一個名為CustomControl的文件夾，創建一個繼承自NavigationPage的類MyNavigationPage ：

namespace BottomTp.CustomControl
{
    public class MyNavigationPage : NavigationPage
    {
        public MyNavigationPage() { }
        public MyNavigationPage(Page root) : base(root) { }
    }
}

2）更改您的NaxamMainPage.xaml文件中的標簽，

在您的naxam:BottomTabbedPage標簽中添加xmlns:controls="clr-namespace:BottomTp.CustomControl;assembly=BottomTp" ，然后將NavigationPage標簽更改為controls:MyNavigationPage ：

<controls:MyNavigationPage Title="Browse" Icon="md-view-list"
                x:Name="NP1">
    <x:Arguments>
        <views:SfItemsPage   />
    </x:Arguments>
</controls:MyNavigationPage>
<controls:MyNavigationPage Title="About" Icon="md-help"
                x:Name="NP2">
    <x:Arguments>
        <views:AboutPage />
    </x:Arguments>
</controls:MyNavigationPage>

3）在Android平台上創建自定義渲染MyCustomNavigationPageRenderer ：

[assembly: ExportRenderer(typeof(MyNavigationPage), typeof(MyCustomNavigationPageRenderer))]
namespace BottomTp.Droid.Renderers
{
    class MyCustomNavigationPageRenderer : NavigationPageRenderer
    {
        public MyCustomNavigationPageRenderer(Context c) : base(c)
        { }

        protected override Task<bool> OnPopToRootAsync(Page page, bool animated)
        {
            return base.OnPopToRootAsync(page, false);
        }

        protected override Task<bool> OnPopViewAsync(Page page, bool animated)
        {
            return base.OnPopViewAsync(page, false);
        }

        protected override Task<bool> OnPushAsync(Page view, bool animated)
        {
            return base.OnPushAsync(view, false);
        }

    }
}