1. Home
  2. Forum
  3. .NET MAUI
  4. Tab item not left aligned

Tab item not left aligned

Hello, I'm having issues with my tab items not left aligned. They are only left aligned when I set the TabWidthMode="Default". Could you please help? Also do you know how to hide the tab item headers? It was possible in Xamarin by using DisplayMode="NoHeader". Thank you.


Below is the screenshot for your reference:

Image_9023_1706725102606


2 Replies
AJ AhamedAliNishad JahirHussain Syncfusion Team February 1, 2024 02:42 PM UTC

Hi Josh,


Query 1: Hello, I'm having issues with my tab items not left aligned. They are only left aligned when I set the TabWidthMode="Default". Could you please help?


We have reviewed your query, and we would like to inform you that we have implemented the design of the SfTabView when TabWidthMode is SizeToContent in .NET MAUI based on Material Design 2 (m2 design). For more details, please refer to the scrollable tabs in the link below.


Link:  https://m2.material.io/components/tabs#scrollable-tabs


Additionally, we are pleased to announce the introduction of a TabHeaderPadding property in SfTabView, scheduled for release in Volume 1, 2024. This release is tentatively scheduled for the end of March 2024. With the inclusion of this property, you will have the ability to customize the header padding specifically for left alignment when TabWidthMode is set to SizeToContent in SfTabView within .NET MAUI.



Query 2:Also do you know how to hide the tab item headers? It was possible in Xamarin by using DisplayMode="NoHeader".


We have reviewed your query and would like to recommend setting TabBarHeight to 0 in the .NET MAUI SfTabView to effectively hide the tab item headers, replicating the behavior observed in Xamarin. For comprehensive details and guidance, please refer to the following help documentation link:


Link : https://help.syncfusion.com/maui/tabview/tab-bar-customization#customize-the-tab-bar-height



Regards,

Ahamed Ali Nishad.


AJ AhamedAliNishad JahirHussain Syncfusion Team March 18, 2024 02:12 PM UTC

Hi Josh,

 

Query 1: Hello, I'm having issues with my tab items not left aligned. They are only left aligned when I set the TabWidthMode="Default". Could you please help?

 

We are glad to announce that our Essential Studio 2024 Volume 1 Main Release v25.1.35  is rolled out and is available for download under the following link.

 

Essential Studio 2024 Volume 1 Main Release v25.1.35 is available for download | Announcements Forums | Syncfusion

 

We have included support for customizing the TabHeader padding in SfTabView in .NET MAUI in our latest nuget v25.1.35 which is available for download (   https://www.nuget.org/ ). We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.

 

You can utilize the TabHeaderPadding property to customize the tab header padding in SfTabView in .NET MAUI. For further details, please refer to the following link for the help documentation of the TabHeaderPadding property in SfTabView in .NET MAUI.

 

Link: TabHeader padding support in SfTabView

 

 

Regards,

Ahamed Ali Nishad.


Loader.
Up arrow icon