如何将 UbuntuListView 保持在其边界之间？

Question

我UbuntuListView在 Ubuntu Touch 的 QML 应用程序中有一个。在它上面，还有另一个组件 - TextField。

列表的初始位置看起来不错。此外，如果列表小于可用区域，则滚动不会出现问题。

但是，如果列表足够大，则在滚动时以及滚动完成后，列表都会与上面的组件重叠：

主文件.qml

import QtQuick 2.4
import QtQuick.Layouts 1.1

import Ubuntu.Components 1.2

MainView {

    width: units.gu(40)
    height: units.gu(30)

    Page {
        ColumnLayout {
            spacing: units.gu(1)
            anchors {
                margins: units.gu(2)
                fill: parent
            }

            TextField {
                id: textInput
                Layout.fillWidth: true;
                placeholderText: i18n.tr("Add an item")
            }

            MyList {
                anchors {
                    left: parent.left
                    right: parent.right
                }

                Layout.fillHeight: true
            }
        }
    }
}

我的列表.qml

import QtQuick 2.4
import Ubuntu.Components 1.2
import Ubuntu.Components.ListItems 1.0

Item {

    ListModel {
        id: listModel
        ListElement {itemName: 'one'}
        ListElement {itemName: 'two'}
        ListElement {itemName: 'three'}
        ListElement {itemName: 'four'}
    }

    UbuntuListView {
        anchors.fill: parent

        model: listModel

        delegate: ListItem {
            id: listItem

            divider.visible: false
            Label {
                id: label
                text: itemName

                verticalAlignment: Text.AlignVCenter
                height: parent.height
            }
        }
    }
}

我尝试改变z组件的属性，但没有帮助。

我是否误用了 API？或者这是 Ubuntu SDK 中的错误？（如果是这样，有什么解决方法吗？）

Answer 1

添加clip: true到UbuntuListView。

默认情况下，QML 对象将此设置为 false，这允许它们在分配的矩形之外绘制。我认为这是一种优化，因为它允许渲染器避免计算每个元素的裁剪。大多数 QML 对象只在分配的矩形内绘制，因此您不会注意到这一点。但是列表视图的列表长度足以滚动，因此将绘制在该矩形之外，因此如果您不想看到这种情况，则需要打开裁剪。