【CXX-Qt】1.3 创建QML GUI

对于Qt中的小型GUI来说，绝对使用QML。它功能强大、灵活、声明式，并且允许我们非常快速地迭代。

因此，让我们在qml文件夹中添加一个main.qml文件：

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Window 2.12

// 这必须与build.rs脚本中qml_module指定的uri和版本匹配。
import com.kdab.cxx_qt.demo 1.0

ApplicationWindow {
    height: 480
    title: qsTr("Hello World")
    visible: true
    width: 640
    color: palette.window

    MyObject {
        id: myObject
        number: 1
        string: qsTr("My String with my number: %1").arg(myObject.number)
    }

    Column {
        anchors.fill: parent
        anchors.margins: 10
        spacing: 10

        Label {
            text: qsTr("Number: %1").arg(myObject.number)
            color: palette.text
        }

        Label {
            text: qsTr("String: %1").arg(myObject.string)
            color: palette.text
        }

        Button {
            text: qsTr("Increment Number")

            onClicked: myObject.incrementNumber()
        }

        Button {
            text: qsTr("Say Hi!")

            onClicked: myObject.sayHi(myObject.string, myObject.number)
        }

        Button {
            text: qsTr("Quit")

            onClicked: Qt.quit()
        }
    }
}

这段代码将创建一个非常简单的GUI，由两个Label和两个Button组成。这里重要的部分是MyObject类型的使用。正如你所看到的，我们之前定义的类现在可以在QML中使用了。

由于它只是另一个QObject子类，因此可以在Qt的属性绑定系统中使用，就像myObject.string绑定到myObject.number一样。

然后，标签简单地显示MyObject类中定义的数据。我们可以使用两个按钮与MyObject实例进行交互。

这里再次需要强调的是，MyObject只是另一个QObject子类，可以像任何其他QObject子类一样使用。唯一的区别是，任何可调用的函数都是在Rust中定义的，而不是C++。但对于QML来说，这并没有什么区别。

现在我们有了一些应用程序代码，让我们来构建并运行这个项目吧。