我列出了一个包含三个项目的折叠列表:“嘿”、“什么”和“向上?”。我想把它放到树状视图中。我知道这个列表只会包含这三个项目,因此,我想知道如何将这三个项目“”在一起。
我知道有一些敏捷系统的实现,支持添加和删除父/子对象,查找索引……强大的模型。但是,我只需要在可展开/可折叠的视图中显示这些项。以下是我通读的关于C++和QAbstractItemModels的内容:
由Qt自己开发的基于on:
下面是实现treeview with model的最简单可行的代码:
import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
Window {
id: mywindow
visible: true
width: 640
height: 480
TreeView {
id: treeview
anchors.fill: parent
TableViewColumn {
title: "Phrase"
role: "phrase"
}
model: phraseModel
}
ListModel {
id: phraseModel
ListElement { phrase: "Hey"; }
ListElement { phrase: "What's"; }
ListElement { phrase: "Up?"; }
}
}
我想让输出产生一个嵌套的堆栈,如下所示:
Hey
What's
Up?
但我将所有内容放在一个单独的列中,所有内容都相互对齐:
Hey
What's
Up?
我知道我没有分配家长,我也不完全确定如何做到这一点-但我甚至不确定这是否是需要对这段代码所做的事情。所以我的问题是:要将这三个元素堆叠成一个可展开/可折叠的视图,缺少的最后一步是什么?
发布于 2019-05-23 16:18:56
我用QML创建了一个可折叠的框架(一个带有标题和内容的组框)。如果您确定永远不会更改结构,则可以使用:
我通过删除无用的部分(动画、装饰品等)简化了代码。因此,下面的代码可以改进。但是,我保留了这个想法:
// CollapsibleGroupBox.qml
Item {
property alias contentItem: content.contentItem;
property string title: ""
Item {
id: titleBar
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
height: 30
Row {
anchors.fill: parent
CheckBox {
Layout.alignment: Qt.AlignLeft
id: expand
checked: true;
}
Text {
Layout.alignment: Qt.AlignLeft
text: title
}
}
}
Pane {
anchors.left: parent.left
anchors.right: parent.right
anchors.top: titleBar.bottom
anchors.bottom: parent.bottom
topPadding: 0
visible: expand.checked
id: content
}
}
// Main.qml
Item {
height: 500
width: 500
CollapsibleGroupBox {
anchors.fill: parent
title: "Hey!"
contentItem: CollapsibleGroupBox {
title: "What's"
contentItem: CollapsibleGroupBox {
title: "up?"
}
}
}
}
您将获得:
您也可以用MouseArea
替换复选框。
发布于 2020-01-09 05:09:13
我还创建了一个只使用QML组件的模型:
import QtQuick 2.9
import QtQuick.Window 2.2
import UISettings 1.0
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Controls 1.4 as SV
Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
Flickable {
id: flick
anchors.fill: parent
clip: true
contentHeight: col.implicitHeight
property var mymodel: {
"animals": {
"big": {
"land": "elephants",
"water": "whales"
},
"small": {
"land": "mice",
"water": "fish"
}
},
"plants": {
"trees": "evergreens"
}
}
Column {
id: col
Component.onCompleted: componentListView.createObject(this, {"objmodel":flick.mymodel});
}
Component {
id: componentListView
Repeater {
id: repeater
property var objmodel: ({})
model: Object.keys(objmodel)
ColumnLayout {
Layout.leftMargin: 50
Button {
property var sprite: null
text: modelData
onClicked: {
if(sprite === null) {
if(typeof objmodel[modelData] === 'object')
sprite = componentListView.createObject(parent, {"objmodel":objmodel[modelData]});
}
else
sprite.destroy()
}
}
}
}
}
}
}
https://stackoverflow.com/questions/56264007
复制相似问题