在QML中显示Gridview上方的文本

Question

如何在gridview上方显示文字？ 我尝试了以下代码，但在滚动时，gridview元素覆盖文本并隐藏它。即使我指定了gridview的宽度和高度，gridview元素也会在滚动时跨越边界。任何帮助表示赞赏。谢谢。

Rectangle {
width: 300; height: 400
color: "gray"

ListModel {
    id: appModel
    ListElement { name: "Music"; icon: "pics/AudioPlayer_48.png" }
    ListElement { name: "Movies"; icon: "pics/VideoPlayer_48.png" }
    ListElement { name: "Camera"; icon: "pics/Camera_48.png" }
    ListElement { name: "Calendar"; icon: "pics/DateBook_48.png" }
    ListElement { name: "Messaging"; icon: "pics/EMail_48.png" }
    ListElement { name: "Todo List"; icon: "pics/TodoList_48.png" }
    ListElement { name: "Contacts"; icon: "pics/AddressBook_48.png" }
}

Component {
    id: appDelegate

    Item {
        width: 100; height: 100

        Image {
            id: myIcon
            y: 20; anchors.horizontalCenter: parent.horizontalCenter
            source: icon
        }
        Text {
            anchors { top: myIcon.bottom; horizontalCenter: parent.horizontalCenter }
            text: name
        }
    }
}

Component {
    id: appHighlight
    Rectangle { width: 80; height: 80; color: "lightsteelblue" }
}
Text
{
    id:txt
    width: parent.width
    height: 100
    text: "8791561651"
}
GridView {
    anchors.top:txt.bottom
    height: 200
    width: parent.width
    cellWidth: 100; cellHeight: 100
    highlight: appHighlight
    focus: true
    model: appModel
    delegate: appDelegate
}
}

Answer 1

根据您想要实现的目标，有几种方法可以尝试：

1. 将Gridview的剪辑属性设置为true。这将阻止视图在其他元素之上。
2. 将Text元素放在GridView元素之后。这将确保文本位于Gridview之上。如果您没有设置剪辑，则gridview项目将低于文本项目。