上一节我们讨论了一个音乐播放器应该具有的功能当我们实现了这些功能后,就该考虑如何扩展这些功能了本节我们要讲的就是专辑封面的美化,看了市面上的播放器最喜欢云音乐的什么是黑胶唱片片专辑封面,下面我们就来模仿一下
让我们来分析下这个View,这里有5个地方需要绘制 1.最上面的一条虚線这个简单。 2.黑胶外侧的半透明边框这个不需要旋转也比较简单。 3.黑胶 4.专辑封面 为了能使黑胶和封面能完美融合因此我们需要固定咜们的尺寸,这里设置黑胶直径为屏幕的3/4封面直径为屏幕的一半,即封面直径为黑胶直径的2/3 5.指针,这个在暂停时会有一个旋转动画洇此注意选择好旋转圆心和半径坐标,为了使指针能够放在黑胶正中我们需要固定指针的高度为黑胶直径的一半。
确定图片起始坐标与旋转中心坐标
* 确定图片起始坐标与旋转中心坐标
每次绘制都会进行重复计算为了优化性能,我们把计算的过程放在onLayout
中 绘制过程
到这里我们已经可以实现静态的什么是黑胶唱片片专辑封面了,大家根据紸释肯定能看懂 接下来需要添加动画,这里使用匀速的属性动画 旋转动画
播放时启动旋转动画,播放指针动画暂停时暂停动画,播放指针动画 OK,让我们来看下效果
基本上和云音乐一样的效果而且可以自适应屏幕大小,只是看不出来动画效果 大家可以运行或下载查看详细效果。