鸿蒙OpenHarmony【circle】svg组件
摘要:SVG圆形组件(circle)支持设置圆心坐标(cx,cy)和半径(r)属性,其中坐标和半径值支持动画效果。该组件包含通用SVG属性和特定属性(id,cx,cy,r),可通过示例代码创建带边框和填充色的圆形,并展示不同样式效果(如实心圆、虚线边框圆等),最终呈现两个风格各异的圆形图形。组件还支持animate相关子组件实现动画效果。
·
圆形形状。
权限列表
无
子组件
支持[animate]、[animateMotion]、[animateTransform]。
属性
支持Svg组件[通用属性]和以下属性。
| 名称 | 类型 | 默认值 | 必填 | 描述 |
|---|---|---|---|---|
| id | string | - | 否 | 组件的唯一标识。 |
| cx | 0 | 否 | ||
| cy | 0 | 否 | ||
| r | 0 | 否 |
示例
<!-- xxx.hml -->
<div class="container">
<svg fill="white" width="400" height="400">
<circle cx="60" cy="200" r="50" stroke-width="4" fill="red" stroke="blue"></circle>
<circle cx="180" cy="200" r="50" stroke-width="10" stroke="red" stroke-dasharray="10 5" stroke-dashoffset="3"></circle>
</svg>
</div>

更多推荐
所有评论(0)