QMLのSplitViewに動的に要素を追加

Question

私はQMLを使用しており、SplitViewに要素を動的に追加したいと考えています。 onMouseClick、しかしこれまで私は答えを見つけられませんでした。

私が今までに見つけたのは、SplitViewのデフォルトプロパティが、最初の子のdataプロパティに設定されていることです。だから私は、その子に設定された親を持つ新しい動的に作成されたコンポーネントを試して追加する必要があると思います（splitView1.children[0]）。残念ながらそれはどちらもうまくいかない。コンポーネントのロードが完了した後、その最初の子要素の子の数はゼロになります（SplitLayoutのComponent.onCompletedイベントがそれらの子を別の場所に移動させる関数を呼び出すようです）。したがって、追加された子はレンダリングされません（レイアウトに関連付けられたプロパティのいずれにも応答しません）。

次のコードスニペットをご覧ください。

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("clicked!") 
      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 
     } 
    } 
} 

は私が動的に作成されたコンポーネントは、静的に追加されたものをとSplitViewで正しく表示することができます方法はありますか？

Answer 1

APIは新しい要素の動的挿入をサポートしていないようです。あなたがそれを稼働させても、それはハックになり、将来のリリースで壊れる可能性があります。あなたはあなたが望む振る舞いを模倣するために自分のコントロールを動かす必要があるかもしれません。理想的には、それはある種のモデルによって支持されるべきです。

Answer 2

ロードダイナミックオブジェクトにローダーを使用する必要があります。私はSplitViewのソースコードを見て

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 
     } 
    Loader { 
     id:rect 
    } 


    } 
} 

MouseArea { 
    id: clickArea 
    anchors.fill: parent 
    onClicked: { 
     console.debug("clicked!") 
     console.debug("len: " + splitView1.__contents.length) // __contents is the SplitView's default property - an alias to the first child's data property 
     rect.sourceComponent = algo 
    } 
} 

Component { 
    id:algo 
Rectangle { 
    anchors.fill: parent 
    color: "blue" 
} 
} 
} 

Answer 3

信号をComponent.onCompletedとき、それは各分割領域に計算する：onClickedにあなたは、ローダーのソースを変更するsourceComponentプロパティを宣言するために、このような何かを持って扱います。だから私はそれが重要なポイントだと思う。あなたのやり方（挿入、動的作成）は関係ありません。分割のために新しい領域を挿入した後、領域はリセットされません。

Answer 4

QtQuick Controls 1.3以降、SplitViewはaddItem(item)methodです。