微信小程序 Canvas 动画踩坑——棘手的椭圆

最近正在给我的微信小程序开发一个天气预报的页面,页面的效果如下:

最终效果

计划页面有两个 canvas,一个用来实时绘制上半部分的天气动画,一个用来绘制中间的气温趋势折线图。

上半部分天气动画在不同的天气下有不同的效果,比如不同强度的降雨会有相应的雨滴从上面落下,阴天多云的时候顶部会有云朵在漂浮,多云转晴的话后面再加上个太阳。

降雨的动画不难,无非就是随机生成一些雨滴对象,每一帧实时更新位置即可。

关键在云朵的动画上,我们需要生成随机宽高的椭圆形云朵,并且云朵沿着随机椭圆轨迹运动。

继续阅读微信小程序 Canvas 动画踩坑——棘手的椭圆