从 QML 文件中包含另一个 QML 文件

Question

Stackoverflow 上还有一个关于这个问题的问题，但我找不到可以接受的解决方案。所以我再次问，因为老问题没有引起注意。

情况是这样的。我有由“main.qml”、“feature1.qml”、“feature2.qml”定义的应用程序屏幕。

这些屏幕共享标题栏下方的相同工具栏。工具栏有多个项目，所以复制粘贴 QML 代码就像疯了一样。这个问题： QML 文件包含 - 还是一个整体文件（结构 QML 代码）？ 说可以只使用 QML 文件名作为组件名，但我无法让它工作。

有什么解决办法吗？请详细说明。

原文由 jondinham 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

假设您有一个名为 main.qml 的文件和另一个名为 MyCustomText.qml 的文件中的组件。如果两个文件都在同一个目录中，您可以像这样直接加载组件：

 // in Main.qml
Rectangle {
  id: root
  MyCustomText {
    text: "This is my custom text element"
  }
}

如果 MyCustomText.qml 位于另一个子目录 MyComponents 例如要将所有自定义组件组合在一起，您首先需要 import 在使用组件之前的目录以相同的方式：

 // in Main.qml
import "MyComponents"

Rectangle {
  id: root
  MyCustomText {
    text: "This is my custom text element"
  }
}

另一个需要注意的重要事项是，如果您希望能够以这种方式使用它们，您的 QML 文件应 始终以大写字母开头

当然，您的 Loader 解决方案也可以，但这是在其他组件中导入 QML 文件的最简单方法。

原文由 koopajah 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

这很容易。将所有文件组件放在“组件”之类的文件夹中。在您的情况下，文件的名称可以是 Toolbar.qml 。为您的工具栏编写 QML 代码，我的示例将绘制一个红色矩形。

  import QtQuick 2.6

    Item {
        width: 500
        height: 100
        Rectangle {
            width: 500
            height: 100
            color: "red"
            radius: width * 0.5
        }
    }

然后，在您想要使用此组件的屏幕中（例如，文件 main.qml ），就像这样简单：

 import "components" as Components


Components.Toolbar {
    Layout.fillHeight: true
}

注意文件的位置，所有组件都应该以大写字母开头，在这个例子中：

 \main.qml
\components\Toolbar.qml

原文由 Adriano Campos 发布，翻译遵循 CC BY-SA 4.0 许可协议