在这篇文章中，我们将介绍 Android Studio 3.6 中 Design Editor (设计编辑器) 的新功能，与您分享促成这些体验更改的一些细节，并向您展示用它可以来做哪些有趣的新操作。以下文章是由 Layout Editor 团队的软件工程师 Amaury Medeiros 和 UX 设计师 Paris Hsu 撰写的。

介绍 Design Tools 中的 Split View

在 Android Studio 3.6 中，我们对设计文件的编辑模式进行了一些改动，相较于之前在左下角切换 Text 或 Design 的编辑模式 (图 1)，我们将其整合为一个统一的设计编辑器，它拥有三种编辑模式选项 (图 2)，请继续阅读本文以了解我们所做的更改。

通过点击编辑器右上角的相应按钮或者使用快捷键 (如果使用的是 Mac，则快捷键为 Ctrl + Shift + Left/Right 方向键，如果是其他系统，则为 Alt + Shift + Left/Right 方向键) 来选择以下模式:

• Code: 提供 XML 文件编辑器的功能；
• Design: 由包含设计编辑器 (比如导航栏、布局栏) 的视图组成，可以使用它来以所见即所得的方式编辑文件；
• Split: 同时显示 Code 和 Design，这样您就可以在编辑文本的同时进行效果图的预览。

之前版本的用户可能会发现，新的 Split view 的使用体验与一边打开预览窗口、一边编辑 XML 文件的体验类似。但是，我们会在之后介绍一下它们的区别。

保存每个文件的状态

上面提到过: Split 视图会一边展示 Code 视图、另一边展示对应的 Design 视图。如果您先使用 Split 视图对一个资源文件进行预览，然后切换到 Design 模式，使用所见即所得的方式编辑资源文件，我们则会保留 Design Editor (设计编辑器) 的状态，如缩放级别和已选择条目等。

我们也了解到，并行编辑多个资源文件是一种常见的情况，每个文件都会有不同的编辑需求，比如您可能需要以 Design 模式编辑其中一个文件，然后以 Split 模式编辑另一个文件，再以 Code 模式编辑第三个文件。现在编辑器会保存每个文件的编辑状态，所以您可以不用担心丢失预览状态，而自由地在文件之间进行切换。

在之前的版本中，每次文件的切换都会重置 Preview 的窗口状态。试想一下，如果您在 Text 模式下编辑文件 A，进而在 Preview 窗口下进行了缩放操作。然后以 Design 模式切换到了 B 文件，当再次切换回文件 A 的时候，Preview 窗口的状态就会被重置到跟文件 B 一样，如图 4 所示:

移除了 Preview 工具窗口 (tool window)

现在您可以使用新增加的 "Split 视图" 来预览资源文件，所以就不再需要 (在 Text 模式下的) Preview 工具窗口了。之前每次使用 Text 模式打开资源文件时，我们都会显示这个面板。如果将编辑器切换到了 Design 模式或者打开了非资源文件，我们将会隐藏这个工具窗口 (图 5)。由于 Android Studio / IntelliJ 中没有类似功能的工具窗口，所以这种功能可能会让用户感到困惑。