99 lines
2.6 KiB
QML
99 lines
2.6 KiB
QML
// Copyright (C) 2022 The Qt Company Ltd.
|
|
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only
|
|
|
|
import QtQuick
|
|
import QtQml.Models
|
|
|
|
Item {
|
|
width: 500
|
|
height: 200
|
|
|
|
property list<QtObject> myModel: [
|
|
QtObject {
|
|
objectName: "Item 0"
|
|
property bool selected: true
|
|
},
|
|
QtObject {
|
|
objectName: "Item 1"
|
|
property bool selected: false
|
|
},
|
|
QtObject {
|
|
objectName: "Item 2"
|
|
property bool selected: false
|
|
},
|
|
QtObject {
|
|
objectName: "Item 3"
|
|
property bool selected: true
|
|
},
|
|
QtObject {
|
|
objectName: "Item 4"
|
|
property bool selected: true
|
|
},
|
|
QtObject {
|
|
objectName: "Item 5"
|
|
property bool selected: true
|
|
},
|
|
QtObject {
|
|
objectName: "Item 6"
|
|
property bool selected: false
|
|
}
|
|
]
|
|
|
|
ListView {
|
|
objectName: "listView"
|
|
id: listview
|
|
width: 500
|
|
height: 200
|
|
|
|
focus: true
|
|
clip: true
|
|
spacing: 2
|
|
orientation: ListView.Horizontal
|
|
highlightMoveDuration: 300
|
|
highlightMoveVelocity: -1
|
|
preferredHighlightBegin: (500 - 100) / 2
|
|
preferredHighlightEnd: (500 + 100) / 2
|
|
highlightRangeMode: ListView.StrictlyEnforceRange
|
|
cacheBuffer: 500
|
|
currentIndex: 1
|
|
|
|
model: DelegateModel {
|
|
id: delegateModel
|
|
filterOnGroup: "visible"
|
|
model: myModel
|
|
groups: [
|
|
DelegateModelGroup {
|
|
name: "visible"
|
|
includeByDefault: true
|
|
}
|
|
]
|
|
delegate: Rectangle {
|
|
id: tile
|
|
objectName: model.modelData.objectName
|
|
|
|
width: 100
|
|
height: 100
|
|
border.width: 0
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
|
|
visible: model.modelData.selected
|
|
Component.onCompleted: {
|
|
DelegateModel.inPersistedItems = true
|
|
DelegateModel.inVisible = Qt.binding(function () {
|
|
return model.modelData.selected
|
|
})
|
|
}
|
|
|
|
property bool isCurrent: ListView.isCurrentItem
|
|
color: isCurrent ? "red" : "green"
|
|
|
|
Text {
|
|
id: valueText
|
|
anchors.centerIn: parent
|
|
text: model.modelData.objectName
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|