android 抢购进度条

GIF.gif
需求

需要做抢购,然后需要进度条,如上面的git动态图所示

可以自定义哪些参数

1、可以修改底色
2、可以修改上层颜色
3、可以修改图标
4、可以不放图标

代码展示
     final int total = 1000;
     final int current = 600;
     jinDuProgressBar.post(new Runnable() {
            @Override
            public void run() {
                ValueAnimator valueAnimator =  ValueAnimator.ofFloat(0.0f, 1.0f);
                valueAnimator.setDuration(1000);
                valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                    @Override
                    public void onAnimationUpdate(ValueAnimator animation) {
                        float currFloat = (float) animation.getAnimatedValue();
                        float currentValue = (float) current * currFloat;
                        Log.i(TAG,"currFloat:"+currFloat);
                        jinDuProgressBar.setCurrentProgress(currentValue,total);
                    }
                });
                valueAnimator.start();
            }
        });
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.example.gao.myapplication45.JinDuProgressBar
        android:layout_marginTop="10dp"
        android:layout_marginLeft="20dp"
        app:smlIcon="@drawable/icon_tubiao"
        app:undertoneColor="@color/color_dcdcdcdc"
        app:upperstrataColor="@color/colorAccent"
        android:id="@+id/main_jindu"
        android:layout_width="125dp"
        android:layout_height="10dp"/>

</LinearLayout>
public class JinDuProgressBar extends FrameLayout {
    private String TAG = JinDuProgressBar.class.getSimpleName();
    private Context mContext;
    private int totalWidth, totalHeight;
    private Paint mPaint;
    private int radius;
    private float mCurrentProgress = 0.0f;
    private ImageView imageView;

    private int undertoneColor;//底色
    private int upperstrataColor;//上层色
    private Drawable ivDrawable;

    private int imageWidthHeight = 0;//图片的宽高

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

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

    public JinDuProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mContext = context;
        TypedArray typedArray = mContext.obtainStyledAttributes(attrs, R.styleable.JinDuProgressBar);
        ivDrawable = typedArray.getDrawable(R.styleable.JinDuProgressBar_smlIcon);
        undertoneColor = typedArray.getColor(R.styleable.JinDuProgressBar_undertoneColor, mContext.getResources().getColor(R.color.gray_DCDCDC));
        upperstrataColor = typedArray.getColor(R.styleable.JinDuProgressBar_upperstrataColor, mContext.getResources().getColor(R.color.app_theme_color));
        typedArray.recycle();
        init();
    }

    private void init() {
        setWillNotDraw(false);
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        radius = dip2px(mContext, 50);
        if (imageView != null){
            imageWidthHeight = dip2px(mContext, 10);
            imageView = new ImageView(mContext);
            imageView.setImageDrawable(ivDrawable);
            FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(imageWidthHeight, imageWidthHeight);
            imageView.setLayoutParams(layoutParams);
            this.addView(imageView);
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        totalWidth = getMeasuredWidth();
        totalHeight = getMeasuredHeight();
    }


    //暴露给外面调用 设置当前值 不断调用ondraw方法
    public synchronized void setCurrentProgress(float currentNum, float totalSum) {
        float value = currentNum * (float) totalWidth / totalSum;
        this.mCurrentProgress = value;
        if (imageView!=null){
            float tranx = mCurrentProgress - (float) (imageWidthHeight);
            if (tranx <= 0) {
                imageView.setTranslationX(0);
            } else {
                imageView.setTranslationX(tranx);
            }
        }
        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        //绘画底部的底色
        mPaint.setColor(undertoneColor);
        RectF bottomRectF = new RectF(0, 0, totalWidth, totalHeight);
        canvas.drawRoundRect(bottomRectF, radius, radius, mPaint);
        //绘制红色部分
        mPaint.setColor(upperstrataColor);
        if (imageView!=null){//处理图片逻辑
            float tranx = mCurrentProgress - (float) (imageWidthHeight);
            if (tranx > 0){//解决从很扁的矩形慢慢变圆柱长方形的问题
                RectF rectF = new RectF(0, 0, mCurrentProgress, totalHeight);
                canvas.drawRoundRect(rectF, radius, radius, mPaint);
            }
        }else {
            RectF rectF = new RectF(0, 0, mCurrentProgress, totalHeight);
            canvas.drawRoundRect(rectF, radius, radius, mPaint);
        }
    }

    /**
     * 根据手机的分辨率从 dp 的单位 转成为 px(像素)
     */
    private int dip2px(Context context, float dpValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        return (int) (dpValue * scale + 0.5f);
    }
}

github

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。