波浪效果的实现
package com.loaderman.customviewdemo; import android.animation.ValueAnimator; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.util.AttributeSet; import android.view.View; import android.view.animation.LinearInterpolator; public class AnimWaveView extends View { private Paint mPaint; private Path mPath; private int mItemWaveLength = 1200; private int dx; public AnimWaveView(Context context, AttributeSet attrs) { super(context, attrs); mPath = new Path(); mPaint = new Paint(); mPaint.setColor(Color.GREEN); mPaint.setStyle(Paint.Style.FILL); ValueAnimator animator = ValueAnimator.ofInt(0, mItemWaveLength); animator.setDuration(3000); animator.setRepeatCount(ValueAnimator.INFINITE); animator.setInterpolator(new LinearInterpolator()); animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { public void onAnimationUpdate(ValueAnimator animation) { dx = (Integer) animation.getAnimatedValue(); postInvalidate(); } }); animator.start(); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.drawColor(Color.WHITE); mPath.reset(); int originY = 300; int halfWaveLen = mItemWaveLength / 2; mPath.moveTo(-mItemWaveLength + dx, originY); for (int i = -mItemWaveLength; i <= getWidth() + mItemWaveLength; i += mItemWaveLength) { mPath.rQuadTo(halfWaveLen / 2, -100, halfWaveLen, 0); mPath.rQuadTo(halfWaveLen / 2, 100, halfWaveLen, 0); } mPath.lineTo(getWidth(), getHeight()); mPath.lineTo(0, getHeight()); mPath.close(); canvas.drawPath(mPath, mPaint); } }
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" tools:context=".MainActivity"> <com.loaderman.customviewdemo.AnimWaveView android:layout_width="match_parent" android:layout_height="300dp" /> </LinearLayout>
效果
最后,关注【码上加油站】微信公众号后,有疑惑有问题想加油的小伙伴可以码上加入社群,让我们一起码上加油吧!!!