How to style with corners rounded on shell topBar to all pages including using Routing registration

Armando Araujo Junior 0 Reputation points
2024-10-11T12:20:22.75+00:00

Hi I`m trying to customize the default shell topbar in Android and iOS

I would do like to set some rounded corners on it

i`m trying to follow this https://vladislavantonyuk.github.io/articles/Customizing-.NET-MAUI-Shell/

I almost get done, but when a navigate to next page the things does not going right. see images

First PAge is it OK:

Screenshot 2024-10-10 at 11.18.24

next Page is not (like a styled topbar is over the default one) :

Screenshot 2024-10-10 at 11.24.39

I saw that the first page is set in AppShell.xaml

<ShellContent Title="" ContentTemplate="{DataTemplate local:SettingsPage}" Route="SettingsPage" />

and the next page is set in AppShell.xaml.cs

Routing.RegisterRoute(nameof(LoginPage), typeof(LoginPage)); using Routing because of the navigate stack handler, like to set the Backbutton.

When a put the LoginPage at the <ShellContent... too it works as expected

But the Backbutton disappear

  • I would like that the Login page looks like the Settings Page, without the Blanks I background behind the NavBar.I would like that the Login page looks like the Settings Page, without the Blanks background behind the NavBar. Here a little project to reproduce https://github.com/elfiservice/maui-customizing-shell-test

I already created a Bug in the MAUI repository https://github.com/dotnet/maui/issues/25202

.NET MAUI
.NET MAUI
A Microsoft open-source framework for building native device applications spanning mobile, tablet, and desktop.
3,613 questions
{count} votes

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.