Text wrapping inside GridLayout



  • Hello,
    I have a trivial problem: I need to wrap a Text item (it's id: someText in the following code) inside a GridLayout. The code:

    import QtQuick 2.6
    import QtQuick.Window 2.2
    import QtQuick.Controls 2.1
    import QtQuick.Layouts 1.1
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Text wrapping")
    
        RowLayout
        {
            anchors.fill: parent
    
            Rectangle
            {
                id: leftPanel
                Layout.fillHeight: true
                Layout.fillWidth: true
                Layout.minimumWidth: 150
                Layout.maximumWidth: 400
                Layout.preferredWidth: 300
    
                ColumnLayout
                {
                    anchors.fill: parent
                    GridLayout
                    {
                        anchors.fill: parent
                        columns: 2
    
                        Text
                        {
                            id: label
                            text: "Label:"
                        }
                        Text
                        {
                            id: someText
                            text: "Some text ............................................"
                            wrapMode: Text.WrapAnywhere
                            //Without the following line the wrapping does not work at all
                            Layout.maximumWidth: 150
                        }
                    }
                }
            }
            Rectangle
            {
                id: rightPanel
                color: "red"
                Layout.fillWidth: true
                Layout.fillHeight: true
                Layout.minimumWidth: 300
            }
        }
    }
    

    What is my problem: If I resize the window then I expect the "someText" item be ALWAYS wrapped at the right side of the "leftPanel". But to make work the wrapping I have to define Layout.maximumWidth inside the Text{id: someText} item, otherwise the wrapping does not work at all. Unfortunatelly defining the Layout.maximumWidth causes the "someText" be always wrapped by width of 150 :-( regardless of the width of the "leftPanel". See the screenshots below.

    How to make the "someText" be wrapped correctly?

    Thank you.

    Wide window
    Narrow window



  • I'm sorry, I don't know how could I miss the Layout.fillWidth :)

    So I solved it by the following definition of my Text to be wrapped:

    Text
    {
      id: someText
     text: "Some text ............................................"
     wrapMode: Text.WrapAnywhere
    //this line made the "magic"
     Layout.fillWidth: true 
    }
    

Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.