设计二维用户界面

要在2D 视图中设计应用程序，请打开组件文件并将2D 组件和资产实例放入其中。

在2D 视图中选择组件实例时，其边缘和角落会出现标记。根据光标的形状，您可以通过拖动对组件实例执行以下操作：

• 移动
• 调整大小
• 旋转

移动组件

显示移动光标时，您可以将选定的组件实例移动到2D 视图中的任意位置。

有关在用户界面中定位组件实例的其他方法的更多信息，请参阅使布局可扩展。

调整组件大小

当显示调整大小光标时，可以拖动标记来调整组件实例的大小。

要从所选组件实例的中心而非边缘开始调整大小，请选择Alt（或 macOS 上的Opt）。

要在使用边角标记调整大小时保留图像宽高比，请选择Shift。这也适用于使用左、右、上或下锚点锚定的组件实例。

要从组件实例的中心调整大小并保留纵横比，请选择Alt+Shift（或 macOS 上的Opt+Shift）。

有关在用户界面中指定组件或组件实例大小的其他方法的更多信息，请参阅设置 2D 几何图形。

旋转组件

当旋转光标 显示在组件实例的某个角上时，您可以顺时针或逆时针拖动，围绕原点自由旋转组件实例。

此外，选择Shift或Alt（或 macOS 上的Opt）可分别以 5 或 45 度为单位旋转组件实例。

您可以在Properties >Geometry - 2D >Origin 中设置原点。在那里，你还可以输入Rotation 属性的值，单位为度。

放大和缩小

您可以使用工具栏上的缩放按钮放大或缩小2D 视图，也可以从列表中按百分比选择缩放级别。更多按钮可用于缩放视图中的所有内容或缩放当前选定的组件实例。

捕捉到父组件和同级组件

您可以在2D 视图中使用捕捉来对齐组件实例。打开捕捉后，所有组件实例都会捕捉到它们的父组件和同级组件。如果使用带有锚点的捕捉，则会在将一个组件捕捉到另一个组件时创建锚点。

要打开捕捉，请在2D 视图中单击右键，然后选择Snapping >Snap with Anchors 或Snap without Anchors 。

套接线会自动出现，以帮助您定位组件实例。

选择Edit >Preferences >。 Qt Quick> Qt Quick Designer来指定捕捉设置。在Parent component padding 字段中，以像素为单位指定父对象与捕捉线之间的距离。在Sibling component spacing 字段中，以像素为单位指定同级元件与套接线之间的距离。

下图显示了Parent component padding 设置为 8 像素时的折叠线 (1)。

有关使用Properties 视图对齐和分布组件实例的其他方法，请参阅对齐和分布组件。

隐藏组件边界

2D 视图会显示组件实例的边界。要隐藏它们，请右键单击2D 视图，然后从上下文菜单中选择Show Bounds 。

预览组件尺寸

UI 文件中根组件的宽度和高度决定了组件的大小。您可以在其他用户界面文件中重复使用不同尺寸的组件（如按钮），并设计用户界面以用于不同的设备配置文件、屏幕分辨率或屏幕方向。如果组件的最终尺寸是由属性绑定决定的，那么组件尺寸也可能为零（0,0）。

要尝试不同的组件尺寸，请在工具栏上的Override Width 和Override Height 字段 (1) 中输入数值。更改会显示在2D 视图 (2) 和States 视图 (3) 中，但 UI 文件中的属性值不会永久更改。您可以在Properties 视图 (4) 中永久更改属性值。

要设置根组件的初始大小，请选择Edit >Preferences > >。 Qt Quick> Qt Quick Designer并在Root Component Init Size 组中指定组件的宽度和高度。

指定画布大小

要更改画布大小，请选择Edit >Preferences > >。 Qt Quick> Qt Quick Designer并在Canvas 组中指定画布宽度和高度。

设置画布颜色

如果将根组件的背景设置为透明，工作区域的颜色会使您难以看到正在工作的组件实例。为使组件实例更清晰可见，您可以在 列表中选择画布颜色。默认情况下，颜色是透明的。设置画布颜色不会以任何方式影响根组件或组件实例的背景颜色。

刷新 2D 视图内容

打开 UI 文件时，文件中定义的组件及其包含的组件实例将绘制在2D 视图中。当您在Properties 中编辑组件实例属性时，代码及其在2D 视图中的表示可能会不同步。例如，当您更改组件实例在一列或一行中的位置时，新位置可能无法在2D 视图中正确显示。

要刷新2D 视图的内容，请选择R键或 (Reset View) 按钮。