QML Prebuilt Items and Placement of new Items
Solved
QML and Qt Quick
-
Lets say I have a prebuilt Item like this:
import QtQuick 2.12 import QtQuick.Controls 2.12 Item { Button { id: button1 width: 100 text: "button1" anchors.left: parent.left } }
I then include it like this and add another sub Item to that item:
import QtQuick 2.12 import QtQuick.Controls 2.12 import QtQuick.Window 2.12 Window { visible: true width: 640 height: 480 title: qsTr("Item World") PrebuiltItem { Button { id: button2 width: 100 text: "button2" // What can I use to position relative to what is in PrebuiltItem anchors.left: parent.left } } }
Is there a way to place the new item (in this case a Button) next to what is already in the item?
It won't see ids for the items that are already in the item.
Hmmm, maybe this might work:
property var lastItem: idOfLastItem ... Item{ Button{ anchors.left: lastItem.left } }
-
I think this might be what I am looking for:
https://together.jolla.com/question/4717/how-to-position-nested-items-in-a-qml-component/ -
Now I get it:
PrebuiltItem.qmlimport QtQuick 2.12 import QtQuick.Controls 2.12 Item { // places items by default in content object default property alias _contentChildren: row0.data Row { id: row0 } // places items when using this syntax /* row1: Item{} // as item row2: [Item{}, Item{}] // as list */ property alias row1: row1.children property alias row2: row2.children property alias row3: row3.children Row { id: row1 anchors.left: row0.right } Row { id: row2 anchors.left: row1.right } Row { id: row3 anchors.left: row2.right } }
main.qml
import QtQuick 2.12 import QtQuick.Controls 2.12 import QtQuick.Window 2.12 Window { visible: true width: 640 height: 480 title: qsTr("Item World") PrebuiltItem { Text { text: "one" } row1: Text { text: "two" } row2: [ Text { text: "three" }, Text { text: "three" }] row3: Text { text: "four" } } }
-
@fcarney you can have RowLayout or Row as root item in the PrebuiltItem
//PrebuiltItem.qml
RowLayout{
Button{}
}//main.qml
PrebuiltItem{Button{}}