Important: Please read the Qt Code of Conduct -

Add elements dynamically to SplitView

  • Hi, I want to add elements to SplitView dynamically eg. onMouseClick, but so far I didn't find the answer.

    What I've found out so far is that the SplitView has it's default property set to it's first child's data property. So I guess I should try and add new dynamically created components with the parent set to that child (splitView1.children[0]). Unfortunately that doesn't work either. What is more the number of children of that first child is zero after the component has finished loading (seems like the SplitLayout's Component.onCompleted event calls a function that moves those children somewhere else). Thus the added children do not render (and do not respond to any of the Layout attached properties).

    Please see the following code snippet:
    @import QtQuick 2.1
    import QtQuick.Controls 1.0
    import QtQuick.Layouts 1.0

    ApplicationWindow {
    width: 600
    height: 400

    SplitView {
        anchors.fill: parent
        Rectangle {
            id: column
            width: 200
            Layout.minimumWidth: 100
            Layout.maximumWidth: 300
            color: "lightsteelblue"
        SplitView {
            id: splitView1
            orientation: Qt.Vertical
            Layout.fillWidth: true
            Rectangle {
                id: row1
                height: 200
                color: "lightblue"
                Layout.minimumHeight: 1

    // Rectangle { //I want to add Rectangle to splitView1 like this one, but dynamicly eg.onMouseClick
    // color: "blue"
    // }

    MouseArea {
        id: clickArea
        anchors.fill: parent
        onClicked: {
            console.debug("len: " + splitView1.__contents.length); // __contents is the SplitView's default property - an alias to the first child's data property
            var newObject = Qt.createQmlObject('import QtQuick 2.1; Rectangle {color: "blue"}',
                splitView1, "dynamicSnippet1"); //no effect

    // var newObject = Qt.createQmlObject('import QtQuick 2.1; import QtQuick.Layouts 1.0; Rectangle {color: "blue"; width: 50; height: 50}',
    // splitView1, "dynamicSnippet1"); //rectangle visible, but not in layout(?) - not resizeable

    Is there any way I can make the dynamically created components render properly in the SplitView as the statically added ones?

Log in to reply