Matiai
Matiai

Reputation: 1

.net maui TabBar missing

My first time asking a question as I feel complete loss. I am trying to learn .net maui using visual studio. No matter what I do, I can't seem to get the tabbar to show in my app. The mistake may be small or huge but despite my best efforst of trying to find the solution, I have had no progress. Any tips are welcome! I have made new xaml pages Tab1.xaml and Tab2.xaml and Im trying to get the tabs to appear just under the menu but tabs are not there. This is my AppShell.xaml currently.

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="t07.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:t07"
    Shell.FlyoutBehavior="Disabled">

    <ContentPage>
        <ContentPage.MenuBarItems>
            <MenuBarItem Text="File"></MenuBarItem>
            <MenuBarItem Text="Tools"></MenuBarItem>
            <MenuBarItem Text="Help"></MenuBarItem>
        </ContentPage.MenuBarItems>
    </ContentPage>

    <TabBar Shell.TabBarUnselectedColor="Blue">
        <Tab Title="Task">
            <ShellContent ContentTemplate="{DataTemplate local:Tab1}"/>
        </Tab>

        <Tab Title="Notes">
            <ShellContent ContentTemplate="{DataTemplate local:Tab2}"/>
        </Tab>
    </TabBar>

</Shell>

Tried to add styles if the tabs would have been invisible for some reason. Also tried to make then visible/not visible but no changes. Added scrollview to mainpage if the tabs would appear on the end of page. The shell.TabBarUnselectedColor is test, it did not change anything. The tabs are not supposed to be flyouts either and should be visible at all times (this is just practice assignment).

Upvotes: 0

Views: 1248

Answers (1)

Peter Wessberg
Peter Wessberg

Reputation: 1921

You cannot have a ContentPage in a Shell page. Your Shell xaml should look like this:

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="t07.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:t07"
    Shell.FlyoutBehavior="Disabled"
    Shell.TabBarUnselectedColor="Blue">

    <TabBar >
        <Tab Title="Task">
            <ShellContent ContentTemplate="{DataTemplate local:Tab1}"/>
        </Tab>

        <Tab Title="Notes">
            <ShellContent ContentTemplate="{DataTemplate local:Tab2}"/>
        </Tab>
    </TabBar>
</Shell>  

If you are looking for a way to have a top and bottom menu, it is shown in this link Bottom and top tabs

Upvotes: 1

Related Questions