aboutsummaryrefslogtreecommitdiffstats
path: root/tests/manual/listview/main.qml
blob: 0f81eec156ba61b26cd94523eabcc78db1c3e221 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
// Copyright (C) 2019 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only

import QtQuick 2.15
import QtQuick.Window 2.2
import QtQuick.Controls 2.5
import Qt.labs.qmlmodels 1.0
import TestModel 0.1

Window {
    id: root
    visible: true
    width: 640
    height: 480

    property int rows: 500
    property int columns: 20
    property real delegateHeight: 10
    property real delegateWidth: 50

    CheckBox {
        id: reuseItemsBox
        text: "Reuse items"
        checked: true
    }

    Rectangle {
        anchors.fill: parent
        anchors.margins: 10
        anchors.topMargin: reuseItemsBox.height + 10
        color: "lightgray"

        ListView {
            id: listView
            anchors.fill: parent

            reuseItems: reuseItemsBox.checked

            cacheBuffer: 0
            contentWidth: columns * delegateWidth
            contentHeight: rows * delegateHeight
            flickableDirection: Flickable.HorizontalAndVerticalFlick
            clip: true

            model: TestModel {
                rowCount: root.rows
            }

            ScrollBar.vertical: ScrollBar { policy: ScrollBar.AlwaysOn }
            ScrollBar.horizontal: ScrollBar { policy: ScrollBar.AlwaysOn }

            delegate: DelegateChooser {
                role: "delegateType"

                DelegateChoice {
                    roleValue: "type1"

                    Item {
                        width: listView.contentWidth
                        height: delegateHeight
                        property int reusedCount: 0

                        ListView.onReused: reusedCount++

                        Text {
                            id: text1
                            text: "Reused count:" + reusedCount
                            font.pixelSize: 9
                        }

                        Row {
                            id: choice1
                            width: listView.contentWidth
                            height: delegateHeight
                            anchors.left: text1.right
                            anchors.leftMargin: 5
                            property color color: Qt.rgba(0.6, 0.6, 0.8, 1)

                            Component.onCompleted: {
                                for (var i = 0; i < columns; ++i)
                                    cellComponent.createObject(choice1, {column: i, color: color})
                            }
                        }
                    }
                }

                DelegateChoice {
                    roleValue: "type2"

                    Item {
                        width: listView.contentWidth
                        height: delegateHeight
                        property int reusedCount: 0

                        ListView.onReused: reusedCount++

                        Text {
                            id: text2
                            text: "Reused count:" + reusedCount
                            font.pixelSize: 9
                        }

                        Row {
                            id: choice2
                            width: listView.contentWidth
                            height: delegateHeight
                            anchors.left: text2.right
                            anchors.leftMargin: 5
                            property color color: Qt.rgba(0.3, 0.3, 0.8, 1)

                            Component.onCompleted: {
                                for (var i = 0; i < columns; ++i)
                                    cellComponent.createObject(choice2, {column: i, color: color})
                            }
                        }
                    }
                }
            }

        }
    }

    Component {
        id: cellComponent
        Rectangle {
            height: delegateHeight
            width: delegateWidth
            property int column
            Text {
                text: "Lorem ipsum dolor sit amet"
                font.pixelSize: 9
            }
        }
    }
}