样式与外观

右侧面板中的 Design 标签页用于控制各元素的视觉外观。可用属性因元素类型而异，但大多数元素共享一些通用样式选项。

有关大小、间距和定位，请参阅布局与定位。

可见性

Visibility 开关用于控制该元素是否显示在屏幕上。

Show（默认）：屏幕打开时元素可见。
Conditional：仅在满足特定条件时元素才可见。详见条件可见性。
Hide：元素保持隐藏，直到Show element 操作将其显示。用于暂时从流程中移除元素而无需删除它。

填充

Screen settings with one solid color layer in the Fill section, and the color picker on the Custom tab

Fill 部分用于设置元素的背景。如需填充整个屏幕，请改为设置屏幕背景。

填充由一个或多个图层组成。每个图层具有以下类型之一：

纯色：使用取色器或输入十六进制色值。调整不透明度可使背景呈半透明效果。
渐变：两个或多个色标。拖动色标可调整过渡效果，使用方向滑块设置角度。若要修改某个色标，在 Stops 下编辑对应行；若要添加色标，点击渐变条或 Stops 旁的。图层行中的滑块可同时调整所有色标的不透明度。
图片或视频：以图片或视频作为背景。

The gradient picker with three stops, the Direction slider, and the Stops list

要管理图层：

要添加图层，点击 Fill 旁边的。
要更改图层类型，点击其色块并选择类型。
要调整图层顺序，拖拽对应行。
要删除图层，点击该行中的。

上层会覆盖下层，因此位于图片上方的半透明层可以为其着色。输入框和日期/时间选择器仅显示最底层。

如需在其他元素中复用某个图层，或为其创建深色版本，请将其保存为颜色样式。如需将图片与其着色层一起复用，请创建一个包含多个图层的样式。

边框

边框默认关闭。点击右侧面板中 Border 旁边的可添加边框。如需移除边框，点击 Border 标题旁边的。

添加边框后，可配置以下选项：

Color：使用颜色选择器或输入十六进制色值。若要使用颜色样式，请从 Styles 标签页中选择。边框会忽略样式中的图片和视频图层。
Width：边框粗细，单位为像素。

Tip

若要为边框添加渐变效果，请将带有渐变图层的颜色样式应用于 Color。

圆角

圆角部分用于控制边框圆角半径。

圆角滑块：为四个角设置统一的圆角半径
单独设置切换 ：启用后可为每个角单独设置不同的圆角半径

效果

点击 Effects 旁边的加号按钮可添加一个或多个视觉效果：

Drop shadow：元素背后的阴影
Inner shadow：元素边界内部的阴影
Layer blur：对元素及其子元素进行模糊处理

你可以为同一个元素叠加多个效果。点击可见性图标可临时禁用某个效果。

动画

Tip

当用户在屏幕之间切换时，流程可以显示过渡动画。

要让某个元素在出现或消失时产生淡入、上升或弹出效果，请在显示元素或隐藏元素动作中选择动画。

Animation settings for a Pulse animation: Type, Scale amount, Duration, Delay between loops, Show after delay, and Easing

点击 Animation 旁边的按钮，为元素添加动画效果。编辑工具默认添加 Pulse 动画，该效果会让元素周期性地缩放，从而吸引用户注意。如需使用其他效果，请在 Type 中选择。

Type dropdown open in the Animation settings, listing None, Pulse, Radial fill waves, Radial outline waves, Glow, Shake, Wiggle, Bounce, and Breathe

动画类型

每种类型都有其自己的设置。时序设置对所有类型都相同。

类型	效果说明	设置项
Pulse	元素放大后缩回原始大小。	Scale amount（%）：元素放大的幅度。
Radial fill waves	元素形状的填充副本从元素背后向外扩散并淡出。	Scale amount（%）：每个波纹相对于元素的扩散比例。 Wave size（px）：每个波纹超出元素边缘的距离。 Wave color：波纹颜色。 Button pulse：每次波纹扩散时同步缩放元素，幅度由 Pulse amount（%）决定。
Radial outline waves	与 Radial fill waves 相同，但每个波纹为描边样式。	同 Radial fill waves。
Glow	元素周围出现柔和光晕并逐渐淡出。	Glow size（px）：光晕在最亮时向外延伸的距离。 Glow color：光晕颜色。
Shake	元素左右移动。	Distance（px）：元素向两侧移动的距离。
Wiggle	元素左右倾斜。	Angle（°）：元素向两侧倾斜的角度。
Bounce	元素向上弹起后落回原位。	Height（px）：元素弹起的高度。
Breathe	元素淡出后恢复显示。	Fade amount（%）：元素在最淡时的透明程度。
Color shift	元素填充色变换为另一种颜色后还原。	Shift color：目标颜色。
Border flash	元素边缘出现描边并淡出。播放期间会替换元素本身的描边。	Flash width（px）：描边在最亮时的宽度，从边缘向内延伸。 Flash color：描边颜色。
Shimmer	一道光带横扫元素填充区域。	Shimmer width（%）：光带宽度占元素的比例。 Shimmer angle（°）：光带扫过的方向，读法与渐变角度相同，90° 表示从左到右。 Shimmer color：光带颜色。

某些动画类型取决于元素的布局或填充方式。当元素不满足相关条件时，编辑工具会在 Animation 设置中显示提示，且该动画不会随流程发布：

Radial fill waves 和 Radial outline waves：元素需设置固定宽高，且不能有外边距。
Color shift：元素需使用纯色填充，或不设置填充。
Shimmer：元素需使用纯色填充。

时序设置

参数	描述
Duration (ms)	单次动画循环的时长
Delay between loops (ms)	重复播放之间的停顿时长
Show after delay (ms)	首次播放前的延迟时长
Easing	动画的加速与减速方式：Linear（匀速）、Ease In（先慢后快）、Ease Out（先快后慢）、Ease In Out（两端慢中间快）、Elastic（超出后回弹）或 Bounce（落地后弹跳几下）。新建的 Pulse 使用预设曲线，显示为 Custom。