Qml當量的QDataWidgetMapper

Question

我有一棵樹基於QAbstractItemModel和qml TreeView來顯示其內容。現在我想在左邊有一個兩部分的UI，左邊是TreeView，右邊是模型的不同部分。輸入字段應連接/映射到TreeView中的當前/選定項目。

在傳統的基於QtWidget的代碼中，我使用了QDataWidgetMapper，它工作得相當好（現在在Qt5中看起來更好）。

作爲第一個原型，我使用了兩個ListViews，將seconds delegate.height設置爲listView的高度並對其進行自動滾動。

ListView { 
    id: listView2 
    x: 300 
    y: 146 
    width: 263 
    height: 160 
    interactive: false 
    flickableDirection: Flickable.VerticalFlick 
    boundsBehavior: Flickable.StopAtBounds 
    snapMode: ListView.SnapOneItem 
    clip: true 
    currentIndex: core.product.index 
    //highlight: Rectangle { color: "lightsteelblue"; radius: 5 } 
    focus: true 
    delegate: Item { 
     width: parent.width 
     height: listView2.height 
     Row { 
      id: row2 
      spacing: 10 

      Text { 
       text: name 
       anchors.verticalCenter: parent.verticalCenter 
       font.bold: true 
      } 

      Text { 
       text: type 
       anchors.verticalCenter: parent.verticalCenter 
       font.bold: true 
      } 

      Loader { 
       source: { 
        if (model.type == "SingleGrasp") { 
         "SingleGrasp.qml" 
        } else { 
         "MultGraspTrans.qml" 
        } 
       } 
      } 
     } 
    } 
    model: core.product.graspModel 
} 

現在我正在考慮對TreeView做同樣的事情，但它看起來像一個黑客。你可以在這裏看到：

TreeView { 
    id: leafView 
    x: 300 
    y: 146 
    width: 263 
    height: 160 
    clip: true 
    focus: true 
    TableViewColumn { 
     title: "Name" 
     role: "name" 
    } 
    style: TreeViewStyle { 
     branchDelegate: Item {} 
     indentation: 0 
    } 

    rowDelegate: Item { 
     height: styleData.selected ? leafView.height * 0.99 : 0 
    } 
    itemDelegate: Item { 
     visible: styleData.selected 
     x: 5 
     width: parent.width 
     height: leafView.height 
     Row { 
      id: row12 
      spacing: 10 

      Text { 
       text: model.name 
       anchors.verticalCenter: parent.verticalCenter 
       font.bold: true 
      } 

      Text { 
       text: model.type 
       anchors.verticalCenter: parent.verticalCenter 
       font.bold: true 
      } 

      Loader { 
       source: { 
        if (model.type == "SingleGrasp") { 
         "SingleGrasp.qml" 
        } else { 
         "MultGraspTrans.qml" 
        } 
       } 
      } 
     } 
    } 
    headerDelegate: Item {} 

    model: myModel 
    selection: treeView1.selection 
    //treeView1 has selection: SelectionModel{model: myModel} 

    function autoExpand(index) { 
     print(index) 
     var oneUp = index 

     do { 

      print(oneUp) 
      oneUp = oneUp.parent 
      expand(oneUp) 
      print("do") 
      print(oneUp) 
      //print(oneUp.isValid) 
     } while (myModel.indexIsValid(oneUp)); 

    } 

    Component.onCompleted: treeView1.selection.currentChanged.connect(autoExpand) 
} 

會編碼拉平QAbstractProxyModel當前選定的項目映射到QAbstractListModel般的模型更合理呢？

Answer 1

我認爲經由QSortFilterProxyModel用C解決這個++但實際上有一個純QML溶液：

TreeView { 
    id: myTreeView 
    model: myModel 
    selection: ItemSelectionModel{ model: myModel } 
} 

DelegateModel { 
    id: leafViewModel 

    groups: [ 
     DelegateModelGroup { 
      name: "current" 
      includeByDefault: false 
     } 
    ] 

    filterOnGroup: "current" 

    model: myModel 
    delegate: Flow{ 
     Text { 
      text: model.name 
     } 
     TextField { 
      id: normalTextField2 
      text: model.name 
      onEditingFinished: model.name = text 
     } 
    } 
    property var currentIndex: myTreeView.selection.currentIndex 

    property int prevIndex: 0 

    onCurrentIndexChanged: { 
     items.get(prevIndex).inCurrent = false 
     rootIndex = currentIndex.parent 
     items.get(currentIndex.row).inCurrent = true 
     prevIndex = currentIndex.row 
    } 
} 

ListView { 
    model: leafViewModel 
}