注意:以下翻译的准确性尚未经过验证。这是使用 AIP ↗ 从原始英文文本进行的机器翻译。
Workshop的设计允许构建者配置模块的用户界面组织方式。Workshop模块的主要设计组件(标题、页面、部分和覆盖)将在下文中详细描述。可以通过选择设计侧边栏面板并选择要配置的元素,或在主模块视图中选择元素来编辑设计元素。
Workshop模块中的标题用作模块范围的工具栏,用于显示模块标题、标签和按钮。创建新模块时,模块标题将显示在屏幕顶部:
选择标题时,点击加号(+)可以将微件如标签和按钮组添加到标题中,使它们在Workshop模块的所有页面中都易于访问。如果模块标题被隐藏,可以通过设计侧边栏面板顶部列表中的标题选项选择它。
为模块标题提供的配置选项包括:
配置后,带有自定义图像的水平标题可能如下图所示:
您也可以选择配置一个垂直标题,它将在模块的左侧显示。一旦启用垂直方向,您将可以进行额外的设置以进行自定义:
启用折叠标题时,按钮组和标签微件将具有折叠状态,仅显示图标;在此状态下文本将被省略。所有其他微件将在模块标题折叠时隐藏。
下面的示例显示了配置的垂直模块标题:
及其折叠状态:
页面允许模块构建者在Workshop中构建复杂的多屏应用程序。每个页面都是一个空白画布,模块构建者可以在其上配置一组独特的微件以支持目标工作流。只有模块标题将在页面之间保持不变,以提供给定模块的整体工具栏。
在上面显示的示例模块标题中,标签微件中的每个标签都可以配置为选择一个页面,每个页面配置有不同的用户工作流。
可以从屏幕左侧的设计面板中添加页面。要添加页面,请打开设计面板,然后选择顶部的加号(+)。接下来,选择新页面选项,如下所示:
添加后,新页面将在设计面板中自动选择,您可以开始配置其内容。下图展示了初始化时未配置的默认页面,其中在模块范围标题下有两个垂直分割的部分:
您还可以使用页面底部的设计模板选择器探索其他设计模板。您可以通过将鼠标悬停在图标上预览每个设计的外观。如果您希望使用某个模板,可以选择该图标;页面设计将更新为您选择的那个。
在编辑应用程序时,页面按创建顺序列出。编辑视图中看到的页面顺序对模块行为没有影响。
有关如何通过添加和配置部分来向页面添加内容的更多详细信息,请查看下面的部分文档。
为了在模块的页面之间导航用户,构建者可以使用设计事件。这可以从微件中触发,例如按钮组或标签。
部分是每个页面和覆盖的组件,允许模块构建者细分用户界面。每个部分配置为包含一个或多个微件,或一个设计,该设计本身可能包含一个或多个部分。
要访问部分的可用设计选项,请在模块中的任何空部分上选择设置设计并查看设计选项,如下所示:
当前支持的设计选项包括:
剪切、复制和粘贴选项可用于模块中的整个部分和单个微件,为更快的模块构建体验提供工具。
粘贴部分或微件时,构建者有两种选择来管理新部分或微件的输入变量:
当某些部分仅在工作流程中上下文相关时才应出现时,可以使用覆盖。覆盖将作为所选页面之上的一层出现。
与页面类似,您可以从屏幕左侧的设计面板中添加覆盖。要添加覆盖,请选择顶部的加号(+)。接下来,选择新覆盖选项,如下所示:
目前,Workshop支持两种覆盖类型:抽屉式导航和模态框。下面详细解释了这些类型。
抽屉式导航是从屏幕侧面滑出的覆盖。可用的配置选项包括:
模态框是出现在屏幕中央的覆盖。大小是特定于模态框覆盖的唯一可用配置选项。
Workshop提供对各种样式格式设置的控制,以便应用构建者可以更灵活地定制其模块的设计和感觉。配置选项包括标题格式、背景颜色、边框样式等。这些选项在页面、部分和微件级别可用。
当在部分上启用标题时,可以添加标题格式选项。有三种可用格式:
可以为页面、部分和微件添加背景颜色,以帮助视觉上分割模块的各个部分。有五种可用的色调,适用于亮模式和暗模式,以及透明选项。
可以在部分和微件上配置边框样式,使模块内看起来具有不同的提升级别。有四个可用选项:
可以为页面和部分配置填充,以在所有子组件周围设置一致的填充量或空间。填充在组件之间增加空间,以提供模块的分离和透气性。有五个可用选项:
内部部分样式: 可选选择一种预定义的部分样式应用于所有子部分: