项目中需要使用到的水波纹效果,效果图如下:
代码如下:
/**
* Created by csc on 2018/6/7.
* information:使用贝塞尔曲线(二阶)实现水波纹效果
*/
class WaveView(context: Context) : View(context) {
lateinit var mPaint: Paint
lateinit var mPath: Path
//一条波纹的长度
val mWL = 1000
//波纹的个数
var mWaveCount: Int? = null
//偏移量
var offset: Int? = null
//View的宽度
var mViewWidth: Int? = null
//View的宽度
var mViewHeight: Int? = null
//View高度的一半
var mViewHalfHeight: Int? = null
constructor(context: Context,attrs: AttributeSet): this(context) {
//初始化画笔
initPaint()
//初始化动画
initAnimator()
}
//初始化画笔
private fun initPaint() {
mPath = Path()
mPaint = Paint(Paint.ANTI_ALIAS_FLAG)
mPaint.color = Color.WHITE
mPaint.style = Paint.Style.FILL_AND_STROKE
mPaint.alpha = 60
}
//初始化动画
private fun initAnimator() {
var animator: ValueAnimator = ValueAnimator.ofInt(0, mWL)
animator.setDuration(2000)
animator.repeatCount = ValueAnimator.INFINITE
animator.interpolator = LinearInterpolator()
animator.addUpdateListener(object : ValueAnimator.AnimatorUpdateListener {
override fun onAnimationUpdate(animation: ValueAnimator?) {
offset = animation?.getAnimatedValue() as Int
postInvalidate()
}
})
animator.start()
}
override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
super.onSizeChanged(w, h, oldw, oldh)
mViewWidth = w
mViewHeight = h
//获得波纹的数量
mWaveCount = Math.round(mViewWidth!! / mWL + 1.5).toInt()
//View高度的一半
mViewHalfHeight = mViewHeight!! / 2
}
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
mPath.reset()
mPath.moveTo(-(mWL + offset!!).toFloat(), mViewHalfHeight?.toFloat()!!)
for (i in 0 until mWaveCount!!) {
mPath.quadTo(((-mWL * 3 / 4) + (i * mWL)).toFloat() + offset!!, (mViewHalfHeight!! + 60).toFloat(), ((-mWL / 2) + (i * mWL) + offset!!).toFloat(), mViewHalfHeight!!.toFloat())
mPath.quadTo(((-mWL / 4) + (i * mWL)).toFloat() + offset!!, (mViewHalfHeight!! - 60).toFloat(), (i * mWL + offset!!).toFloat(), mViewHalfHeight!!.toFloat())
}
mPath.lineTo(mViewWidth!!.toFloat(), mViewHeight!!.toFloat())
mPath.lineTo(0.0F, mViewHeight!!.toFloat())
mPath.close()
canvas?.drawPath(mPath, mPaint)
}
}
就这样搞定,是不是很简单.