QMLツリービューをサイズ変更可能にする

Question

QML TreeViewとTableViewを使用して動作するアプリケーションを作成しました。ツリービューはデュアルウィンドウビューの左側にあり、TableViewはデュアルウィンドウビューの右側です（Windowsエクスプローラと同様）。

ビューの最大の端をつかんでドラッグすることで、両方のビューの幅をリサイズできるようにするにはどうすればよいですか？ SplitView - それが私たちを回転すると

ApplicationWindow { 
    visible: true 
    width: 640 
    height: 480 
    title: qsTr("File System") 

    menuBar: MenuBar { 
     Menu { 
      title: qsTr("File") 
      MenuItem { 
       text: qsTr("Exit") 
       onTriggered: Qt.quit(); 
      } 
     } 
    } 

    Item { 
     id: dualPaneBox 
     anchors.fill: parent 

    TreeView { 
     id: viewDir 
     anchors.left: parent.left 
     anchors.right: viewFiles.left 
     anchors.margins: 50 
     height: parent.height 
     width: parent.width/2 
     model: fileDirModel 
     selection: selDir 


     TableViewColumn { 
      title: "Name" 
      role: "fileName" 
      resizable: true 
     } 

     onActivated : { 
      if (viewDir.isExpanded(index)) { 
       viewDir.collapse (index); 
      } else { 
       viewDir.expand (index); 
       var url = fileDirModel.data(index, 
           FileDirModel.UrlStringRole); 
       var name = fileDirModel.data (index, 
           FileDirModel.FullNameRole); 
       viewFiles.refreshJS (url, name); 
      } 
     } 
    } 

    TableView { 
     id: viewFiles 
     anchors.right: parent.right 
     anchors.margins: 50 
     height: parent.height 
     width: parent.width/2 

     model: fileListModel 

     TableViewColumn { 
      title: "Name" 
      role: "fileName" 
      resizable: true 
     } 
     TableViewColumn { 
      title: "Size" 
      role: "size" 
      resizable: true 
      horizontalAlignment : Text.AlignRight 
      width: 70 
     } 

     TableViewColumn { 
      title: "URLString" 
      role: "UrlStringRole" 
      resizable: true 
      width: 100 
     } 

     TableViewColumn { 
      title: "Date Modified" 
      role: "lastModified" 
      resizable: true 
     } 

     function refreshJS (url, name) { 
      var myindex = fileListModel.refresh (url, name); 
     } 
    } 
    } 
} 

Answer 1

は、すでにデュアルペイン（およびそれ以上）のビューのためのQMLウィジェットがあります。上記のコードで

、私はそれは（明らかに）だけでなく、垂直分割を行うには、唯一の2つのペインに限定されるものではないことができ

SplitView { 
id: dualPane 

にライン

Item { 
id: dualPane 

を変更しました。