当视图的父级调整大小时，如何使 ListView 的委托更改其大小？答案

【问题标题】：How to make delegate of ListView change its size when view's parent is resized?当视图的父级调整大小时，如何使 ListView 的委托更改其大小？
【发布时间】：2014-01-03 12:35:28
【问题描述】：

我遵循了 ListView (http://qt-project.org/doc/qt-5/qml-qtquick-listview.html#details) 上的 Qt 5.2 文档。我的代码几乎与文档相同，除了我想绑定到 Rectangle listArea 的宽度的 contactDelegate 的宽度。

当我运行下面的代码时，它看起来符合预期。但是，当我调整窗口大小时，委托不会随着矩形宽度的变化而调整大小。

import QtQuick 2.0

Rectangle {
    id: listArea
    width: 200; height: 50
    color: "#fffcca"

    Component {
        id: contactDelegate
        Item {
            width: listArea.width; height: 40
            Column {
                Text { text: '<b>Name:</b> ' + name }
                Text { text: '<b>Number:</b> ' + number }
            }
        }
    }

    ListModel {
        id: contactModel
        ListElement {
            name: "John Doe"
            number: "5555 1234"
        }
        ListElement {
            name: "Don Johnson"
            number: "5555 5432"
        }
    }

    ListView {
        id: contactView
        anchors.fill: parent
        model: contactModel
        delegate: contactDelegate
        highlight: Rectangle { color: "lightsteelblue"; radius: 5 }
        focus: true
    }
}

如何使代理的宽度适应外部矩形宽度的变化？

【问题讨论】：

标签： qt listview qml qtquick2

【解决方案1】：

它已经随着外部矩形改变宽度。因为delegate的width属性已经绑定到listArea的宽度。但问题是contactView 中的highlight 并没有改变它的宽度。
这可以通过将联系人视图的highlight 中的宽度属性绑定到listArea 的宽度来解决，就像contactDelegate 一样，它会变成这样

highlight: Rectangle { color: "lightsteelblue"; radius: 5; width: listArea.width }

这里是关于属性绑定的文档 http://qt-project.org/doc/qt-4.8/propertybinding.html

【讨论】：