Details
-
Bug
-
Resolution: Unresolved
-
P3: Somewhat important
-
None
-
5.9
-
None
Description
https://doc.qt.io/qt-5/qml-qtquick-layouts-stacklayout.html#details says:
In contrast to most other layouts, child Items' Layout.fillWidth and Layout.fillHeight properties default to true. As a consequence, child items are by default filled to match the size of the StackLayout as long as their Layout.maximumWidth or Layout.maximumHeight does not prevent it.
In addition to that, Layout types automatically set Layout.fillWidth/Height when used as children of other layouts:
If this property is true, the item will be as wide as possible while respecting the given constraints. If the property is false, the item will have a fixed width set to the preferred width. The default is false, except for layouts themselves, which default to true.
The ColumnLayout below should fill the StackLayout automatically. The text and rectangles should be positioned in the centre of the screen (according to the default alignment values):
import QtQuick 2.9 import QtQuick.Layouts 1.3 import QtQuick.Window 2.2 Window { id: window width: 800 height: 800 visible: true RowLayout { anchors.fill: parent anchors.margins: 8 spacing: 20 ColumnLayout { spacing: 10 StackLayout { id: stackLayout // Fills the StackLayout // Rectangle { // color: "transparent" // border.color: "darkorange" // } // Doesn't fill, but should ColumnLayout { id: buttonLayout Layout.alignment: Qt.AlignVCenter // For debug purposes Rectangle { anchors.fill: parent color: "transparent" border.color: "darkorange" z: 100 } ColumnLayout { Text { text: "Text" } Rectangle { implicitWidth: 100 implicitHeight: 40 color: "steelblue" } } ColumnLayout { Text { text: "Text" } Rectangle { implicitWidth: 100 implicitHeight: 40 color: "steelblue" } } } } } } }
Using e.g. a Rectangle as a child of StackLayout works as expected.