Search⌘ K

Solution: Converting Shell Application

Explore how to convert a .NET MAUI Shell application by removing the flyout menu and implementing a tab-based navigation with TabBar tags. Learn to add a RefreshView wrapping the ScrollView in the XAML layout and connect it to a refresh command in the code-behind, enabling page refresh functionality within the app.

The completed solution is presented in the code playground below:

<?xml version = "1.0" encoding = "UTF-8" ?>
<Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:ShellAppExample"
             x:Class="ShellAppExample.App">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Resources/Styles/Colors.xaml" />
                <ResourceDictionary Source="Resources/Styles/Styles.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>
Tabbed MAUI Shell Application project

Solving the challenge

These are the steps we followed to solve each of the tasks.

Changing the format of the Shell app

...