Forum Xamarin.Forms

Announcement:

The Xamarin Forums have officially moved to the new Microsoft Q&A experience. Microsoft Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

To create new threads and ask questions head over to Microsoft Q&A for .NET and get involved today.

FlyoutHeader not showing in iOS after initialising a new instance of a shell

In our Xamarin Shell app, we have too shells. One is shown on load with a pre-login menu and a simple FlyoutHeader, then following a login process an instance of a new 'logged in' Shell with a different menu and FlyoutHeader are created and the user moved to that. (This shell is removed on logout and the user is returned to the first one).

The code for initialising the 'logged in' Shell is simply,

Shell s = new AppShellLoggedIn();
Application.Current.MainPage = s;

In both of the shell XAML files, the FlyoutHeader is included in the same way,

    <Shell.FlyoutHeader>
        <controls:FlyoutHeader />
    </Shell.FlyoutHeader>
    <Shell.FlyoutHeader>
        <controls:FlyoutHeaderLoggedIn />
    </Shell.FlyoutHeader>

This all works absolutely perfectly on android as you can see in the picture, and it works on iOS on the initial shell, but not the one that's created afterwards, the space where the header should be is simply empty. Duplicating the pre-login Header onto the logged in shell also leaves an empty space with no content.

(The text on the logged in header is dynamic and bound to the VM)

The FlyoutHeader controls are nothing particularly exciting, the pre-login one (that doesn't work if duplicated onto the logged-in one) is as below,

<?xml version="1.0" encoding="UTF-8"?>
<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" 
             xmlns:images="clr-namespace:Plugin.CrossPlatformTintedImage.Abstractions;assembly=Plugin.CrossPlatformTintedImage.Abstractions"
             x:Class="---" 
             x:Name="contentView" 
             HeightRequest="80">

    <StackLayout BackgroundColor="{DynamicResource FlyoutHeaderBackgroundColor}">

        <StackLayout x:Name="slNotLoggedIn">
            <Grid RowSpacing="0" ColumnSpacing="0" 
                  RowDefinitions="Auto, Auto, 2"
                  ColumnDefinitions="*, *">

                <images:TintedImage Source="logo"
                       HorizontalOptions="End"
                       VerticalOptions="Start"
                       WidthRequest="100"
                       Margin="25,30,30,10" Grid.Row="0" Grid.Column="1"
                       TintColor="{DynamicResource FlyoutLogoTint}"/>
            </Grid>

        </StackLayout>
    </StackLayout>
</ContentView>

Has anyone any suggestions as to what may be going wrong here?

Thanks

Sign In or Register to comment.