kwgt 形状元素 Shape 矩形圆形弧三角六边形
有哪些形状
顶栏 → + → Shape → 选择具体形状:
| 形状 | 用途 |
|---|---|
| 矩形 Rect | 卡片背景、进度条、边框 |
| 椭圆 Oval | 圆形图标背景、环形时钟底 |
| 弧 Arc | 进度环、时钟刻度环 |
| 三角 Triangle | 装饰、指示箭头 |
| 六边形 Exagon | 蜂窝布局、科技感风格 |
| 圆环 Ring | 空心圆,用于包围其他元素 |
| 不规则多边形 Polygon | 自定义顶点数量,做菱形、五角星等 |
Shape 属性
选中形状后切到 Shape 标签:
- 边距 / 圆角:矩形的圆角半径 → 改大了就变成胶囊形状
- 弧的范围:0° ~ 360°,可以从 90° 开始画一个 270° 的进度环
- 圆环宽度:内圆半径 vs 外圆半径的差值
进阶:用形状做进度条
弧形状是 kwgt 里最常用的元素之一——配合函数可以做任意进度条:
- 电池进度环:弧的范围 =
$bi(level)$ * 3.6(电池 80% 就是 288°) - 步数进度:弧的范围 =
$if(step(30000), 360, step * 360 / 30000)$ - 时间进度:一天过了多少 → 24 小时在 360° 上占多少
形状 vs 图像
形状元素的优势是可以参与函数运算:颜色、大小、弧度都可以动态改变。图像元素只是静态图片。
建议:
- 需要动态颜色 / 动态大小 → 用 Shape
- 需要复杂位图 → 用 Image
- 需要矢量但固定 → 可以用 SVG Image