qt - 根据 listElement 键切换 listView 的委托
问题描述
我有一个ListModel
动态填充的。我想为模型中的一个元素选择/切换委托(所有其他元素都应该与另一个委托一起查看),这可能吗?
我的 QML 模型有两个加载的组件委托。我希望当“键”listElement
匹配一个值(“ link
”)时,委托被设置为组件之一。我通过设置listView.delegate
; 问题是选择似乎有效,但它会递归地更改所有元素的委托,包括已加载的元素,我最终只为listView
.
我在 SO 中看到了很多解决方案,但没有一个与我的用例相匹配,在大多数情况下,这篇文章看起来很相似,但它动态加载了委托组件,我不确定它是否有效,我不想最终加载动态的组件。这是我的 QML 代码,包括我如何填充模型和选择委托:
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Window 2.3
Window {
visible: true
id: mainQML
width: 640
height: 480
title: qsTr("Offers View")
Item {
id: offersPage
ListModel{
id: barcdeLockupOffers
// model will be dynamically populated.
// Depending on value of key , I want to select listView delegete.
ListElement {
key: ""
value: ""
}
}
Component {
id: offersTextDelegate
Rectangle {
id: offersRect
anchors { left: parent.left; right: parent.right}
height: offersColumn.implicitHeight + 4
border.width: 1
border.color: "lightsteelblue"
radius: 2
Column {
id: offersColumn
//Text { text: "Merchent: " + merchant ; property bool useStyle: true}
Text {
id: offerdata
text: '<font color="blue" size=14> <b>' + key +':' + '</b> </font>' + value + '\n\n';
width: mainQML.width - 40
height: 30
wrapMode: Text.Wrap
}
}
}
}
Component {
id: offersHTTPDelegate
Rectangle {
id: offersRect2
anchors { left: parent.left; right: parent.right}
height: offersColumn2.implicitHeight + 4
border.width: 1
border.color: "lightsteelblue"
radius: 2
Column {
id: offersColumn2
Text {
text: "<a href=" + value + ">" + "Click here for Offer details" + "</a>"
color: "blue"
property bool useStyle: true
MouseArea{
anchors.fill: parent
onClicked: {
parent.color="grey"
Qt.openUrlExternally(value)
}
}
}
}
}
}
ListView {
id: offersView
anchors.top: parent.top
height: mainQML.height - 100
anchors.margins: 10
model: barcdeLockupOffers
}
}
Component.onCompleted: {
barcdeLockupOffers.clear();
var listModelKeys= ["Title", "Price", "Condition", "Avalability", "link"]
var listModelValues = ["Coffee Machine", "14", "New", "Available", "https://www.amazon.com/Nespresso-VertuoPlus-Coffee-Espresso-DeLonghi/dp/B01NBJ2UT5/ref=sr_1_1_sspa?s=home-garden&ie=UTF8&qid=1527543544&sr=1-1-spons&keywords=coffee+maker&psc=1"]
for (var x = 0 ; x < listModelKeys.length ; x++){
barcdeLockupOffers.append({key: listModelKeys[x] , value: listModelValues[x]})
//console.log("Key = : " + listModelKeys[x])
if (listModelKeys[x] === "link")
offersView.delegate = offersHTTPDelegate
else
offersView.delegate = offersTextDelegate
}
}
}
解决方案
如您所知,delegate
所有项目都通用,您不能为指定项目分配不同的委托。最简单的方法是使用Loader
,例如:
import QtQuick 2.10
import QtQuick.Window 2.2
Window {
visible: true
width:480
height: 640
title: qsTr("Test")
Component {
id: type1
Rectangle {
color: "yellow"
anchors.fill: parent
}
}
Component {
id: type2
Rectangle {
color: "orange"
anchors.fill: parent
}
}
ListView {
anchors.fill: parent
model: 10
delegate: Loader {
sourceComponent: index % 2 ? type1 : type2
height: 30
width: parent.width
}
}
}
推荐阅读
- android - 如何像滑块一样使用 ViewFlipper
- amazon-web-services - 模板格式错误:模板的 Resources 块中未解决的资源依赖项 [EC2Instance1, EC2Instance2]
- http - 问:应用层协议是程序吗?
- scala - Akka Streams (Scala):过滤异常
- scala - 从数据框列中读取路径并从数据框中添加另一列
- godot - Godot:仅实例化一个标签
- c# - .net 是否有在创建 RegionInfo 对象之前验证区域名称的内置方法?
- r - 在R中取消列出两个列表(函数的输出)
- keras - Keras 验证损失没有减少,输入有问题
- postgresql - 在 INNER JOIN (postgreSQL) 中使用 LIMIT 语句