Question

我想将我的电话号码列表与左侧的一个字段（＆＃34;名称＆＃34;）和右侧的另一个字段（＆＃34;电话＆＃34;）对齐。但是，当尝试在委托中绑定锚属性时，它表示委托对象不是ListView组件的父对象。如何从代表处获取其他组件？

这是我的QML代码：

import QtQuick 2.7
import QtQuick.Controls 2.0

Item {
    id: enclosing_area
    width: 500
    height: 300
    ListModel {
        id: dataModel
        ListElement {
            name: "John Smith"
            phone: "1111-1111"
        }
        ListElement {
            name: "Peter Poter"
            phone: "2222-2222"
        }
        ListElement {
            name: "Anna Lasalle"
            phone: "3333-3333"
        }
    }

    ListView {
        id: list
        width: enclosing_area.width
        height: enclosing_area.height
        model: dataModel
        delegate: Rectangle  {
            width: enclosing_area.width
            border.color: "red"
            Label {
                text: name
                anchors.left: list.left
            }
            Label {
                text: phone
                anchors.right: list.right
            }
        }
   }
}

qmlscene会产生以下错误：

file:///LViewTest.qml:36:13: QML Label: Cannot anchor to an item that isn't a parent or sibling.
file:///LViewTest.qml:32:13: QML Label: Cannot anchor to an item that isn't a parent or sibling.
file:///LViewTest.qml:36:13: QML Label: Cannot anchor to an item that isn't a parent or sibling.
file:///LViewTest.qml:32:13: QML Label: Cannot anchor to an item that isn't a parent or sibling.
file:///LViewTest.qml:36:13: QML Label: Cannot anchor to an item that isn't a parent or sibling.
file:///LViewTest.qml:32:13: QML Label: Cannot anchor to an item that isn't a parent or sibling.

第32和32行是＆＃34; anchors.left＆＃34;和＆＃34; anchors.right＆＃34;声明。在我的情况下，如何从委托中绑定到另一个对象中的属性？

Answer 1

起初：

通常会打电话给您enclosing_area root 其次，如果您没有锚定到兄弟姐妹，请不要使用要锚定的对象的id，而是使用parent。

这可以防止您出现错误，因为 - 您尝试做的事情 - 不是锚定到Label的父级，而是锚定到parent s parent。
parent的{{1}}将是Label中的Rectangle。

delegate

为什么您希望锚定到ListView { id: list // <- This is not the parent of the Labels, but of the delegateRectangle width: enclosing_area.width // works height: enclosing_area.height // works // anchors.fill: parent <- would do the same, more flexible, and only one line. model: dataModel delegate: Rectangle { id: delegateRectangle // <--- This is the parent of the two Labels width: enclosing_area.width height: 30 // <- a heightis necessary. // As the objects are repositioned you need to set it explicitely // and can't use anchoring. You could use the // implicit height of it's children, to make it nice border.color: "red" Label { text: name anchors.left: delegateRectangle.left // this would work instead. // list.left woudl try to anchor to the 'grandparent' } Label { text: phone anchors.right: parent.right // this would be the reccomended way. // Would also anchor to delegateRectangle } } }而不是parent parent？该对象将（几乎）始终具有可视父级，但此可视父级可能会更改。要么是因为你在代码中添加了一个额外的层，要么稍后 - 或者甚至在运行时，通过重新创建它。所以你总是需要更新锚点因此，锚定到id可以解决一个简单的错误。

Answer 2

利用锚点而不是尝试硬编码子元素的大小以匹配其父元素。这将使您能够一直使用锚点。（类似地，使用锚边距而不是硬编码的x，y值）。你可以通过锚点获得很多其他好处。

    ListView {
        id: list
        anchors.fill: parent
        model: dataModel
        delegate: Rectangle  {
            anchors.left: parent.left
            anchors.right: parent.right
            height: 50       // you need a height otherwise all rows are on the same line
            border.color: "red"
            Label {
                text: name
                anchors.left: parent.left
            }
            Label {
                text: phone
                anchors.right: parent.right
            }
        }
   }
}

如何在委托中对齐QML组件

2 个答案: