如何将我的 QML 代码拆分成多个文件？

Question

我刚开始玩 QML 并且看到我有一堆组件如下：

Window {
    ....
    property Component dateTumbler: ControlView {
        // Definition follows
    }

    property Component timeTumbler: ControlView {
       // More definition follows
    }

    // More controls
}

这使得主 QML 文件非常长，编辑和维护起来也很麻烦。我试图将其分成不同的文件，如下所示：

// DateTumblerView.qml
component: DateTumblerView { // Not sure how to inherit here..
    // Definition here
}

我正在尝试这样使用它：

property component dateTumbler: DateTumblerView {}

然而，这永远行不通，也从未找到 DateTumblerView。我不确定我这样做是否正确。

[编辑] ControlView定义如下：

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtMultimedia 5.5

Rectangle {
    id: view
    property bool darkBackground: false

    Text {
        id: textSingleton
    }

    SoundEffect {
        id: playCalSound
        source: "qrc:/sound/test.wav"
    }
}

[结束编辑]

将QML代码拆分成多个文件的正确方法是什么？

Answer 1

您的 DateTumblerView.qml 文件应如下所示：

ControlView {
   // More definition follows
}

你会像这样使用它：

property Component dateTumbler: DateTumblerView {}

或者：

Component {
    id: dateTumbler

    DateTumblerView {}
}

或者如果你想直接使用它：

DateTumblerView {}

这与您的代码仅在一个文件中时几乎相同。任何时候您执行 <Type> {}，您都在继承该类型并可以设置或添加新的属性、函数和子组件。不同之处在于它在一个单独的文件中，有一个特定的名称（文件的名称），并且您可以根据需要多次重复使用该代码。

有关详细信息，请参阅 Defining Custom QML Types for Re-use。

如何将我的 QML 代码拆分成多个文件？

How do I split my QML code into multiple files?

qt

qml

qtquick2

qtquickcontrols