Back Button Not Center

[raselldev]

I have implementation back button, and i have wrong button position.

<simpleShell:SimpleShell.RootPageContainer>
    <Grid
        RowDefinitions="*, 50"
        x:Name="rootContainer">
        <simpleShell:SimpleNavigationHost x:Name="pageContainer"/>
        <controls:TabBarView
            Grid.Row="1"
            ShellItems="{Binding Path=ShellContents, Source={x:Reference thisShell}}"
            VerticalOptions="End" HorizontalOptions="Fill"
            CurrentPageSelectionChanged="TabBarViewCurrentPageChanged"/>
    </Grid>
</simpleShell:SimpleShell.RootPageContainer>

<simpleShell:SimpleShell.Content>
    <Grid
        RowDefinitions="50, *"
        ColumnDefinitions="Auto,*">
        <Button
            x:Name="backButton"
            Text="Back"
            Margin="20,5"
            HorizontalOptions="Start"
            VerticalOptions="Center"
            Background="Black"
            Grid.Column="0"/>
        <Label
            HorizontalOptions="Center"
            VerticalOptions="Center"
            Text="{Binding CurrentShellContent.Title, Source={x:Reference thisShell}}"
            FontAttributes="Bold"
            FontSize="18"
            Grid.Column="1"/>
        <simpleShell:SimpleNavigationHost Grid.Row="1" Grid.ColumnSpan="2"/>
    </Grid>
</simpleShell:SimpleShell.Content>

Whats wrong with my xaml code?

[raselldev]

Updated Code

<simpleShell:SimpleShell.RootPageContainer>
        <Grid
            RowDefinitions="*, Auto"
            x:Name="rootContainer">
            <controls:TopBarScaffold
                IsBackButtonVisible="False"
                Title="{Binding CurrentShellContent.Title, Source={x:Reference thisShell}}">
                <simpleShell:SimpleNavigationHost x:Name="pageContainer"/>
            </controls:TopBarScaffold>

            <controls:TabBarView
                Grid.Row="1"
                ShellItems="{Binding Path=ShellContents, Source={x:Reference thisShell}}"
                VerticalOptions="End" HorizontalOptions="Fill"
                CurrentPageSelectionChanged="TabBarViewCurrentPageChanged"/>
        </Grid>
    </simpleShell:SimpleShell.RootPageContainer>

TopBarScafold.xaml

   ```

```

[RadekVyM]

Hi @raselldev,

what is the expected position of the button?

[raselldev]

Hi @RadekVyM thank you for your reply,

expected like this video in simpleshell:

ios: https://github.com/RadekVyM/SimpleToolkit/assets/65116078/84cf922e-f698-4f96-b06c-561df5c61e1c

android: https://github.com/RadekVyM/SimpleToolkit/assets/65116078/b37e1561-be40-4aef-a255-060cfbfc9572

i just updated with your code in https://github.com/RadekVyM/SimpleToolkit/blob/main/docs/SimpleToolkit.SimpleShell/README.md but not working

delete bin & obj still not working.

[raselldev]

AppShell.xaml

```

``` AppShell.cs ``` public partial class AppShell : SimpleShell { public AppShell() { InitializeComponent(); Loaded += AppShellLoaded; Routing.RegisterRoute(nameof(DetailInboxPage), typeof(DetailInboxPage)); } private static void AppShellLoaded(object sender, EventArgs e) { var shell = sender as AppShell; shell.Window.SubscribeToSafeAreaChanges(safeArea => { shell.rootContainer.Margin = new Thickness(safeArea.Left, safeArea.Top / 1.2, safeArea.Right, safeArea.Bottom); shell.rootContainer.Padding = new Thickness(safeArea.Left, safeArea.Top / 1.2, safeArea.Right, safeArea.Bottom); }); } private void TabBarViewCurrentPageChanged(object sender, TabBarEventArgs e) { Shell.Current.GoToAsync("///" + e.CurrentPage.ToString()); } } ``` TopBarScafold.xaml ``` ``` TopBarScafold.cs ``` [ContentProperty("PageContent")] public partial class TopBarScaffold : ContentView { public static readonly BindableProperty PageContentProperty = BindableProperty.Create(nameof(PageContent), typeof(View), typeof(TopBarScaffold), defaultBindingMode: BindingMode.OneWay); public static readonly BindableProperty IsBackButtonVisibleProperty = BindableProperty.Create(nameof(IsBackButtonVisible), typeof(bool), typeof(TopBarScaffold), defaultValue: true, defaultBindingMode: BindingMode.OneWay); public static readonly BindableProperty TitleViewProperty = BindableProperty.Create(nameof(TitleView), typeof(View), typeof(TopBarScaffold), defaultBindingMode: BindingMode.OneWay, propertyChanged: OnTitleViewChanged); public static readonly BindableProperty TitleProperty = BindableProperty.Create(nameof(Title), typeof(string), typeof(TopBarScaffold), defaultBindingMode: BindingMode.OneWay, propertyChanged: OnTitleChanged); public View PageContent { get => (View)GetValue(PageContentProperty); set => SetValue(PageContentProperty, value); } public bool IsBackButtonVisible { get => (bool)GetValue(IsBackButtonVisibleProperty); set => SetValue(IsBackButtonVisibleProperty, value); } public View? TitleView { get => (View?)GetValue(TitleViewProperty); set => SetValue(TitleViewProperty, value); } public string? Title { get => (string?)GetValue(TitleProperty); set => SetValue(TitleProperty, value); } public TopBarScaffold() { InitializeComponent(); } private static void OnTitleViewChanged(BindableObject bindable, object oldValue, object newValue) { if (bindable is not TopBarScaffold scaffold || newValue is not View newTitleView) return; scaffold.titleContent.Content = newTitleView; } private static void OnTitleChanged(BindableObject bindable, object oldValue, object newValue) { if (bindable is not TopBarScaffold scaffold) return; if (scaffold.TitleView is not null) return; scaffold.titleContent.Content = new Label { HorizontalTextAlignment = TextAlignment.Center, VerticalTextAlignment = TextAlignment.Center, FontSize = 24, FontAttributes = FontAttributes.Bold, Text = newValue.ToString(), TextColor = Colors.Black }; } private async void BackButtonClicked(object sender, EventArgs e) { await Shell.Current.GoToAsync(".."); } ```

[RadekVyM]

Hi,

these code snippets do not help me to understand where the problem is. If the information bellow does not help, could you please create a GitHub repository with a reproduction sample and share it?

The sample used in the SimpleShell documentation does not use the DisplayContentBehindBars() method that extends app's content outside the safe areas (behind status and navigation bars). If you do not need this feature, do not call that method in CreateMauiApp().

If I am not mistaken, basically all samples listed in the Samples section of this repository use safe area helpers.

[raselldev]

@RadekVyM

It's work with remove DisplayContentBehindBars()

Thank you for your support!!