首页 > 解决方案 > Xamarin.Forms:如何在 iOS 设备上隐藏导航栏分隔符?

问题描述

我已经通过使用这些代码更改了导航栏的默认颜色,app.xaml因为我无法使其在 iOS 设备上透明:

<Style TargetType="NavigationPage">
            <Setter Property="BarBackgroundColor" Value="#0a82b8" />
            <Setter Property="BarTextColor" Value="#ffffff" />
</Style>

现在,iOS 上有一个不必要的导航栏分隔符:

在此处输入图像描述

在微软的官方网站上,它说这些代码可能会有所帮助:

此特定于平台的隐藏分隔线和位于 NavigationPage 上导航栏底部的阴影。它在 XAML 中通过将 NavigationPage.HideNavigationBarSeparator 可绑定属性设置为 false 来使用:

<NavigationPage ...
                xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
                ios:NavigationPage.HideNavigationBarSeparator="true">

</NavigationPage>

或者,可以使用 fluent API 从 C# 使用它:

using Xamarin.Forms.PlatformConfiguration;
using Xamarin.Forms.PlatformConfiguration.iOSSpecific;

public class iOSTitleViewNavigationPageCS : Xamarin.Forms.NavigationPage
{
    public iOSTitleViewNavigationPageCS()
    {
        On<iOS>().SetHideNavigationBarSeparator(true);
    }
}

来源:在 NavigationPage 上隐藏导航栏分隔符

问题是,当我想将ios:NavigationPage.HideNavigationBarSeparator="true"属性粘贴到<NavigationPage>标签中时,会出现以下错误:

未找到“HideNavigationBarSeparator”的属性、可绑定属性或事件,或者值和属性之间的类型不匹配。

我的完整代码是:

<?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:My.App" x:Class="My.App.MainPage">
    <MasterDetailPage.Master>
        <ContentPage Title="Menu" BackgroundColor="#0a82b8" Icon="menu.png">
            <StackLayout Orientation="Vertical">
                <ListView x:Name="navigationDrawerList" RowHeight="55" SeparatorVisibility="None" BackgroundColor="#ffffff" ItemSelected="OnMenuItemSelected">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <!-- Main design for our menu items -->
                                <StackLayout VerticalOptions="FillAndExpand" Orientation="Horizontal" Padding="20,10,0,10" Spacing="20">
                                    <Label Text="{Binding Title}" FontSize="Large" VerticalOptions="Start" HorizontalOptions="CenterAndExpand" TextColor="#28DDFF" FontAttributes="Bold" />
                                </StackLayout>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
            </StackLayout>
        </ContentPage>
    </MasterDetailPage.Master>
    <MasterDetailPage.Detail>
        <NavigationPage xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
            ios:NavigationPage.HideNavigationBarSeparator="true">
        </NavigationPage>
    </MasterDetailPage.Detail>
</MasterDetailPage>

是我为 MasterDetail 导航所遵循的教程。有<NavigationPage>标签的文件被命名为MainPage.xaml

标签: xamarin.forms

解决方案


您可以使用自定义渲染器来隐藏该阴影:

[assembly: ExportRenderer(typeof(NavigationPage), typeof(CustomNavigationPage))]
namespace CustomNavigationPage.iOS
{
    public class CustomNavigationPage : NavigationRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            NavigationBar.SetBackgroundImage(new UIKit.UIImage(), UIKit.UIBarMetrics.Default);
            NavigationBar.ShadowImage = new UIKit.UIImage();
        }
    }
}

推荐阅读