【Android 】渐变色的波纹效果，可添加多条波纹

/**
 * 波纹相关属性
 * Created by huomengyuan on 2017/12/29.
 */
public class WaveBean {
    private int level;//水平线
    private int waveHeight;//最高峰--最低谷的大小
    private int speed;//速度
    private float angle;//开始角度
    private int startColor;//渐变色
    private int endColor;//渐变色

    public WaveBean() {
    }

    public WaveBean(int level, int waveHeight, int speed, float angle, int startColor, int endColor) {
        this.level = level;
        this.waveHeight = waveHeight;
        this.speed = speed;
        this.angle = angle;
        this.startColor = startColor;
        this.endColor = endColor;
    }

    public int getLevel() {
        return level;
    }

    public void setLevel(int level) {
        this.level = level;
    }

    public int getWaveHeight() {
        return waveHeight;
    }

    public void setWaveHeight(int waveHeight) {
        this.waveHeight = waveHeight;
    }

    public int getSpeed() {
        return speed;
    }

    public void setSpeed(int speed) {
        this.speed = speed;
    }

    public int getStartColor() {
        return startColor;
    }

    public void setStartColor(int startColor) {
        this.startColor = startColor;
    }

    public int getEndColor() {
        return endColor;
    }

    public void setEndColor(int endColor) {
        this.endColor = endColor;
    }

    public float getAngle() {
        return angle;
    }

    public void setAngle(float angle) {
        this.angle = angle;
    }
}

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.view.View;

import java.util.ArrayList;
import java.util.List;

/**
 * 自定义view
 * Created by huomengyuan}on 2017/12/28.
 */
public class WaveView extends View {
    private int mHeight;
    private int mWidth;

    private Paint mPaint;

    private int i = 0;

    public WaveView(Context context) {
        this(context, null);
    }

    public WaveView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public WaveView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView(context, attrs);
    }

    private void initView(Context context, AttributeSet attrs) {
        mPaint = new Paint();
        mPaint.setStyle(Paint.Style.FILL);
        mPaint.setAntiAlias(true);

        waveBeanList.add( new WaveBean(26, 38, 32, (float) Math.PI / 3, Color.parseColor("#ff0000"), Color.parseColor("#0000ff")));
        waveBeanList.add(new WaveBean(34, 72, 48, (float) Math.PI / 3, Color.parseColor("#00ff00"), Color.parseColor("#f0000f")));
        waveBeanList.add(new WaveBean(30, 60, 24, (float) Math.PI / 3, Color.parseColor("#0f0f0f"), Color.parseColor("#f0f0f0")));
    }

    private List waveBeanList = new ArrayList<>();

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        mWidth = w;
        mHeight = h;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        List pathList = new ArrayList<>();
        for (WaveBean waveBean : waveBeanList) {
            pathList.add(getWavePath(waveBean));
        }

        postDelayed(new Runnable() {

            @Override
            public void run() {
                i = 0;
                for (WaveBean waveBean : waveBeanList) {
                    waveBean.setAngle(waveBean.getAngle() + (float) Math.PI / waveBean.getSpeed());
                }
                postInvalidate();
            }
        }, 17);

        for (int i = 0; i < pathList.size(); i++) {
            drawPath(canvas, waveBeanList.get(i), pathList.get(i));
        }
    }

    private Path getWavePath(WaveBean waveBean) {
        Path path = new Path();
        //计算波纹绘制区间的开始Y坐标：level:使波纹具备一定深度（level - waveHeight/2）
        //开始的X坐标是最左边
        //结束的X,Y坐标在右下角
        float startY = mHeight - waveBean.getLevel() - waveBean.getWaveHeight() / 2;
        for (i = 0; i < mWidth; i += 5) {
            float y = (float) (startY - waveBean.getWaveHeight() * Math.sin(i * (2 * Math.PI / mWidth) + waveBean.getAngle()));

            if (i == 0) {
                //设置path的起点
                path.moveTo(0, y);
            } else {
                //连线
                path.lineTo(i, y);
            }
        }
        //封闭 路径
        path.lineTo(mWidth, mHeight);
        path.lineTo(0, mHeight);
        path.close();

        return path;
    }

    private void drawPath(Canvas canvas, WaveBean waveBean, Path path) {
        //计算渐变色区间的开始Y坐标,即波纹的开始Y坐标
        //开始的X坐标是最左边
        //结束的X,Y坐标在右下角
        float startY = mHeight - waveBean.getLevel() - waveBean.getWaveHeight() / 2;
        mPaint.setShader(new LinearGradient(0, startY, mWidth, mHeight, new int[]{waveBean.getStartColor(), waveBean.getEndColor()}, null, Shader.TileMode.CLAMP));
        mPaint.setAlpha(160);
        canvas.drawPath(path, mPaint);
    }
}