Android语音输入的波浪效果 – WaveView

文章目录 [ 隐藏 ]

效果展示

源码地址

https://github.com/dy60420667/WaveView

实现思路

  • 绘制正弦波形
  • 水平移动波形,即可得到破浪效果。

正弦波形的绘制

首先一个长宽恰等于WaveView的Bitmap:Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888)。

在Bitmap中使用默认的属性绘制出初始波形。初始波形的属性:Wate Level(水位)为WaveView高度的1/2;Amplitude(振幅)为WaveView高度的1/20;Wave Length(波长)等于WaveView的宽度。

代码第 9 ~ 27 行进行初始波形的绘制。波形由我们传入的ArrayList所控制,不需要重复计算。

最后把这个Bitmap设置成为Paint的Shader。设置Shader相当于设定画笔的形状,使用设置了Shader的Paint绘制图形时,实际上是在使用Bitmap填充绘制的区域。X轴的填充方式为TileMode.REPEAT,即重复填充;Y轴的填充方式为TileMode.CLAMP,即使用边缘的色值延伸填充。

调整Bitmap的大小并填充到WaveView

有了初始波形,当WaveView的属性改变时,只需要对初始波形进行相应的拉伸/压缩和位移就可以得到用户想要的波形。

代码 3 ~ 6 行对Shader进行拉伸/压缩,10 ~ 12 行对Shader进行水平/竖直平移。

代码 17 ~ 19 行用Shader填充成想要的形状。

平移动画

未经允许不得转载:Python在线学习 » Android语音输入的波浪效果 – WaveView

赞 (1)

来吐槽吧 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址