主题
配置样式
所有图元节点都有公共样式和个性化样式。
公共样式
下面介绍图元节点的公共样式,详解见下表:
分组 | 配置项 | 说明 | 数据格式 | 默认值 | 可选项 |
---|---|---|---|---|---|
控制 | 可见 | 是否可见 | boolean | true | |
控制 | 可选中 | 是否可选中 | boolean | true | |
控制 | 可移动 | 是否可移动 | boolean | true | |
控制 | 可编辑 | 是否可编辑 | boolean | true | |
控制 | 像素精确 | 如果勾选了像素精确,只有点击到图形的可见内容上才能选中。 | boolean | false | |
布局 | 横坐标 | 左上角x值 | number | ||
布局 | 纵坐标 | 左上角y值 | number | ||
布局 | 宽度 | 宽度 | number | 0 | |
布局 | 高度 | 高度 | number | 0 | |
布局 | 旋转角度 | 绕中心旋转角度 | number | 0 | 0-360 |
布局 | 横缩放 | 横向缩放倍数,含左右翻转 | number | 1 | min:0, max:150, step:0.1, |
布局 | 纵缩放 | 纵向缩放倍数,含上下翻转 | number | 1 | min:0, max:150, step:0.1, |
基础 | 名称 | 名称 | string | 组件类型-随机值 | |
基础 | 标签 | 图元标签值 | string | 自动生成 | |
基础 | 图层 | 所属图层 | string | ||
基础 | 灰化 | 是否灰化显示 | boolean | false | |
基础 | 染色 | 渲染为其它颜色 | string | ||
基础 | 透明度 | 透明度 | number | 1 | 0-1 |
基础 | 裁切比例 | 裁切比例 | number | 1 | 0-1 |
基础 | 裁切方向 | 按某个方向裁切 | string | 'top''right''bottom''left' | |
基础 | 拉伸 | 沿着某个方向拉伸的方式 | string | 'fill' | 'uniform' 'centerUniform' 'fill' |
文本 | 内容 | 显示在节点上的文本内容 | string | ||
文本 | 字体 | 文本字体 | string | 12px arial, sans-serif | |
文本 | 颜色 | 文本颜色 | string | '#000' | |
文本 | 背景 | 背景颜色 | |||
文本 | 位置 | 文本显示在节点上的位置 | number | 31 | 1-55 |
文本 | 横偏移 | 横偏移 | number | 1 | min: -100, max:100, step:1, |
文本 | 纵偏移 | 纵偏移 | number | 1 | min: -100, max:100, step:1, |
阴影 | 横偏移 | 横偏移 | number | 1 | min: -100, max:100, step:1, |
阴影 | 纵偏移 | 纵偏移 | number | 1 | min: -100, max:100, step:1, |
阴影 | 模糊 | 模糊 | number | 6 | min: -100, max:100, step:1, |
阴影 | 颜色 | 阴影颜色 | number | '#FFFFFF' |
图形节点样式
图形节点的专用样式,详解见下表:
分组 | 配置项 | 说明 | 数据格式 | 默认值 | 可选项 |
---|---|---|---|---|---|
图形(背景) | 背景颜色 | 背景颜色 | string | '#D8D8D8' | |
图形(背景) | 渐进色 | 渐变颜色 | string | '#FFFFFF' | |
图形(背景) | 渐变类型 | 渐变类型 | string | "" | 'linear.east' 'linear.south' 'linear.northeast' 'linear.southeast' |
图形(背景) | 背景图片 | 形状类、图片组件的背景图片 | string | ||
图形(边框) | 半径 | 圆角半径 | number | mixed/同一值 | |
图形(边框) | 半径左上 | 左上圆角半径 | number | ||
图形(边框) | 半径右上 | 右上圆角半径 | number | ||
图形(边框) | 半径右下 | 右下圆角半径 | number | ||
图形(边框) | 半径左下 | 左下圆角半径 | number | ||
图形(边框) | 宽度 | 宽度 | number | 1 | |
图形(边框) | 颜色 | 颜色 | string | '#979797' | |
图形(边框) | 样式 | 边框线的样式 | number | 'line' | |
图形(边框) | 线交汇 | 线交汇处样式 | string | 'round' | 'round' 'bevel' 'miter' |
图形(边框) | 线帽 | 线帽 | number | 'round' | 'butt' 'round' 'square' |
图形(边框) | 立体 | 立体效果 | boolean | false | |
图形(边框) | 立体颜色 | string | '#FFFFFF' | ||
图形(虚线) | 样式 | 虚拟样式 | number[] | ||
图形(虚线) | 虚线 | 是否显示为虚拟 | boolean | false | |
图形(虚线) | 颜色 | 颜色 | string | '#2C3E50' | |
图形(虚线) | 宽度 | 宽度 | number | 1 | |
图形(虚线) | 立体 | 立体效果 | boolean | false | |
图形(虚线) | 立体颜色 | string | '#FFFFFF' |