千呼万唤始出来，先上GIF看效果啦。
这边网络问题MarkDown进不去所以老的编辑模式大家凑合着看，博主顶着4G在更新博客希望大家支持。
加入有一天你们boss说，诶小明（一个程序猿）啊，今天我们这个文件下载要用一个新的进度条，美工已经设计好了，美工是在大海边长大的，所以设计了一个像海浪一样的进度条，那么小明你应该如何实现它呢。
想想原生控件，肯定是没有了。那么我们只好拿起我们的工匠精神去自定义view了！
于是乎那就先实现波浪再实现动态改变波浪高度吧。
首先需要一个动画值发生器
ValueAnimator animator = ValueAnimator.ofInt(0, mWaveLength);animator.setDuration(1000);animator.setRepeatCount(ValueAnimator.INFINITE);animator.setInterpolator(new LinearInterpolator());animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator animation) {mOffset = (int) animation.getAnimatedValue();postInvalidate();}});animator.start();
然后利用path画出这个大大的波浪
mPath.reset();mPath.moveTo(-mWaveLength + mOffset, mCenterY);for (int i = 0; i < mWaveCount; i++) {//50是波纹的大小mPath.quadTo((-mWaveLength * 3 / 4) + (i * mWaveLength) + mOffset, mCenterY + 50,(-mWaveLength / 2) + (i * mWaveLength) + mOffset, mCenterY);mPath.quadTo((-mWaveLength / 4) + (i * mWaveLength) + mOffset, mCenterY - 50, i * mWaveLength + mOffset, mCenterY);}mPath.lineTo(mscreenWidth, mscreenHeight);mPath.lineTo(0, mscreenHeight);mPath.close();canvas.drawPath(mPath, mPaint);
好了大波浪已经有了。那么如何动态改变它的高度也就简单了。
public void setProgress(int a) {this.c = 100 - a;if (c < 0) c = 0;if (c > 100) c = 100;textc = a;mCenterY = (mscreenHeight / 100)*c;}
自定义progress的几个属性颜色大小之类。
<resources><declare-styleable name="WavaBezierProgress"><attr name="progressColor" format="color"></attr><attr name="progressTextColor" format="color"></attr><attr name="progressTextSize" format="dimension"></attr><attr name="progressTextLocation" format="dimension"></attr></declare-styleable>
然后再Main里面调用，这里主页面比较简单就不细说了。
private WavaBezierProgress mWavaBezierProgress;private int value = 10;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mWavaBezierProgress = (WavaBezierProgress) findViewById(R.id.wavaBezierProgress);mWavaBezierProgress.setProgress(value);}public void jia(View v) {value += 10;mWavaBezierProgress.setProgress(value);}public void jian(View v) {value -= 10;mWavaBezierProgress.setProgress(value);}public void man(View v) {value = 100;mWavaBezierProgress.setProgress(value);}
效果还是蛮简单的，相信大家阅读后对自定义view也不会太陌生了
博主原创未经允许不许转载。
欢迎加安卓开发交流群：308372687（博主尽可能帮助大家欢迎讨论交流）
下载地址
/AndroidMsky/WaveBezierProgress
参考文献
/eclipsexys/article/details/51956908
