Customizable Tabview Button Size

Right now I have two tabs in a tabview that I want to be as wide/high as the text it contains (plus reasonable padding). However, as near as I can tell after reading through the tab and button matrix docs, this cannot be done.

The closest I’ve come is adding blank tabs (e.g., " "), but the user would still be able to select the tabs (animation and all), and there does not seem to be a reasonable method of disabling pressing on tabs.

It would be nice as a designer to be able to have full control over a tab’s sizing (see screenshot). At the very least, it would be reasonable to be able to disable tab buttons so that blanks could be added to “adjust” the size.

Thank you. :slight_smile:

PS. It would also be nice to update the docs to point out how to adjust the width using padding when tabs are left/right-positioned.


I second this!

Having spent around half a day messing with the styling of the tabview, it became clear that there are some fundamental holes in the design of this widget. Not being able to size or style the tab buttons is a basic feature in both horizontal and vertical orientations.

The main issue here is that the tabs are based on a button matrix which has very limited styling capability. Rather than focus on animations/transitions I think the tabview needs redesign to accommodate the more commonly used, essential functions.

Here’s is a simple example of what you cannot currently do with the tabview widget



I agree that the tab view can be done better. In v8 (the next version) it will be redesigned to make it more simple and intuitive.

It’s still heavily under development but will be something like this: