Блог

Есть ли какой-нибудь способ создать статический заголовок, который фиксируется в верхней части экрана при использовании нижней навигации на основе страниц с вкладками? При навигации страницы перемещаются влево/вправо, а за ними следует текущий заголовок. Заголовок создается шаблоном со следующим кодом:

 <ResourceDictionary>
        <ControlTemplate x:Key="Template">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.1*" />
                </Grid.RowDefinitions>
                <BoxView Color="Black" />
                <Label 
                    Text="xyz"
                    TextColor="White"
                    FontSize="15"
                    FontFamily="Helvetet"
                    VerticalOptions="Center"
                    HorizontalOptions="Start"/>
                <ContentPresenter Grid.Row="1" VerticalOptions="Center"/>
            </Grid>
        </ControlTemplate>
    </ResourceDictionary>
 

Какие изменения следует внести, чтобы заголовок оставался вверху, несмотря на то, что страницы перемещаются влево / вправо?

Вот пример того, как это выглядит в настоящее время

Вы можете установить главную страницу как страницу навигации, а затем установить ее RootPage как страницу с вкладками. Тогда вы получите статический заголовок, даже переключив элемент вкладки.

Например, App.Xaml.cs является:

 public App()
{
    InitializeComponent();
   
    MainPage = new NavigationPage(new CustomTabbedPage());
}
 

И Xaml из CustomTabbedPage:

 <?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:AppForms19"
             xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
             android:TabbedPage.ToolbarPlacement="Bottom"
             Title="Main Title"
             x:Class="AppForms19.Views.CustomTabbedPage">
    <local:MainPage Title="One" IconImageSource="icon.png"/>
    <local:SecondPage Title="Two" IconImageSource="icon.png" />
</TabbedPage>
 

Эффект: