Android 条形进度条

可设置 线性渐变-背景色-进度条颜色-进度条高度
效果图

普通效果
渐变效果
改变高度效果

步骤一：新建自定义控件BarPercentView继承View（代码可直接复制使用）

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.support.annotation.Keep;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;

/**
 * 条形进度条（可设置 线性渐变-背景色-进度条颜色-进度条高度）
 * Created by ZWQ .
 */
public class BarPercentView extends View {

    public static final float MAX = 100f;
    private RectF rectFBg;
    private RectF rectFProgress;
    private Paint mPaint;
    private int mWidth;
    private int mHeight;
    private float progressPercent;
    private int bgColor, progressColor;
    private int startColor, endColor;
    private LinearGradient gradient;
    private boolean isGradient;

    public BarPercentView(Context context) {
        super(context);
        init();
    }

    public BarPercentView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        //获取自定义属性
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.BarPercentView);
        bgColor = typedArray.getColor(R.styleable.BarPercentView_barBgColor, getResources().getColor(R.color.gray_cfcfcf));
        progressColor = typedArray.getColor(R.styleable.BarPercentView_barProgressColor, getResources().getColor(R.color.orange_ffc032));
        mHeight = typedArray.getDimensionPixelSize(R.styleable.BarPercentView_barHeight, context.getResources().getDimensionPixelSize(R.dimen._10dp));
        isGradient = typedArray.getBoolean(R.styleable.BarPercentView_barIsGradient, false);
        startColor = typedArray.getColor(R.styleable.BarPercentView_barStartColor, getResources().getColor(R.color.black_3A3D4E));
        endColor = typedArray.getColor(R.styleable.BarPercentView_barEndColor, getResources().getColor(R.color.black_475B80));
        init();
    }

    public BarPercentView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);
        int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);
        int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);
        if (widthSpecMode == MeasureSpec.EXACTLY || widthSpecMode == MeasureSpec.AT_MOST) {
            mWidth = widthSpecSize;
        } else {
            mWidth = 0;
        }
        if (heightSpecMode == MeasureSpec.EXACTLY || heightSpecMode == MeasureSpec.AT_MOST) {
            mHeight = heightSpecSize;
        } else {
            mHeight = getContext().getResources().getDimensionPixelSize(R.dimen._10dp);
        }
        setMeasuredDimension(mWidth, mHeight);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        gradient = new LinearGradient(0, 0, getWidth(), mHeight, startColor, endColor, Shader.TileMode.CLAMP);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //1、背景
        mPaint.setShader(null);
        mPaint.setColor(bgColor);
        rectFBg.right = mWidth; //宽度
        rectFBg.bottom = mHeight; //高度
        canvas.drawRoundRect(rectFBg, 15, 15, mPaint);
        //2、进度条
        rectFProgress.right = mWidth * progressPercent;
        rectFProgress.bottom = mHeight;
        //3、是否绘制渐变色
        if (isGradient) {
            mPaint.setShader(gradient);//设置线性渐变
        } else {
            mPaint.setColor(progressColor);
        }
        canvas.drawRoundRect(rectFProgress, 15, 15, mPaint);//进度
    }

    @Keep
    public void setPercentage(int percentage) {
        if (percentage / MAX >= 1) {
            this.progressPercent = 1;
        } else {
            this.progressPercent = percentage / MAX;
        }
        invalidate();
    }

    private void init() {
        rectFBg = new RectF(0, 0, 0, mHeight);
        rectFProgress = new RectF(0, 0, 0, mHeight);
        mPaint = new Paint();
        //设置抗锯齿
        mPaint.setAntiAlias(true);
    }

    public void setHeight(int mHeight) {
        this.mHeight = mHeight;
        invalidate();
    }

    public void setBgColor(int bgColor) {
        this.bgColor = bgColor;
    }

    public void setProgressColor(int progressColor) {
        this.progressColor = progressColor;
    }

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

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

    public void setGradient(boolean gradient) {
        isGradient = gradient;
    }
}

步骤二：自定义属性

在styles.xml添加自定义属性

    <declare-styleable name="BarPercentView">
        <!--进度条背景色-->
        <attr name="barBgColor" format="reference" />
        <!--进度条颜色-->
        <attr name="barProgressColor" format="reference" />
        <!--渐变开始颜色-->
        <attr name="barStartColor" format="reference" />
        <!--渐变结束颜色-->
        <attr name="barEndColor" format="reference" />
        <!--是否渐变-->
        <attr name="barIsGradient" format="boolean" />
    </declare-styleable>

步骤三：使用

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <com.yate.jsq.widget.progress.BarPercentView
        android:id="@id/bar_percent_progress"
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:layout_margin="@dimen/_20dp"
        app:barIsGradient="true"
        app:barProgressColor="@color/black_3A3D4E"
        app:circleBgColor="@color/gray_color2" />

</FrameLayout>

1）动画效果

    public static final int ANIMATOR_DURATION = 1000;
    private BarPercentView progressView;

   /**
     * 设置百分比
     * @param max     最大值
     * @param current 占比
     */
    private void setData(int max, int current) {
        int percentage = (int) ((100f * current) / max);
        ObjectAnimator animator = ObjectAnimator.ofInt(progressView, "percentage", 0, percentage);
        animator.setDuration(ANIMATOR_DURATION);
        animator.start();
    }

调用setData（）方法，传入最大值和占比值即可

2）无动画效果

        private BarPercentViewprogressView;

        progressView.setPercentage(50);//传入百分比的值