微信小程序中如何详细实现自定义波浪效果组件？

本文共计872个文字，预计阅读时间需要4分钟。

最近发现不少APP上都有波浪背景，有动态的，有静态的，这里在小程序中用到了动态效果。先看看效果图：这里的文本是组件内部定义的。这是用两个svg图片用css关键帧动画制作的效果。

最近看到好多app上有波浪背景，有动态的，有静态的，这里是在小程序中用得动态。

先看看效果图：里面的文本是组件内部定义的。

这是用两个svg的图片用css关键帧动画做的效果（这里谢谢子弹短信里前端群的小伙伴提供的web版的css动画文件）

在小程序中使用，注意一个问题：就是svg不可以直接使用，需要转为base64（这个大家应该有收藏吧），这里我已经转换好了，在下面的wxss中。

这里顺便用一下自定义组件：

首先定义组件 wave

wave.wxml：这里我默认是用得显示个人信息。