Details
-
Bug
-
Resolution: Unresolved
-
P3: Somewhat important
-
None
-
5.9.0
-
None
-
Os: Windows 7.
Kit: Desktop Qt 5.9.0 MSVC 2015 32bit2
Description
Rectangles with the same columnspan have different widths. It seems that when the children column spans overflow, they do it incorrectly. Adding at least one item of 1 column span to each column in the parent fixes the issue. Please review the attached images.
Here is a simplified version of the code, standalone file, that reproduces the problem:
import QtQuick 2.8 import QtQuick.Window 2.2 import QtQuick.Controls 2.1 as Controls import QtQuick.Layouts 1.3 Window { id: rootWindow visible: true width: 280 height: 360 title: qsTr("Hello World") Rectangle { anchors.fill: parent; color: "pink" opacity: 0.4; } Flickable { anchors.fill: parent; anchors.leftMargin: 8; anchors.rightMargin: 8; contentHeight: griddy.height; GridLayout { id: griddy width: parent.width; columns: 4; columnSpacing: 16; Rectangle { Layout.column: 0; Layout.row: 0 Layout.columnSpan: 4 Layout.fillWidth: true; Layout.fillHeight: true; Layout.minimumHeight: 64; Layout.maximumHeight: 64; Layout.margins: 0; color: "red" Controls.Label { anchors.centerIn: parent; font.pixelSize: parent.height - 10; text: parent.Layout.columnSpan; } } Rectangle { Layout.fillWidth: true; Layout.fillHeight: true; Layout.preferredWidth: 20 Layout.margins: 0; Layout.columnSpan: 2 Layout.minimumHeight: 84; Layout.maximumHeight: 84; color: switch(Layout.columnSpan) { case 1: return "blue" break; case 2: return "green"; break; case 3: return "orange" break; case 4: return "purple" break; } Controls.Label { anchors.centerIn: parent; font.pixelSize: parent.height - 10; text: parent.Layout.columnSpan; } } Rectangle { Layout.fillWidth: true; Layout.fillHeight: true; Layout.preferredWidth: 20 Layout.margins: 0; Layout.columnSpan: 2 Layout.minimumHeight: 84; Layout.maximumHeight: 84; color: switch(Layout.columnSpan) { case 1: return "blue" break; case 2: return "green"; break; case 3: return "orange" break; case 4: return "purple" break; } Controls.Label { anchors.centerIn: parent; font.pixelSize: parent.height - 10; text: parent.Layout.columnSpan; } } Rectangle { Layout.fillWidth: true; Layout.fillHeight: true; Layout.preferredWidth: 20 Layout.margins: 0; Layout.columnSpan: 3 Layout.minimumHeight: 84; Layout.maximumHeight: 84; color: switch(Layout.columnSpan) { case 1: return "blue" break; case 2: return "green"; break; case 3: return "orange" break; case 4: return "purple" break; } Controls.Label { anchors.centerIn: parent; font.pixelSize: parent.height - 10; text: parent.Layout.columnSpan; } } Rectangle { Layout.fillWidth: true; Layout.fillHeight: true; Layout.preferredWidth: 20 Layout.margins: 0; Layout.columnSpan: 1 Layout.minimumHeight: 84; Layout.maximumHeight: 84; color: switch(Layout.columnSpan) { case 1: return "blue" break; case 2: return "green"; break; case 3: return "orange" break; case 4: return "purple" break; } Controls.Label { anchors.centerIn: parent; font.pixelSize: parent.height - 10; text: parent.Layout.columnSpan; } } } } }
