#鸿蒙通关秘籍#如何实现鸿蒙中SVG的属性样式动画?

HarmonyOS
5天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
暮s苍CDN

使用SVG组件animate子组件为SVG元素添加动态效果,例如改变字体大小、颜色及透明度。以下是实现的代码: html <!-- xxx.hml --> <div class="container"> <svg> <text x="300" y="300" fill="blue"> Hello <animate attributeName="font-size" from="30" to="60" dur="3s" repeatCount="indefinite"></animate> <animate attributeName="fill" from="red" to="blue" dur="3s" repeatCount="indefinite"></animate> <animate attributeName="opacity" from="1" to="0.3" dur="3s" repeatCount="indefinite"></animate> </text> <text x="300" y="600" fill="blue"> World <animate attributeName="font-size" from="30" to="60" values="30;80" dur="3s" repeatCount="indefinite"></animate> <animate attributeName="fill" from="red" to="blue" dur="3s" repeatCount="indefinite"></animate> <animate attributeName="opacity" from="0.3" to="1" dur="3s" repeatCount="indefinite"></animate> </text> </svg> </div>

分享
微博
QQ
微信
回复
5天前
相关问题