qml----Model/View入门（九）Repeater

最新推荐文章于 2025-05-20 14:36:17 发布

asdsa12311

最新推荐文章于 2025-05-20 14:36:17 发布

阅读量528

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/SaveDictator/p/8244556.html

本文详细介绍了QML中Repeater的使用方法及其与ListView的区别。Repeater能够根据提供的模型批量创建相同类型的Item组件，适用于不同场景，如数字、字符串列表或对象列表等。同时对比了Repeater与ListView在性能上的差异。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

　　repeater，用于创建多个基于item的组件，通常会用到三个属性，count-创建item的数量，model-指定数据，delegate-待实例化的模型，一般在创建repeater时不显示初始化。另外，还有其它常用属性：
　　itemAt(index) 根据索引返回对应的delegate实例
　　model 可以取数字(表示创建的数量)、字符串列表、对象列表、ListModel
　　虽然repeater可以一次性创建大量的同一类型的Item，但是当量大时，效率就会低下；而listview呢它会创建少部分item，直到用户需要看到它时才会再创建。

　　下面是展示代码

import QtQuick 2.2
import QtQuick.Layouts 1.1

Rectangle {
    id: root
    width: 320
    height: 480
    color: "#EEEEEE"

    Grid{
        anchors.left: parent.left
        anchors.leftMargin: 4
        anchors.top: parent.top
        anchors.topMargin: 4
        rows: 3
        spacing: 5

        Repeater{
            //model: 8 //数字模式
            model: ["A", "B", "C", "D", "E", "F", "G", "H"]   //字符串模式
//            model:[
//                {"text": "A", "object": "RA"},
//                {"text": "B", "object": "RB"},
//                {"text": "C", "object": "RC"},
//                {"text": "D", "object": "RD"},
//            ]         //对象模式

//            model: ListModel{
//                ListElement{name : "A"; object: "RA";}
//                ListElement{name : "B"; object: "RB";}
//                ListElement{name : "C"; object: "RC";}
//                ListElement{name : "D"; object: "RD";}
//            }         //ListModel模式

            Rectangle{
                width: root.width / 3 - 7
                height: width
                color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1)

                Text{
                    anchors.centerIn: parent
                    font.pixelSize: 15
                    font.bold: true
                    color: "red"
                    text: modelData //modelData.name 或者modelData.text
                }
            }
        }
    }
}