创建自定义组件

您可以使用项目向导模板创建自定义组件和控件，也可以将组件实例移动到单独的文件中，将其转化为可以创建实例的新组件。然后，您可以在其他组件中使用新组件的实例。

自定义组件存储在Components >My Components 中。您可以通过将自定义组件从Components 拖动到2D 或Navigator 视图来创建自定义组件实例。

从零开始创建组件

使用向导模板创建自定义组件：

1. 选择File >New File > Qt Quick Files> Qt Quick UI File>Choose 以创建新的.ui.qml 文件。

   注意： 只有当文件名以大写字母开头时，才会在Components >My Components 中列出组件。

2. 选择Design ，在2D 视图中打开文件。
3. 从Components 拖动一个组件到Navigator 或2D 视图。
4. 在Properties 视图中编辑组件属性。可用属性取决于组件类型。您可以在Connections 视图中的Properties 选项卡上为组件添加属性。
5. 要以Qt Quick Designer 默认不支持的方式更改组件实例的外观和行为，可以在Connections 视图的Properties 选项卡上定义自定义属性。

以下章节将详细介绍如何使用2D 视图编辑 2D 内容，以及如何使用基本组件实例创建 UI 控件的示例：

• 二维视图
• 创建按钮
• 创建可缩放按钮和边框

命名约定

建立命名约定可使用户界面中的组件井然有序。为组件准确命名并赋予合适的 ID。尤其要检查和修改从设计工具中导出的组件的默认名称，以创建可靠且不言自明的名称，并遵循已建立的命名约定。

例如，一个按钮符号的 ID 可能是myButton_symbol，而不同图层的 ID 可能是myButton_symbol_default。为了在项目后期准备更多的鼠标区域，可以为它们使用类似的 ID，如myButton_symbol_hotspot。在屏幕中将按钮作为实例使用时，应为每个实例赋予一个与该屏幕相关的唯一 ID。例如，myButton_ myMenu _home、myButton_myMenu_profile 和myButton_myMenu_settings。

将组件实例转化为自定义组件

创建可重用组件的另一种方法是将组件实例转移到单独的组件文件 (.ui.qml) 中，从而将组件实例转化为自定义组件。右键单击Navigator 或2D 视图中的组件实例，在上下文菜单中选择Create Component 。

为新组件命名，并选择是为新组件还是为原始组件设置属性。

当你选择OK 时，一个新的组件文件将被创建，组件的实例将被添加到当前组件文件的代码中。2D 视图中的用户界面外观不会改变。

要打开新的组件文件以编辑所有组件实例的属性，请右键单击组件，然后在上下文菜单中选择Go into Component 。有关打开基本组件的其他方法，请参阅在组件内移动。

自定义组件在Components >My Components 中列出，你可以使用它们的实例来构建更多组件。

用模板合并文件

你可以将当前组件文件与现有的第二个组件文件合并，使用第二个文件的方式类似于使用 CSS 样式表。

要将当前文件与模板合并，请右击Navigator 或2D 视图中的组件，并在上下文菜单中选择Merge with Template 。

在Template 字段中，选择要用作模板的文件。