Label names not displaying in nested Tabs

Question

Label names not displaying in nested Tabs

Thombre, Ashish 130

enter image description here

Label names not displaying in nested Tabs it should be like screen 2 - (refer screen 1) when clicked on Service History Tab - (Refer screen 2)
First 2 Tabs icon are in white color and 3rd in black color, all icons should be should be in white color

Currently, i am referring below code



public class ScrollableTabbedViewHandler : TabbedViewHandler

{

    [Obsolete]

    public override void UpdateValue(string property)

    {

        base.UpdateValue(property);

        var tabs = Platform.CurrentActivity?.FindViewById<FragmentContainerView>(Microsoft.Maui.Resource.Id

            .navigationlayout_toptabs);

        var tabLayout = tabs?.GetChildAt(0);

        if (tabLayout is TabLayout layout)

        {

            layout.TabMode = TabLayout.ModeScrollable;

            layout.SetSelectedTabIndicatorColor(Color.FromRgb(44,82,52).ToAndroid());

   //         layout.SetTabIconTintResource(Color.FromRgb(255, 255, 255).ToAndroid());

  //          layout.SetTabTextColors(Color.FromRgb(255, 255, 255).ToAndroid(), Color.FromRgb(255, 255, 255).ToAndroid());

            layout.SetSelectedTabIndicatorHeight(12);

            for (int i = 0; i < layout.TabCount; i++)

            {

                TabLayout.Tab? tab = layout.GetTabAt(i);

                TabLayout.TabView? view = tab?.View;

                for (int j = 0; j < (view?.ChildCount ?? 0); j++)

                {

                    var child = view?.GetChildAt(j);

                    if (child is TextView tv)

                    {

                        tv.SetAllCaps(false);

                    }

                }

            }

        }

    }

}

Anonymous

2023-11-23T06:50:50.1233333+00:00
How did you register the Tabbedpage handler?

If I do not register ScrollableTabbedViewHandler in the MauiProgram.cs, I get the same result like the screenshot 1

If I register it like the following code in the MauiProgram.cs. It works like the screenshot 2

builder .UseMauiApp<App>() .ConfigureMauiHandlers(handlers => { #if ANDROID handlers.AddHandler<TabbedPage, MauiApp9.Platforms.Android.ScrollableTabbedViewHandler>(); #endif })

Please share the Tabbedpage's layout code or could you minimize code to just what is needed to reproduce the problem?

Thombre, Ashish 130

 .ConfigureMauiHandlers((handlers) =>
  {
      handlers.AddHandler(typeof(TabbedPage), typeof(Platforms.Android.ScrollableTabbedViewHandler));
   }

I register the Tabbedpage handler like above code. It works fine like screenshot 2.

But getting issue, when i click on Service History (Tab 3) it redirects to next page and next page also having multiple tabs, it shows like screenshot 1, It should be be like screenshot 2

(i.e. Label names not displaying in nested Tabs)

Xaml 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.Views"
            x:Class="FMSMobile.TicketHistoryTabs" Style="{StaticResource tabs}">,
</TabbedPage>

Anonymous

2023-11-27T07:59:47.7366667+00:00

But getting issue, when i click on Service History (Tab 3) it redirects to next page and next page also having multiple tabs, it shows like screenshot 1, It should be be like screenshot 2

Is this next page Tabbedpage as well? You can make the Nextpage's tabbar to the bottom, is that working?
Thombre, Ashish 130 Reputation points

2023-11-27T14:05:10.51+00:00

Yes, next page is Tabbedpage. Nextpage's tabbar to the bottom is working for me.

But can we have same functionality on the top?
Anonymous

2023-11-29T09:40:22.7333333+00:00

Can you share a mini demo to reproduce this issue? I created a demo and click nested tabbedpage, other tabs will disappear.
Anonymous

2023-11-30T00:53:15.63+00:00

This is a public forum, I edited your screenshot and removed private information such as email address to protect your private information. Thanks for your understanding.

Your answer

Anonymous

2023-11-23T06:50:50.1233333+00:00

How did you register the Tabbedpage handler?

If I do not register ScrollableTabbedViewHandler in the MauiProgram.cs, I get the same result like the screenshot 1

If I register it like the following code in the MauiProgram.cs. It works like the screenshot 2

builder .UseMauiApp<App>() .ConfigureMauiHandlers(handlers => { #if ANDROID handlers.AddHandler<TabbedPage, MauiApp9.Platforms.Android.ScrollableTabbedViewHandler>(); #endif })

Please share the Tabbedpage's layout code or could you minimize code to just what is needed to reproduce the problem?
Thombre, Ashish 130 Reputation points

2023-11-23T11:58:55.9266667+00:00

.ConfigureMauiHandlers((handlers) => { handlers.AddHandler(typeof(TabbedPage), typeof(Platforms.Android.ScrollableTabbedViewHandler)); }

I register the Tabbedpage handler like above code. It works fine like screenshot 2.

But getting issue, when i click on Service History (Tab 3) it redirects to next page and next page also having multiple tabs, it shows like screenshot 1, It should be be like screenshot 2

(i.e. Label names not displaying in nested Tabs)

Xaml 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.Views" x:Class="FMSMobile.TicketHistoryTabs" Style="{StaticResource tabs}">, </TabbedPage>
Anonymous

2023-11-27T07:59:47.7366667+00:00

But getting issue, when i click on Service History (Tab 3) it redirects to next page and next page also having multiple tabs, it shows like screenshot 1, It should be be like screenshot 2

Is this next page Tabbedpage as well? You can make the Nextpage's tabbar to the bottom, is that working?
Thombre, Ashish 130 Reputation points

2023-11-27T14:05:10.51+00:00

Yes, next page is Tabbedpage. Nextpage's tabbar to the bottom is working for me.

But can we have same functionality on the top?
Anonymous

2023-11-29T09:40:22.7333333+00:00

Can you share a mini demo to reproduce this issue? I created a demo and click nested tabbedpage, other tabs will disappear.
Anonymous

2023-11-30T00:53:15.63+00:00

This is a public forum, I edited your screenshot and removed private information such as email address to protect your private information. Thanks for your understanding.

Share via

Label names not displaying in nested Tabs

Your answer