时间戳

首页 > 解决方案 > 如何在选择时阻止 TabbedPage 图标向上移动

c# - 如何在选择时阻止 TabbedPage 图标向上移动

问题描述

我正在尝试构建一个导航栏，上面有 5 个图标（每个图标都有自己的页面）。我目前遇到的问题是，每当我单击其中一个图标时，它会在您选择该页面时将其向上移动一点（有点弹出）。我知道它可能是某种必须设置为 false 的属性，但我不知道具体是哪个。任何帮助将不胜感激，谢谢。

MainPage.xaml 的 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:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:views="clr-namespace:StudioDen.View"
            mc:Ignorable="d"
            x:Class="StudioDen.MainPage"
            BarBackgroundColor="#FFDA00"
            UnselectedTabColor="Black"
            SelectedTabColor="Black">
            <!--The last three properties set the colours of the bar to yellow and the icons to black-->


    <!--Projects view on the tabbed page-->
    <NavigationPage IconImageSource="ic_projects.png" >
        <x:Arguments>
            <views:Projects />
        </x:Arguments>
    </NavigationPage>

    <!--Events view on the tabbed page-->
    <NavigationPage IconImageSource="ic_events.png" >
        <x:Arguments>
            <views:Events/>
        </x:Arguments>
    </NavigationPage>

    <!--Upload view on the tabbed page-->
    <NavigationPage IconImageSource="ic_uploadV2.png" >
        <x:Arguments>
            <views:Upload/>
        </x:Arguments>
    </NavigationPage>

    <!--Process view on the tabbed page-->
    <NavigationPage IconImageSource="ic_processV3.png" >
        <x:Arguments>
            <views:Process />
        </x:Arguments>
    </NavigationPage>

    <!--Login view on the tabbed page-->
    <NavigationPage IconImageSource="ic_loginV2.png" >
        <x:Arguments>
            <views:Login />
        </x:Arguments>
    </NavigationPage>
</TabbedPage>

选择了第三个图标的导航栏图像： navBar_Screenshot

标签： c#androidxamlxamarin.formstabbedpage

解决方案

这是Android默认做的事情。您可以通过为其编写效果来禁用它。

确保您使用的是 28.0.0.1 Android 支持库并针对 Android 9.0 (Pie)。如果你不能，你可以尝试一个（坏的）反射技巧。

将此添加NoShiftEffect.cs到您的 Android 项目中，当然还可以重命名特定于您的项目和解决方案的命名空间和其他值：

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

[assembly:ResolutionGroupName ("MyCompany")]
[assembly:ExportEffect (typeof(NoShiftEffect), "NoShiftEffect")]
namespace App16.Droid
{
    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 ()
        {
        }
    }
}

现在将另一个添加NoShiftEffect.cs到您的共享项目中：

using Xamarin.Forms;

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

最后消耗你的效果TabbedPage：

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

感谢 James Montemagno 和他在此处发表的文章。

推荐阅读