In MAUI TabbedPage tabmode:Scrollbar is not working, all tabs are coming in fixed mode. How to solve this issue?

Question

In MAUI TabbedPage tabmode:Scrollbar is not working, all tabs are coming in fixed mode. How to solve this issue?

Sadh, Siddhi 0

Added Tabbar.xml file in Platform/Resources/Android/Layout/Tabbar.xml. Added below code in project file also,

<ItemGroup> <AndroidResource Include="Platforms\Android\Resources\layout\Tabbar.axml" /> </ItemGroup>

Tabbar.axml code is below,

<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.TabLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/sliding_tabs" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#000000" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:tabIndicatorColor="@android:color/white" app:tabTextColor="@android:color/white" app:tabGravity="fill" app:tabTextAppearance="@style/TabTextAppearance" app:tabMode="scrollable" />

Yonglun Liu (Shanghai Wicresoft Co,.Ltd.) 50,126 Reputation points Microsoft External Staff

2023-07-20T07:48:22.2+00:00
For further investigation, could you please provide the following information?

Could you please clarify what exactly is meant by not working?

What is your expected behavior? What is the actual behavior of the program at the moment? What are the differences between them?

What is the target API level that your application is running?

Your prompt reply will be highly appreciated.

Sadh, Siddhi 0

Hi, we are migrating from xamarin to maui, so we want to implement this with minimal changes otherwise it will be a big change and we don't want to use ShellTabs.

-Minimum target API is 27

-Expected behavior is tabs should scroll Below is TabbedPage code

<?xml version="1.0" encoding="utf-8" ?>

<TabbedPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://schemas.microsoft.com/dotnet/2021/maui/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d" 
             xmlns:views="clr-namespace:FMSMobile.Core.Views"
            x:Class="FMSMobile.TicketHistoryTabs" Style="{StaticResource tabs}">
    <NavigationPage.TitleView>
        <StackLayout Orientation="Horizontal">
          
            <Label x:Name="lblTitle" Text="{Binding MTicket.Identifier, StringFormat='Ticket-{0}'}" Style="{StaticResource pageTitleWithIcons}"></Label>
           
        </StackLayout>
    </NavigationPage.TitleView>
    <TabbedPage.Children>
        <NavigationPage Title="Resources" IconImageSource="Resources.png">
            <x:Arguments>
                <views:TicketHistoryResourcesView />
            </x:Arguments>
        </NavigationPage>
        <NavigationPage Title="Parts Replaced" IconImageSource="ServiceEquipment.png">
            <x:Arguments>
                <views:TicketHistoryPartsView />
            </x:Arguments>
        </NavigationPage>
    </TabbedPage.Children>

</TabbedPage>

-Expected behavior is tabs should scroll Tabs

1 answer

Your answer

Yonglun Liu (Shanghai Wicresoft Co,.Ltd.) 50,126 Reputation points Microsoft External Staff

2023-07-20T07:48:22.2+00:00

For further investigation, could you please provide the following information?

Could you please clarify what exactly is meant by not working?

What is your expected behavior? What is the actual behavior of the program at the moment? What are the differences between them?

What is the target API level that your application is running?

Your prompt reply will be highly appreciated.
Sadh, Siddhi 0 Reputation points

2023-07-20T13:16:32.4066667+00:00

Hi, we are migrating from xamarin to maui, so we want to implement this with minimal changes otherwise it will be a big change and we don't want to use ShellTabs.

-Minimum target API is 27

-Expected behavior is tabs should scroll Below is TabbedPage code

<?xml version="1.0" encoding="utf-8" ?> <TabbedPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:d="http://schemas.microsoft.com/dotnet/2021/maui/design" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" xmlns:views="clr-namespace:FMSMobile.Core.Views" x:Class="FMSMobile.TicketHistoryTabs" Style="{StaticResource tabs}"> <NavigationPage.TitleView> <StackLayout Orientation="Horizontal"> <Label x:Name="lblTitle" Text="{Binding MTicket.Identifier, StringFormat='Ticket-{0}'}" Style="{StaticResource pageTitleWithIcons}"></Label> </StackLayout> </NavigationPage.TitleView> <TabbedPage.Children> <NavigationPage Title="Resources" IconImageSource="Resources.png"> <x:Arguments> <views:TicketHistoryResourcesView /> </x:Arguments> </NavigationPage> <NavigationPage Title="Parts Replaced" IconImageSource="ServiceEquipment.png"> <x:Arguments> <views:TicketHistoryPartsView /> </x:Arguments> </NavigationPage> </TabbedPage.Children> </TabbedPage>

-Expected behavior is tabs should scroll

Answer 1

Yonglun Liu (Shanghai Wicresoft Co,.Ltd.) 50,126 Microsoft External Staff

Hello,

Thank you for your feedback.

I used your code to successfully reproduce your illustration in MAUI and Xamarin.

After testing, it is not work after setting the app:tabMode property on TabbedPage in the current MAUI.

For issues that arise after this migration, it is recommended that you publish it to the Github repository to make our product group aware of it.

Best Regards,

Alec Liu.

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Sadh, Siddhi 0 Reputation points

2023-08-02T04:40:36.99+00:00

Hello,

Thank you for your feedback.

I have publish it to GitHub repository, link is below

https://github.com/dotnet/maui/issues/16470
Yonglun Liu (Shanghai Wicresoft Co,.Ltd.) 50,126 Reputation points Microsoft External Staff

2023-08-02T09:21:32.1133333+00:00

Thanks for your feedback.

Share via

In MAUI TabbedPage tabmode:Scrollbar is not working, all tabs are coming in fixed mode. How to solve this issue?

1 answer

Your answer