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

Posted 2023-02-16

【中文标题】如何将我的 QML 代码拆分为多个文件？

【英文标题】：How do I split my QML code into multiple files?

【发布时间】：2016-01-31 20:12:31

【问题描述】：

我刚刚开始使用 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 代码拆分为多个文件的正确方法是什么？

【参考方案1】：

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

ControlView 
   // More definition follows

你会这样使用它：

property Component dateTumbler: DateTumblerView 

或者：

Component 
    id: dateTumbler

    DateTumblerView 

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

DateTumblerView 

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

更多详情请见Defining Custom QML Types for Re-use。

【讨论】：

感谢您的回答。我试过这样做，它抱怨 ControlView 不是一种类型。我将 ControlView 的定义添加到我的原始帖子中

忽略我的上一条评论……那是因为我不会拼写。需要我的第一杯咖啡...