TabViewStyle: make tabs take all horizontal space
-
Hi
I'm trying to understand how to make tabs in a TabView take all the available horizontal space. Setting their width is easy:
@
style: TabViewStyle {
id: tabStyleframeOverlap: 1
tab: Rectangle {
color: styleData.selected ? "steelblue" :"lightsteelblue"
border.color: "steelblue"
implicitWidth: Math.max(text.width + 4, 80)
implicitHeight: 60
width: tabStyle.control.width / tabStyle.control.countradius: 2 Text { id: text anchors.centerIn: parent text: tabStyle.control.width color: styleData.selected ? "white" : "black" }
}
frame: Rectangle { color: "red" }
leftCorner: Rectangle { color: "cyan" }
}
@
but I don't know how to change their position. tabsAlignment: Qt.AlignHCenter moves the tabs so that their left margin is in the middle of the tabBar... but they're stacked on each other, with the first one hiding the others...
And I don't see which properties can be used to remedy. -
Anyone?? This forum isn't very popular it seems... the majority of the threads has 0 replies.
-
I think it simply gets confused by you both setting implicitWidth and width. If you only set implicitWidth to tabStyle.control.width / tabStyle.control.count it works. The implicit width you have set is anyway not used since the tabs always fill the full width.
-
[quote author="Jens" date="1403083037"]I think it simply gets confused by you both setting implicitWidth and width. If you only set implicitWidth to tabStyle.control.width / tabStyle.control.count it works. The implicit width you have set is anyway not used since the tabs always fill the full width.[/quote]
Wow, a reply from one of the writers of QtQuick Controls, what a honor!
Thanks for the reply Jens, but doing as u say doesn't work.
https://github.com/Etchelon/VariousQmlTests
I've uploaded the project (a Qt Quick Project, just 1 file + the .pro file) and pasted the code above, with your modification, and it doesn't work. Can you please look into it? -
The issue seems to be an indirect division by 0 and causes further updates to be ignored in this expression:
@
implicitWidth: control.width / control.count
@The problem happens during initialization of the view, the count is initially 0. While the code as it stands should not really break, adding a safeguard will make the code evaluate correctly:
@
implicitWidth: control.width / Math.max(1, control.count)
@ -
That's it! Many thanks :)