资源管理器侧边栏

Explorer 以结构化的树格式显示 Designer 中当前页面的内容。它使您可以选择特定页面上的任何组件，包括那些可能难以在画布上选择的组件。在 Explorer 中，您还可以重新排列元素并调整 组件结构.结构上的变化会及时反映在画布上。

通过本教程，您将发现： 

1. 访问、锚定和调整 Explorer 侧边栏大小的方法
2. 通过 Explorer 选择组件的技巧
3. 在 Explorer 中区分独特组件的策略
4. 使用资源管理器重新定位组件的方法

访问、锚定和调整资源管理器侧边栏的大小

Explorer 侧边栏位于侧边工具栏中。您可以通过单击侧面板中的图标或按键盘上的 Z 键来切换 Explorer。如果取消固定，您也可以通过将元素拖到侧面板中的图标上来打开 Explorer。

在小于 1440px 的屏幕上，拖动元素进行重新定位时，资源管理器会在右侧展开（右侧面板上方）。

锚定探索者

在宽度超过 1440px 的浏览器上，您可以选择固定 Explorer 以使其始终可见。这样可以轻松在里面放置元素并快速与元素交互。

要锚定 Explorer，请点击 Explorer 顶部工具栏中的锚定图标。要取消锚定，请选择 Explorer 工具栏中的取消锚定图标。

调整资源管理器大小

固定后，您可以调整资源管理器面板的宽度。

要调整资源管理器的大小，请确保它已固定，然后将鼠标悬停在其右边缘并拖动出现的蓝线。

查看当前页面的元素

资源管理器还可以作为一种手段来可视化您的页面层次结构并识别哪些组件嵌套在其他组件中。

您可以选择展开或折叠父组件。通过展开父组件，其中的子组件将变得可见并缩进。您还可以选择“全部折叠”以仅查看顶级父组件，或“全部展开”以显示页面上的每个元素。

要展开或折叠父组件，请点击“切换“组件左侧的图标▸。

要展开或折叠所有组件，请单击资源管理器工具栏中的展开/折叠图标。

内部提示： 按 Alt/选项 + 是 键盘上的快速展开或折叠全部 探索者 成分。

通过资源管理器选择组件

将鼠标悬停在资源管理器中的不同组件上将突出显示画布上的相应组件。相反，将鼠标悬停在画布元素上将突出显示资源管理器中的元素。

单击资源管理器中的组件以选择它。在资源管理器中选择屏幕外的组件后，画布会自动滚动到该组件。选择组件后，您可以在样式面板中为其设置样式，或在组件设置面板中配置其设置。此外，还可以通过交互面板创建交互。

通过 Explorer 选择组件有利于识别组件的层次结构、父组件和同级组件。这些知识在设计交互时非常有用。

通过画布选择无法访问的组件

在选择难以或无法在画布上选择的组件时，Explorer 尤其有用。这些组件包括 Display 属性设置为 None 的元素或 Z-index 为负的组件。

在 Explorer 中识别独特组件

在资源管理器中，您可能会看到某些组件左侧有彩色图标，而其他组件右侧有图标。这些图标充当唯一指示器。它们有助于快速区分静态和动态组件或自动定位和固定的网格子项。这些图标还可以立即识别触发交互的组件或隐藏在画布上的组件。

资源管理器中的图标传达了有关组件的关键详细信息： 

• 绿色“盒子”图标（左边） — 该组件是一个模块
• 绿色“盒子”图标（正确的） — 该组件是处于编辑模式的打开的模块
• 紫色图标（左边） — 该组件是收集列表，链接到收集字段，或已应用条件
• “哈希”图标 #（正确的） — 该元素是固定在其网格中的单元格或区域的网格子元素
• “斜线”图标（正确的） — 组件的显示设置为隐藏，在画布上不可见
• 闪电图标（右） — 该组件具有交互触发器
• “地球”图标（右） — 该组件已在当前语言环境视图中本地化

使用资源管理器移动组件

组件可以直接在画布上移动，但有时在 Explorer 中移动组件时，可视化结构会很有用。例如，您可以通过在 Explorer 中拖动组件来重新排列同级组件（共享同一父级的组件）。页面的各部分也可以与其中的所有子组件一起移动。

Explorer 简化了更改页面层次结构的操作。在 Canvas 上执行此任务可能具有挑战性，尤其是对于大小相似的嵌套组件。但是，在 Explorer 中，您可以快速抓取子组件并将其放置在其父组件之外。同样，您可以通过单击并将组件拖到另一个元素中来嵌套组件。