Automatisches Zeilenumbruch auf Elementen im QML-Layout

Question

Gibt es ein QML-Layout oder eine Konfiguration, die QML-Elemente automatisch in die nächste Zeile einfügt, wenn die Breite des nächsten Elements die Breite des angegebenen Layouts überschreitet?

Wenn ich einen QML GridLayout verwenden, nur die Elemente den Rand des Fensters gehen und werden abgeschnitten:

GridLayout { 
    id: header_focused_container; 
    width: parent.width; 
    anchors.margins: 20; 
    Text { 
     text: "header_focused_container.width=" + 
      header_focused_container.width + 
      " and my width is =" + width 
    } 
    Rectangle { height:20; width:250; color: "red" } 
    Rectangle { height:20; width:250; color: "blue" } 
    Rectangle { height:20; width:250; color: "green" } 
} 

Wenn ich Qt-Dokumentation Seite aussehen markiert "Scalability" ich sehr manuelle Skalierung sehen geht weiter. Im Grunde schlagen sie vor, dass ich die benötigten Spalten berechnen muss.

Gibt es eine Art von Layout-Typ oder Konfiguration, die das automatische Wrapping der Elemente durchführt?

Answer 1

können Sie Flow verwenden:

import QtQuick 2.5 
import QtQuick.Window 2.0 

Window { 
    visible: true 
    width: 400 
    height: 200 

    Flow { 
     id: header_focused_container 
     anchors.fill: parent 

     Text { 
      text: "blah" 
     } 
     Rectangle { height:20; width:250; color: "red" } 
     Rectangle { height:20; width:250; color: "blue" } 
     Rectangle { height:20; width:250; color: "green" } 
    } 
}