浏览组件文件

Navigator 视图显示当前组件文件中的组件及其关系。组件 (1) 以树形结构列出，位于其父组件 (2) 的下方。要预览组件，可将鼠标悬停在组件上 (3)。

在Navigator 视图中选择组件，可在Properties 视图中编辑其属性。组件可以访问其父组件的属性。要在2D 视图中选择组件，请右键单击一个组件，然后在Selection 子菜单中选择另一个组件。

通常情况下，子组件位于2D 视图中父组件的内部。但是，子组件并不一定要位于父组件内。例如，您可能想让鼠标区域大于其下方的矩形或图像。

复制组件时，其所有子组件也会被复制。删除组件时，其子组件也会被删除。

选择上下文菜单命令可对组件应用命令。命令的可用性取决于组件类型。例如，在上下文菜单中选择Change Source URL ，就可以更改图像组件的来源。

为组件图标着色

给组件图标着色可在Navigator 中直观地区分不同类型的组件。

要对Navigator 中列出的组件图标进行着色，请选择 （组件图标着色）。着色功能使用以下颜色：

• 绿色表示 2D 组件。
• 黄色表示 3D 组件。
• 蓝色表示材质和纹理。
• 灰色表示其他类型的组件。

在导航器中显示和隐藏组件

使用以下方法在Navigator 中显示和隐藏组件。

显示和隐藏参考节点

您可以选择在Navigator 中显示或隐藏参照节点。单击引用节点可选择引用节点。

Navigator 中的一个组件可能有与其一个或多个属性绑定的节点，这些节点被称为引用节点。切换引用节点的可见性，将它们显示为每个组件的子节点。被引用的节点会嵌套在当前节点下，从而更容易追踪绑定和节点间的依赖关系。

要切换引用节点的可见性，请选择 （显示引用节点）。

显示和隐藏其他组件

要在2D 视图中显示和隐藏应用程序特定部分的组件，请在Navigator 中选择 和 。

要更改组件在应用程序代码中的可见性，请在Properties 视图中设置其Visibility ，或在右键菜单中选择Visibility 。

您还可以在Properties 中将Opacity 字段设置为 0，以隐藏用户界面中要应用动画的组件。

与所有属性一样，可见性和不透明度继承自父组件。要隐藏或显示子组件，请编辑父组件的属性。

要在Navigator 中显示和隐藏不可见组件，请选择 。

隔离节点

您可以在Navigator 中隔离选定的 2D 节点，以便只显示需要的节点。当您希望隐藏Navigator 中的许多节点，而又不想逐个选择和隐藏时，隔离节点非常有用。

要隔离节点

1. 在Navigator 中选择要隐藏的节点。
2. 右键单击所选节点访问右键菜单，然后选择Isolate Selection 或Shift+B。

要在Navigator 中显示所有节点，请右键单击所选节点并选择Show All Nodes 或选择Alt/Option+B。

锁定组件

在设计复杂的应用程序时，很容易不小心修改Qt Quick Designer 视图中某个组件的属性，从而导致令人惊讶的结果。例如，当您试图选择或变换某个组件时，2D 视图可能会变得拥挤，其他组件可能会挡住您的去路，因此您最终变换的组件数量会超过您的预期。

要锁定当前未编辑的组件及其子组件，请在Navigator 中选择 。锁定的组件不能在任何Qt Quick Designer 视图中处理。当您想再次编辑这些组件时，请解除锁定。

您不能在2D 中选择锁定的组件，也不能在Properties 中访问它们的属性。

如果您试图移除改变锁定组件属性的状态，系统会提示您确认移除。

如果您在关键帧动画中添加了缓和曲线，则可以在Curves 视图中锁定和解锁它们。如果锁定包含缓和曲线的组件，锁定状态将在Navigator 和Curves 之间同步。

排列组件

您可以在Navigator 或Code 视图或Edit 模式中查看组件文件中组件的顺序。文件中组件的顺序也决定了它们在2D 视图中的绘制顺序。默认情况下，位于文件顶部的组件会被列在Navigator 树的底部，并在2D 视图中位于重叠组件的后面。要像其他一些工具那样按照组件在文件中出现的顺序列出组件，请选择 。

要将一个组件移到其父级树的顶部或底部，请在Navigator 中右键单击该组件，然后选择Arrange >Bring to Front 或Send to Back 。要将一个组件向上或向下移动，请选择Bring Forward 或Send Backward 。

要颠倒所选组件的顺序，请选择Arrange >Reverse 。

您也可以将组件拖动到树中的另一个位置，或使用 和 按钮在树中移动组件。您可以使用 和 按钮来更改组件的父级。

当您将组件实例拖动到2D 视图时，新组件会被添加为其下方组件的子组件。当您移动组件时，无法确定是要调整其位置还是将其附加到新的父组件上。因此，父组件不会自动更改。

添加属性别名

属性别名是可以在组件外部使用的属性。当你在Code 视图或Edit 模式下查看代码时，属性别名声明看起来与普通的属性定义相似，只是它需要使用别名关键字而不是属性类型，并且属性声明的右侧必须是有效的别名引用：

property alias <name>: <alias reference>

例如，下面的别名指的是项目组件实例中的按钮组件实例：

property alias button: item.button

有效的别名引用：

• 只能指向声明属性别名的组件实例或组件内的属性。
• 不能包含任意 JavaScript 表达式。
• 不能指向与声明属性别名的组件类型不同的组件。
• 必须在首次声明别名时定义。
• 不能指向附加属性。
• 不能指向第三层以下嵌套组件实例的属性。

您可以使用Navigator 中的 (Export) 按钮，将组件导出为具有有效别名引用的属性别名。

然后，您可以在其他组件中使用该属性别名来创建与该组件的连接。

在组件内移动

指定组件的文件 (ui.qml,.qml) 可以包含在不同文件中指定的其他组件的实例。你可以从不同的视图以不同的方式打开指定组件的文件：

• 在2D 或Navigator 视图中，右键单击组件实例，然后在上下文菜单中选择Edit Component 或选择F2。
• 在Properties 中，选择Edit Base Component 。

组件层次结构将以面包屑路径的形式显示，您可以选择组件名称打开相应文件。这样，当您编辑完组件后，就可以轻松地回到顶层。