Qt Quick Controls 2 TabBar/TabButton autosize to button text width

[larry104]

Is there a way that the Qt Quick Controls 2 TabBar/TabButton can auto size to the button text - it seems the current implementation wastes a lot of space even if padding is set to 0.
Thanks.

[jpnurmi]

TabBar distributes the space equally by default, but respects the widths if TabButtons have it explicitly specified. To make buttons to retain their implicit width, you could do:

TabBar {
    TabButton {
        text: "Foo"
        width: implicitWidth // <==
    }
    ...
}

[larry104]

Setting a width works but then I need to manually calculate the width for every button in the TabBar - Is there a way to access the size of the text in the button?

[jpnurmi]

Is it not what you get with implicit width? The implicit width of the button equals to the implicit width of the content item + left padding + right padding. For the built-in styles, the content item is a Text element.

PS. If you still need to calculate the width of a specific text string, QML TextMetrics (http://doc.qt.io/qt-5/qml-qtquick-textmetrics.html) can do that.

[larry104]

if I set width: implicitWidth the text does not show - Looking at the source it should be as you pointed out:

implicitWidth: Math.max(background ? background.implicitWidth : 0, contentItem.contentWidth + leftPadding + rightPadding)

But it seems the value is 0

[jpnurmi]

I can't test right now, but I suspect it could be because it's using contentWidth instead of implicitWidth. Feel free to report a bug. This is something we should ensure that it works and even make it easily configurable.

Does it resize to contents if you do:

TabButton {
    width: contentItem.implicitWidth + leftPadding + rightPadding
}

?

[larry104]

Yes, that does the trick! Now it's sizing according to the text width.
Thanks a lot for your help - I will file a bug report
Thanks again!