渐变色设置

可以对 形状元素 的 填充色、边框色 进行渐变设置。

功能开关

打开

在 形状元素 属性面板中 形状参数 下，选择 颜色类型 为渐变色，点击 渐变色交互框 进入渐变色编辑。

关闭

• 点击 非元素选中区域
• 关闭 渐变色属性面板
• 切换选中元素

功能参数

1. 起始点

表示渐变色渐变起点。

2. 终止点

表示渐变色渐变终点

3. 渐变色色值

表示单个渐变色色值与比例的面板展示，可以用于编辑渐变色色值的比例位置。

4. 渐变色取色器

用于设置单个渐变色色值的 Color 部分

5. 渐变色类型

渐变色类型包括：线性渐变、弧向渐变和径向渐变。

• 线性渐变 - 颜色从起始点向终止点方向线性渐变。

• 弧向渐变 - 以起始点与终止点绘制圆，颜色沿逆时针弧向渐变。

• 径向渐变 - 以起始点为圆心，以终止点为半径中点绘制圆，颜色沿圆心向边缘渐变。

功能交互

移动起始点

自由移动

鼠标移动至起始点位置，选中后【鼠标样式变为移动，同时选中点变大】，可以对起始点进行自由移动拖拽。

同步移动 - 仅支持线性渐变

在编辑线性渐变时，可以按下 Alt/Command 按键，用以同步改变起始点与终止点。其中终止点的变化为起始点变化的逆。

移动终止点

自由移动

鼠标移动至起始点位置，选中后【鼠标样式变为移动，同时选中点变大】，可以对起始点进行自由移动拖拽 【与 移动起始点 交互相同】。

同步移动 - 仅支持线性渐变

在编辑线性渐变时，可以按下 Alt/Command 按键，用以同步改变起始点与终止点。其中终止点的变化为起始点变化的逆【与 移动起始点 交互相同】。

旋转移动 - 不支持线性渐变

在编辑器非线性渐变时，可以在渐变色位置外圈触发旋转移动交互【触发时，鼠标样式变为旋转，同时终止点放大】，可以以起始点为中心，对终止点进行旋转移动。

选中渐变色

移动鼠标至代表渐变色的正方形块位置按下鼠标，可以触发选中渐变色。

移动渐变色

选中渐变色后，可以在渐变色变化范围内移动渐变色。其中弧向渐变色在以起始点为圆心，至终止点距离为半径的圆上移动；线性渐变 与 径向渐变 在起始点与终止点之间移动。

新增渐变色

鼠标在交互范围内未选中渐变色时，会展示当前位置的渐变色比例以及色值。在对应位置按下鼠标，可以基于当前比例值与色值创建渐变色值。

删除渐变色

选中渐变色后，按 Backspace 按键触发渐变色删除