Question

Xamarin.Forms 3.1版本中有一项功能，我们已经支持将Android工具栏放置在底部。但是，当“选项卡式页面”中的内容页面大于4时，工具栏将不会在其中显示所有选项卡，而只会显示当前活动的选项卡。其他选项只能切换，然后相应地选择选项卡。这是我的代码，工具栏中应该有四个选项卡：

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage
x:Class="MelkRadar.App.MobileApp.Views.TabbedView"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
xmlns:view="clr-namespace:MelkRadar.App.MobileApp.Views"
android:TabbedPage.ToolbarPlacement="Bottom"
BarTextColor="Red">

<view:CustomerExplorerView Title="مشتریان" />
<view:RealtorSettingView Title="تنظیمات" />
<view:FavoriteAdvertsExplorerView Title="زونکن" />
<view:AdvertsExplorerView Title="اگهی ها" />

</TabbedPage>

请查看此图片

https://cdn1.imggmi.com/uploads/2019/6/11/6659fa76fc68ae58deb17d6dfd74f089-full.jpg https://cdn1.imggmi.com/uploads/2019/6/11/150fe2463357f9008da3bed6d976d1bd-full.jpg

我需要显示所有页面标题。我该怎么办？

Answer 1

嗨，这是底部标签栏的一个已知问题，当有3个以上的项目时，android将激活移位模式。您可以执行自定义渲染来解决此问题。

从此处将粘贴代码复制到您的项目中，以实现自定义渲染以关闭移位模式 https://gist.github.com/LynoDesu/64904b6d143892cf14a60a32798a36bb

Answer 2

您可以使用Routing Effect来修复它，该功能可以禁用移位并正确显示标签。

可重用的效果比自定义效果更好，更安全且更易于使用使用反射的渲染器。

首先请确保针对Android 9.0（目标Frameowrk）进行编译，并将Xamarin Android支持库更新至v28 +

在平台代码（Android项目）中创建以下效果：

using Android.Support.Design.BottomNavigation;
using Android.Support.Design.Widget;
using Android.Views;
using KvApp.Droid.Effects;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly:ResolutionGroupName ("MelkRadar")]
[assembly:ExportEffect (typeof(NoShiftEffect), nameof(NoShiftEffect))]
namespace MelkRadar.Droid.Effects
{
    public class NoShiftEffect : PlatformEffect
    {
        protected override void OnAttached ()
        {
            if (!(Container.GetChildAt(0) is ViewGroup layout))
                return;

            if (!(layout.GetChildAt(1) is BottomNavigationView bottomNavigationView))
                return;

            // This is what we set to adjust if the shifting happens
            bottomNavigationView.LabelVisibilityMode = LabelVisibilityMode.LabelVisibilityLabeled;
        }

        protected override void OnDetached ()
        {
        }
    }
}

在共享代码中添加效果（NetStandard项目）

using Xamarin.Forms;

namespace MelkRadar
{
    public class NoShiftEffect : RoutingEffect
    {
        public NoShiftEffect() : base("MelkRadar.NoShiftEffect")
        {
        }
    }
}

现在，您可以在Xaml页面中使用该效果了：

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage
x:Class="MelkRadar.App.MobileApp.Views.TabbedView"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
xmlns:view="clr-namespace:MelkRadar.App.MobileApp.Views"
android:TabbedPage.ToolbarPlacement="Bottom"
BarTextColor="Red">

<TabbedPage.Effects>
    <local:NoShiftEffect />
</TabbedPage.Effects>

<view:CustomerExplorerView Title="مشتریان" />
<view:RealtorSettingView Title="تنظیمات" />
<view:FavoriteAdvertsExplorerView Title="زونکن" />
<view:AdvertsExplorerView Title="اگهی ها" />

</TabbedPage>

更多关于效果here

James Montemagno here

的完整指南

TabbedPage工具栏仅在ToolbarPlacement位于底部且ContentPage计数大于4时显示活动的ToolbarItem。

2 个答案: