PDA

View Full Version : Alignment in nested layouts



mentalmushroom
2nd March 2017, 15:11
When a RowLayout is nested inside a ColumnLayout, alignment for items in the RowLayout doesn't work:

12374


import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")

ColumnLayout
{
anchors.fill: parent
anchors.margins: 20

Label { text: qsTr("Alignment works properly"); color: "green"; Layout.alignment: Qt.AlignRight }

RowLayout
{
//Layout.alignment: Qt.AlignJustify
//Layout.fillWidth: true
Label { text: "Left"; color: "blue"; Layout.alignment: Qt.AlignLeft }
Label { text: "Right (doesn't work)"; color: "red"; Layout.alignment: Qt.AlignRight }
//Rectangle { color: "red"; height: 50; Layout.fillWidth: true }
//Rectangle { color: "red"; height: 50; width: 50; Layout.alignment: Qt.AlignRight }
} // RowLayout
} // ColumnLayout

footer: RowLayout { Label { text: "Here it works too"; Layout.alignment: Qt.AlignRight } }
}



Is there any way to make it work?

anda_skoa
3rd March 2017, 12:50
You are trying to do horizontal alignment in a horizontal layout, i.e. in the direction that the layout controls.

You can either

* add a "spacer" item between the two labels that takes all the available space, pushing the two labels to the edges
* use an Item instead of the RowLayout and just anchor the two labels to each of its sides

Cheers,
_