如何在点击时加载 QML 组件

Question

我会尝试用一个简单的例子来解释我的问题。

我有一个 Rectangle A 和一个 Rectangle B。我希望当您单击 A 时，view（例如 listView）会加载到 B 中。如果您再次单击 A，listView 将消失。我知道这与 class Loader 有关，但我无法使其正常工作。

Rectangle {
    id: A
    MouseArea {
         anchors.fill: parent
         onClicked {
            //Load or Close listView
         }
    }
 }
 Rectangle {
     id:B
     //here load or unload the listView
 }

谁能提供一个简单的例子？

注意：我不想使用 visible，因为我需要在单击矩形时刷新 data。

Answer 1

这是一个简单的例子：

Rectangle {
    id: A
    MouseArea {
        anchors.fill: parent
        onClicked {
            ld.active = !ld.active
        }
   }
}

Rectangle {
    id:B

    Loader {
        id: ld

        sourceComponent: comp
        active: false
        anchors.fill: parent
    }

    Component {
         id: comp

         Rectangle { //replace this with your listview
              color: blue
         }
    }
}

当您单击矩形时 A 加载程序和组件的状态发生变化 comp loading/unloading。

如何在点击时加载 QML 组件

How to load a QML component on click

qt

loader

qml

qtquick2