【功能说明文档】AI 布局

你是否有过以下经历：

• 当想要尝试多种间距方案时，需要依次移动每个相关图层的位置。
• 当要在页面中增加一个新的二级页入口，需要把「新增位置」以下的内容依次移动。

AI 布局是一个可以对设计内容进行「结构化调整」的工具。帮助你从此拜托琐碎冗杂的操作。

下面的内容将向你介绍如何使用 AI 布局。

开启 AI 布局

AI 布局是 Motiff 妙多提供的一种「一键进入结构化」的模式，你可以在「结构化」、「自由式」之间灵活切换，完成你想要的操作。

选中「移动端界面」的图层后，有三种方法可以进入 AI 布局：

• 点击工具栏中的 。
• 鼠标右键，选择「进入 AI 布局」。
• 使用快捷键：Shift + M 。

生效范围

选中图层开启「AI 布局」后，会对这个图层所在界面进行结构化处理。如下图，选中页面中的部分图层开启 AI 布局后，AI 布局对整个界面生效。

图层面板

开启 AI 布局后，图层面板左侧会出现一条动态的彩色直线，代表 AI 布局生效的范围。

AI 会根据图层的结构化关系，创建出新的容器或组，对图层进行结构化布局。

除了创建容器和组之外，AI 还会对已有的容器或组添加自动布局属性。

你可以在图层面板中通过缩略图找到 AI 影响的图层：

• ：AI 添加了自动布局属性的容器。
• ：AI 创建的容器。
• ：AI 创建的组。

AI 布局好用的场景

有哪些好用的「结构化」场景呢？

快速调节间距

当你需要调整间距时，很多时候逐个调整是比较繁琐的，来看看 AI 布局能为你做什么。

快速复制

你一定遇到过这个场景：

在页面中间复制新的内容时，需要调整被它影响的内容。

AI 布局可以让你快速复制内容，不在需要手动调整素有相关图层的位置。

调整顺序

你一定遇到过这种场景：

想要快速调整图层顺序，需要逐个移动修改顺序的图层。

AI 布局可以快速图层间的顺序，再也不需要「机械地移出换位置再放回」。

修改文字

当你想看一个多行的效果，或者想让一个文本旁的内容跟随文本变化，你也可以使用 AI 布局功能。

退出 AI 布局

当你完成「结构化」调整之后，你可以快速回到「自由式」设计，AI 创建的容器和组会自动解除，回到你原本设置的组和容器结构。

直接退出

直接退出 AI 布局，Motiff 妙多会将设计界面变回原本状态，同时 AI 临时创建的容器和组都会被解除。

你可以有三种方式直接退出 AI 布局模式：

• 点击工具栏中的 。
• 鼠标右键，选择「退出 AI 布局」。
• 使用快捷键：Shift + M

退出并保存 AI 布局

退出并保存 AI 布局，Motiff 妙多会保留 AI 布局的结果，后续你可以继续使用这些布局过的内容。

你有两种方式可以退出并保存 AI 布局：

• 点击工具栏中的 旁的 ，选择「退出并保存 AI 布局」。

• 使用快捷键：

  • macOS：⌥ Option + ⇧Shift + M
  • Windows：Alt + Shift + M

一些小技巧

• 如果你只保留其中的一部分图层，你可以在 AI 布局时将它单独复制出来。
• 如果你是自动布局的熟练用户，AI 布局可以帮助你：
  • 智能创建自动布局，你可以适当的修改内容以符合你的要求。
  • 在修改一开始不会设置自动布局的图层时，更快地完成结构化的操作。比如如下例子。