样式缩进QML TreeView的背景颜色

Question

我想更改缩进背景颜色，如下图所示：

到目前为止，我有类似的东西：

Component
{
  id: fileItem

  Rectangle
  {
    color: "blue"
  }
}

TreeView {
    id: view
    anchors.fill: parent
    anchors.margins: 2 * 12 + row.height
    model: fileSystemModel
    rootIndex: rootPathIndex
    selection: sel
    alternatingRowColors: false
    style: TreeViewStyle {
      branchDelegate: Rectangle {
        width: 16
        height: 16
        color: styleData.isExpanded ? "green" : "red"
      }
      frame: Rectangle {border {color: "blue"}}
      backgroundColor: "blue"
    }

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

    onActivated:
    {
      var url = fileSystemModel.data(index, FileSystemModel.UrlStringRole)
      Qt.openUrlExternally(url)
    }
}

它基于Qt Quick Controls - File System Browser Example

Answer 1

要自定义TreeView中的每一行，请覆盖rowDelegate属性。例如，

TreeView {
    rowDelegate: Rectangle { color: "pink" }

    style: TreeViewStyle {
      branchDelegate: Rectangle {
        width: 16; height: 16
        color: styleData.isExpanded ? "green" : "red"
    }
    frame: Rectangle {border {color: "blue"}}
    backgroundColor: "blue"
    //...
}