Alignment in nested layouts

[mentalmushroom]

When a RowLayout is nested inside a ColumnLayout, alignment for items in the RowLayout doesn't work:

Знімок екрана 2017-03-02 17.08.57.jpg

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 } }
}

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 } }
}

To copy to clipboard, switch view to plain text mode 

Is there any way to make it work?

[anda_skoa]

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,
_