QML - 为什么 TabBar 的隐式宽度依赖于将内部 TabButton 的宽度绑定到其隐式宽度？

Question

为什么在以下代码中，当我在TabButtons中注释掉width: implicitWidth时，TabBar的implicitWidth会发生变化？为什么我将组件的width设置为等于其implicitWidth会更改implicitWidth？此外，我认为width在默认情况下被设置为implicitWidth，而width没有明确设置。所以我不明白为什么做width: implicitWidth会有任何效果。这是代码：

Item {
id: root
height: 480
width: 640
RowLayout {
anchors.fill: parent
TabBar {
id: bar
Layout.fillHeight: true
implicitWidth: Math.max(homeTabButton.implicitWidth, discoverTabButton.implicitWidth, activityTabButton.implicitWidth)
background: Rectangle {
color: "yellow"
}
contentItem: ListView {
model: bar.contentModel
}

TabButton {
id: homeTabButton
width: implicitWidth // I cannot comment this out
text: qsTr("Home")
}
TabButton {
id: discoverTabButton
width: implicitWidth // I cannot comment this out
text: qsTr("Discover")
}
TabButton {
id: activityTabButton
width: implicitWidth // I cannot comment this out
text: qsTr("Activity")
}
}
StackLayout {
Layout.fillWidth: true
Layout.fillHeight: true
currentIndex: bar.currentIndex
Pane {
id: homeTab
background: Rectangle {
color: "blue"
}
}
Pane {
id: discoverTab
background: Rectangle {
color: "red"
}
}
Pane {
id: activityTab
background: Rectangle {
color: "green"
}
}
}
}
}

Answer 1

U在之前指定了一个隐式宽度

implicitWidth: Math.max(homeTabButton.implicitWidth, discoverTabButton.implicitWidth, activityTabButton.implicitWidth)

这就是为什么当你在tabButton中注释宽度时，宽度为0。

使用

width: Math.max(homeTabButton.implicitWidth, discoverTabButton.implicitWidth, activityTabButton.implicitWidth)

在您的代码和注释中，tabButton中的宽度可以看到。