发表于： 2017-04-07 21:33:19
5 1143
今天完成的事情：
上午有事请假了，下午就写了一个进度条动画。
1.开发根据倒计时显示相应圆形进度条的动画，这里的思路是在原本的圆框上盖上俩个半圆，根据音频时长和播放速度计算转动角度，然后半圆根据角度转动，把还没播放出来的圆圈遮住，以此达到进度条动画的效果。
半圆的写法：如果用canvas来写，半圆底部会带一条横线，是一个封闭的半圆。
这里只需要用以下属性，写出一个圆，用以下属性决定要遮住的部分，支持所有单位
clip: rect(上 右 下 左);
转动还是通过transform：rotate属性实现。
遇到的困难：
1.根据音频时长计算角度，这里，因为音频时长并不是整数，所以这个角度并不能除尽，最后会出现进度条转不完的情况……
2.还剩一个分享的功能没写，这里是指扫了二维码后先直接跳转微信朋友圈分享，分享之后点链接才能访问到宣传页？那这边angular的页面在本地怎么生成二维码呢，这是要用angular的插件库在代码里生成吗
如果是这样感觉又要延期了orz
明天计划的事情：开发分享功能
收获：clip：rect（）属性；
返回列表
评论