Qt 如何在布局中正确嵌套QML ListView的维度？

我试图制作一个简单的QML布局，左边是一个列表，右边是一个内容窗格和一个列表。列表可以有固定的宽度，内容窗格应该填满剩余的空间。（有人记得CSS圣杯吗？）

我提出了以下几点，但我一直遇到很多问题，我觉得我完全错了，违背了在QML中做事情的“正确”方式

起初，我遇到了让列表占据整个高度的问题，最后我通过

height:childrenRect.height

解决了这个问题，所有其他解决方案都导致了绑定循环

接下来，我开始考虑允许用户选择项目，而这正是真正的麻烦开始的地方。经过长时间的挣扎，我发现它不起作用，因为我的物品没有宽度。但我一辈子都搞不懂如何让名单和孩子一样宽，或者让孩子们和名单一样宽

另一个问题是焦点无法正常工作。高光显示正常（虽然硬编码宽度有点错误），但我无法更改它。单击或按下任何键都不会将突出显示移动到另一个项目

import QtQuick 2.0
import QtQuick.Controls 1.0
import QtQuick.Layouts 1.3

ApplicationWindow
{
    visible: true
    width: 800
    height: 600
    title: qsTr("example")

    RowLayout {
      anchors.fill: parent
      anchors.margins: 10
      spacing: 10

      GroupBox {
        title: "List1"
        Layout.preferredWidth: 100
        Layout.fillHeight: true
        ListView {
          height: childrenRect.height
          model: ListModel {
              ListElement { name: "Bill Smith" }
              ListElement { name: "John Brown" }
              ListElement { name: "Sam Wise" }
          }
          delegate: Item {
            height: 50
            Text { text: name }
          }
        }
      }
      TabView {
          Layout.fillHeight: true
          Layout.fillWidth: true
          Tab {
              title: "Red"
              Rectangle { color: "red" }
          }
          Tab {
              title: "Blue"
              Rectangle { color: "blue" }
          }
          Tab {
              title: "Green"
              Rectangle { color: "green" }
          }
      }
      GroupBox {
        title: "List2"
        Layout.minimumWidth: 100
        Layout.fillHeight: true
        ListView {
          id: robotList
          height: childrenRect.height
          focus: true
          highlight: Rectangle { color: "lightsteelblue"; radius: 5 }
          model: ListModel {
              ListElement { name: "Foo" }
              ListElement { name: "Bar" }
              ListElement { name: "Baz" }
          }
          delegate: Item {
            height: 50
            width: 180
            Text { text: name }
          }
        }
      }
    }
}

---

要使突出显示生效，需要在ListView上设置currentIndex

delegate: Item {
    height: 50
    width: 180
    Button { 
        text: name 
        onClicked: {
            robotList.currentIndex = index
        }
    }
}

对于列表的宽度，我认为您应该将其锚定到其父级（并删除

高度：childrenRect.height

）：

---

我不断收到绑定循环。我现在使用Row而不是RowLayout，给我的GroupBox一个固定的宽度，现在我终于可以使用anchors.fill了

ListView {
    id: robotList
    anchors.fill: parent
    ...
}