Xamarin.Forms: is it possible to update Shell.TitleView in code-behind? - xaml

Question

I work on a Xamarin.Forms.Shell app containing 4 tabs.
On the main tab, I have:
a TitleView containing the logo of the company
s ScrollView containing an Image as Header
a ScrollView containing the main content, that can cover the Header to be fully visible
The XAML looks like this:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="AvilaShellAppSample.Views.HomePage"
Shell.NavBarHasShadow="False"
Shell.NavBarIsVisible="True"
x:Name="homePage">
<!-- TitleView -->
<Shell.TitleView >
<Grid>
<ffimageloadingsvg:SvgCachedImage Source="resource://ShellAppSample.Resources.blackLogoTitle.svg"
DownsampleHeight="6"
HeightRequest="45"/>
</Grid>
</Shell.TitleView>
<ContentPage.BindingContext>
<vm:HomeViewModel />
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid RowSpacing="0"
BackgroundColor="{StaticResource Gray-050}"
Margin="0,0,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid Grid.Row="1">
<!-- Header ScrollView : Image -->
<ScrollView>
<ContentView x:Name="headerView"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Header Image -->
<ffimageloading:CachedImage x:Name="headerImage"
Grid.Row="0"
Aspect="AspectFill"
BackgroundColor="{DynamicResource Gray-200}"
DownsampleToViewSize="true"
HeightRequest="280"
HorizontalOptions="FillAndExpand"
VerticalOptions="Start"
Source="resource://ShellAppSample.Resources.indoor.jpg">
</ffimageloading:CachedImage>
</Grid>
</ContentView>
</ScrollView>
<!-- Content ScrollView -->
<ScrollView>
<ctrl:ParallaxScrollView HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"
ParallaxHeaderView="{x:Reference headerView}"
LogoHeaderView="{x:Reference logoHeaderView}"
HiddenView="{x:Reference hiddenView}"
MainPage="{Binding homePage}">
<Grid ColumnSpacing="0"
RowSpacing="0"
VerticalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="220" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!-- Content -->
</Grid>
</ctrl:ParallaxScrollView>
</ScrollView>
</Grid>
</Grid>
</ContentPage.Content>
</ContentPage>
I would like to display the header Image over the NavigationBar/StatusBar by default: so the NavigationBar would be hidden, and the StatusBar background would be the Image header.
Then I would like to display the default NavigationBar/StatusBar only when the content cover the half of the Header: so the NavigationBar would be visible, and the StatusBar background would be the default background.
But I didn't found any way to access to the Shell.NavBarIsVisible property or to the Shell.TitleView in code-behind.
So I would like to know is this is possible?

Answer 1

You need to use the exposed methods in order to set the properties SetNavBarIsVisible() and SetTitleView()
Disabeling the navigation bar for a page in it code-behind:
Shell.SetNavBarIsVisible(this, false);
Setting a custom TitleView for a page in it code-behind:
Label r = new Label();
r.Text = "Hello World";
Shell.SetTitleView(this, (View)r);