web-dev-qa-db-ja.com

Xamarin Forms 3.1で、4つのタブがあるタブ付きページを使用している場合、Androidでタブバーの「スライド」効果を防ぐにはどうすればよいですか？

4ページのアプリがあり、（Xamarin以外の）iOSアプリと同じように見せたいので、下部にツールバーを配置します。これが私のMainPage.xamlファイルです：

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.Microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:XaBLE1"
             x:Class="XaBLE1.MainPage"
            Title="Safe-T Sim" HeightRequest="768" WidthRequest="512" 

            BarBackgroundColor="#F1F1F1"
            BarTextColor="Gray"
            xmlns:Android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;Assembly=Xamarin.Forms.Core"
            Android:TabbedPage.ToolbarPlacement="Bottom"
            Android:TabbedPage.BarItemColor="#666666"
            Android:TabbedPage.BarSelectedItemColor="Black"
            >

    <NavigationPage Title="Test" Icon="ElectTest.png"
                    HasNavigationBar="False">
        <x:Arguments>
            <local:TestPage />
        </x:Arguments>
    </NavigationPage>
    <NavigationPage Title="Review" Icon="Review.png"
                    HasNavigationBar="False">
        <x:Arguments>
            <local:ReviewPage />
        </x:Arguments>
    </NavigationPage>
    <NavigationPage Title="Setup" Icon="Gear.png"
                    HasNavigationBar="False">
        <x:Arguments>
            <local:SetupPage />
        </x:Arguments>
    </NavigationPage>
    <NavigationPage Title="Info" Icon="Info.png"
                    HasNavigationBar="False">
        <x:Arguments>
            <local:InfoPage />
        </x:Arguments>
    </NavigationPage>
</TabbedPage>

Oreoの現在のルックアンドフィールは気にしません。これは、選択したページタブを大きくしてタイトルを配置し、他のタブを脇に押してページタイトルを削除することです。
Bottom Tab Bar with 2nd page selected

とにかくこの動作を無効にして、4つのタブにすることはできますか？タブが3つある場合、この動作は発生しないことに注意してください。アイコンとテキストが暗くなり、わずかに拡大するだけですが、両方が表示されます。

編集：コメントで提案された答えを試しましたが、前述のように、これが同じ問題を解決しようとしているのかどうかはわかりません。いずれの場合も動作は変わりません。

xamarinxamarin.formsxamarin.androidtabbedpage
5
bobwki

この（まだ実装されていない）機能を探しているようです： [拡張]下部ナビゲーションバーの固定モードを実装するAndroid（Github）

これに従って解決できます James Montemagnoチュートリアル：Xamarin.AndroidでのBottomNavigationViewのアイコンシフトの削除 そして独自のタブ付きページカスタムレンダラーの実装：

using Android.Content;
using Android.Support.Design.Internal;
using Android.Views;
using FixedTabbedPage.Droid.CustomRenderers;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using Xamarin.Forms.Platform.Android.AppCompat;

[Assembly: ExportRenderer(typeof(TabbedPage), typeof(CustomTabbedPageRenderer))]
namespace FixedTabbedPage.Droid.CustomRenderers
{
    public class CustomTabbedPageRenderer : TabbedPageRenderer
    {
        public CustomTabbedPageRenderer(Context context) : base(context) { }

        protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
        {
            base.OnElementChanged(e);

            if (ViewGroup != null && ViewGroup.ChildCount > 0)
            {
                BottomNavigationMenuView bottomNavigationMenuView = FindChildOfType<BottomNavigationMenuView>(ViewGroup);

                if (bottomNavigationMenuView != null)
                {
                    var shiftMode = bottomNavigationMenuView.Class.GetDeclaredField("mShiftingMode");

                    shiftMode.Accessible = true;
                    shiftMode.SetBoolean(bottomNavigationMenuView, false);
                    shiftMode.Accessible = false;
                    shiftMode.Dispose();

                    for (var i = 0; i < bottomNavigationMenuView.ChildCount; i++)
                    {
                        var item = bottomNavigationMenuView.GetChildAt(i) as BottomNavigationItemView;
                        if (item == null) continue;                         

                        item.SetShiftingMode(false);
                        item.SetChecked(item.ItemData.IsChecked);
                    }

                    if (bottomNavigationMenuView.ChildCount > 0) bottomNavigationMenuView.UpdateMenuView();
                }
            }
        }

        private T FindChildOfType<T>(ViewGroup viewGroup) where T : Android.Views.View
        {
            if (viewGroup == null || viewGroup.ChildCount == 0) return null;

            for (var i = 0; i < viewGroup.ChildCount; i++)
            {
                var child = viewGroup.GetChildAt(i);

                var typedChild = child as T;
                if (typedChild != null) return typedChild;

                if (!(child is ViewGroup)) continue;

                var result = FindChildOfType<T>(child as ViewGroup);

                if (result != null) return result;
            }

            return null;
        }
    }
}

このコードをAndroidソリューション（名前空間のリファクタリング）に追加するだけで、結果は次のようになります。

Bottom Fixed TabbedPage on Android

10
J. Aguilar

タブスワイプを無効にするには、TabbedPageクラスでPlatformConfigurationを使用できます

public partial class MyTabbedPage : TabbedPage
{
    public MainTabbedPage ()
    {
        InitializeComponent();
        this.On<Xamarin.Forms.PlatformConfiguration.Android>().SetIsSwipePagingEnabled(false);    
    }
}

myTabbedPageクラスがない場合は、axmlファイル構造が次のようになるよりも追加します。

<?xml version="1.0" encoding="utf-8" ?>
<MyTabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.Microsoft.com/winfx/2009/xaml"
         x:Class="XaBLE1.MainPage">   
</MyTabbedPage>
1
Arvind Chourasiya

Android 9なので、もっと簡単な方法があるようです。

James Matemagnoのブログから

1
Daniel