Xamarin Forms - NavigationPage.TitleView doesn't work on iOS

Viewed 1088

I have a simple (File->New Project) XF app that won't show the NavigationPage.TitleView content for iOS. Android works fine. What am I doing wrong?

Source code can be found here.

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="SampleApp.MainPage">

    <NavigationPage.TitleView>
        <Grid BackgroundColor="Blue">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Label Grid.Row="0" Grid.Column="0"
                   TextColor="Black"
                   Text="Page Title" />
        </Grid>
    </NavigationPage.TitleView>

    <StackLayout>
        <!-- Place new controls here -->
        <Label Text="Welcome to Xamarin.Forms!" 
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />
    </StackLayout>

</ContentPage>

Here is the output...

enter image description here

I also tried a StackLayout, same results...

<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="SampleApp.MainPage">

    <NavigationPage.TitleView>
        <StackLayout BackgroundColor="Blue" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <Label Grid.Row="0" Grid.Column="0"
                   TextColor="Black"
                   Text="Page Title" />
        </StackLayout>
    </NavigationPage.TitleView>

    <StackLayout>
        <!-- Place new controls here -->
        <Label Text="Welcome to Xamarin.Forms!" 
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />
    </StackLayout>

</ContentPage>
1 Answers

As Jason mentioned in the comment, NavigationPage.TitleView is a part of Navigation Bar in NavigationPage. To customize the TitleView, you should first create a NavigationPage :

public App ()
{
  MainPage = new NavigationPage (new Page1());
}

Then set the TitleView in the ContentPage:

<NavigationPage.TitleView>
    <Label Text="Page Title" />
</NavigationPage.TitleView>

Refer : Hierarchical Navigation

Related