Как изменить заголовок NavigationPage в Xamarin Forms MasterDetailPage - PullRequest
Новая
       21

Как изменить заголовок NavigationPage в Xamarin Forms MasterDetailPage

0 голосов
/ 19 июня 2020

По умолчанию MasterDetailPage добавляет заголовок NavigationPage в верхнюю часть представления. Я попробовал простой эксперимент, но он не сработал. Он по-прежнему отображает заголовок, а не заменяет его изображением. Есть ли простой способ переопределить область заголовка? 

<MasterDetailPage 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"
            mc:Ignorable="d"
            xmlns:views="clr-namespace:MyApp.Views"
            x:Class="MyApp.Views.MainPage">

    <MasterDetailPage.Master>
        <views:MenuPage />
    </MasterDetailPage.Master>

    <MasterDetailPage.Detail>
        <NavigationPage>
        <NavigationPage.TitleView>
            <StackLayout>
                <Image Source="MyAppLogo.png"  HorizontalOptions="CenterAndExpand" WidthRequest="50" HeightRequest="50" Aspect="AspectFill" />
            </StackLayout>
        </NavigationPage.TitleView>
            <NavigationPage.Icon>
                <OnPlatform x:TypeArguments="FileImageSource">
                    <On Platform="iOS" Value="tab_feed.png"/>
                </OnPlatform>
            </NavigationPage.Icon>
            <x:Arguments>
                <views:JobsPage />
            </x:Arguments>
        </NavigationPage>
    </MasterDetailPage.Detail>

</MasterDetailPage>

Обновление

Итак, я обнаружил, что каждая страница содержимого должна индивидуально переопределять NavigationPage.TitleView. Но цель состоит в том, чтобы на всех страницах содержимого была одинаковая строка заголовка. Итак, я выполнил рекомендацию здесь: https://forums.xamarin.com/discussion/167655/it-is-possible-to-creatre-a-navigationpage-titleview-for-all-contentpage. Я реализовал это, но я вообще ничего не вижу в строке заголовка. Что я сейчас делаю не так?

App.xaml 

<Application 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:local="clr-namespace:MyApp.Views"
             mc:Ignorable="d"
             x:Class="MyApp.App">

    <Application.Resources>
        <ResourceDictionary>
            <!--Global Styles-->
            <Color x:Key="NavigationPrimary">#2196F3</Color>
            <Color x:Key="NavbarBackground">Black</Color>
            <Style TargetType="NavigationPage">
                <Setter Property="BarBackgroundColor" Value="{StaticResource NavbarBackground}" />
                <Setter Property="BarTextColor" Value="White" />
            </Style>

            <local:CustomTitleView x:Key="CustomTitleView"/>
            <Style TargetType="ContentPage" x:Key="CustomTitle">
                <Setter Property="NavigationPage.TitleView" Value="{StaticResource CustomTitleView}"/>
            </Style>
        </ResourceDictionary>
    </Application.Resources>

</Application>

CustomTitleView.xaml 

<ContentPage 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"
             mc:Ignorable="d"
             x:Class="BuildPro.Views.CustomTitleView">
    <ContentPage.Content>
        <StackLayout>
            <Label Text="Hello world!" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

MyContentPage.xaml 

<ContentPage 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"
             mc:Ignorable="d"
             x:Class="MyApp.Views.MyPage"
             xmlns:vm="clr-namespace:MyApp.ViewModels"
             Style="{StaticResource CustomTitle}" >

    <ContentPage.BindingContext>
        <vm:MyViewModel />
    </ContentPage.BindingContext>

    <ContentPage.Content>
        <StackLayout>
            <Label Text="Welcome to the Xamarin-Forms!"
                VerticalOptions="CenterAndExpand" 
                HorizontalOptions="CenterAndExpand" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Обновить 2

Я пошутил с шаблоном для строки заголовка. Должен был быть ContentView вместо ContentPage. Совсем другой класс. Теперь это работает:

CustomTitleView 

<ContentView 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"
             mc:Ignorable="d"
             x:Class="MyApp.Views.CustomTitleView">
  <ContentView.Content>
        <StackLayout>
            <Label Text="Hello world!" TextColor="AliceBlue" />
        </StackLayout>
    </ContentView.Content>
</ContentView>

1 Ответ

1 голос
/ 19 июня 2020

Вы должны добавить NavigationPage.TitleView в Xaml каждой Подробности Страницы ( Обычно Content Page), а не Xaml из MasterDetailPage .

Например, Xaml из просмотров: JobsPage можно изменить следующим образом: 

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage 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"
             mc:Ignorable="d"
             x:Class="AppFormsMaster.Views.ItemsPage"
             Title="{Binding Title}"
             x:Name="BrowseItemsPage">

    <NavigationPage.TitleView>
        <StackLayout>
            <Image Source="MyAppLogo.png"  HorizontalOptions="CenterAndExpand" WidthRequest="50" HeightRequest="50" Aspect="AspectFill" />
        </StackLayout>
    </NavigationPage.TitleView>

    <ContentPage.Content>
         //...
         //Content of Content Page    
         //...
    </ContentPage.Content>
</ContentPage>

Тогда будет отображаться NavigationPage.TitleView.

...