这是QML中最小可行的TreeView模型吗？

相关文章推荐

唠叨的薯片 · 家居行业 CXO ...· 1 年前 ·

喝醉的卤蛋 · 3-如何将 PDF ...· 1 年前 ·

爽快的充电器 · JavaScript锁定对象的3种方法_js ...· 1 年前 ·

非常酷的红茶 · Springbatch ...· 2 年前 ·

逆袭的热带鱼 · android 查看触屏坐标值 adb ...· 2 年前 ·

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?

// 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?"
}

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]});
                                sprite.destroy()

这是QML中最小可行的TreeView模型吗？ 内容来源于 Stack Overflow，遵循 CC BY-SA 4.0 许可协议进行翻译与使用。IT领域专用引擎提供翻译支持 腾讯云小微IT领域专用引擎提供翻译支持

2 个回答