Android studio实现水平进度条

原文

ProgressBar

用于显示某个耗时操作完成的百分比的组件称为进度条。ProgressBar默认产生圆形进度条。

实现效果图:

MainActivity

java 复制代码
import android.os.Bundle;
import android.view.View;
import android.app.Activity;
import android.widget.Button;
import java.util.Timer;
import java.util.TimerTask;

public class MainActivity extends Activity {

    private RoundedRectProgressBar bar;
    private Button btn;
    private int progress;
    private Timer timer;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        bar = (RoundedRectProgressBar) findViewById(R.id.bar);
        btn = (Button) findViewById(R.id.btn);
        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                reset();
            }
        });

    }

    /**
     * 进度条从头到尾跑一次
     */
    private void reset() {
        progress = 0;
        timer = new Timer();
        //以timer为参数,指定某个时间点执行线程
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                bar.setProgress(progress);//设置当前进度
                progress ++;
                if (progress > 100) {
                    timer.cancel();
                }
            }
        }, 0, 300); 0秒后启动任务,以后每隔0.3秒执行一次线程
    }
}

自定义进度条RoundedRectProgressBar.java:

java 复制代码
import android.annotation.SuppressLint;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;

public class RoundedRectProgressBar extends View {

    private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    private int barColor;
    private int backColor;
    private int textColor;
    private float radius;

    int progress = 0;

    @SuppressLint("NonConstantResourceId")
    public RoundedRectProgressBar(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);

        //获取自定义参数的颜色值
        TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.RoundedRectProgressBar, defStyle, 0);
        int n = a.getIndexCount();
        for (int i = 0; i < n; i++) {
            int attr = a.getIndex(i);
            if (attr == R.styleable.RoundedRectProgressBar_backColor) {
                backColor = a.getColor(attr, Color.GRAY);
            } else if (attr == R.styleable.RoundedRectProgressBar_barColor) {
                barColor = a.getColor(attr, Color.GREEN);
            } else if (attr == R.styleable.RoundedRectProgressBar_textColor) {
                textColor = a.getColor(attr, Color.WHITE);
            }
        }
    }


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

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

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        radius = this.getMeasuredHeight() / 5;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //背景
        mPaint.setColor(backColor);
        mPaint.setStyle(Paint.Style.FILL);
        canvas.drawRoundRect(new RectF(0, 0, this.getMeasuredWidth(), this.getMeasuredHeight()), radius, radius, mPaint);
        //进度条
        mPaint.setColor(barColor);
        mPaint.setStyle(Paint.Style.FILL);
        canvas.drawRoundRect(new RectF(0, 0, this.getMeasuredWidth() * progress / 100f, this.getMeasuredHeight()), radius, radius, mPaint);
        //进度
        mPaint.setColor(textColor);
        mPaint.setTextSize(this.getMeasuredHeight() / 1.2f);
        String text = "" + progress + "%";
        float x = this.getMeasuredWidth() * progress / 100 - mPaint.measureText(text) - 10;
        float y = this.getMeasuredHeight() / 2f - mPaint.getFontMetrics().ascent / 2f - mPaint.getFontMetrics().descent / 2f;
        canvas.drawText(text, x, y, mPaint);
    }

    /*设置进度条进度, 外部调用*/
    public void setProgress(int progress) {
        if (progress > 100) {
            this.progress = 100;
        } else if (progress < 0) {
            this.progress = 0;
        } else {
            this.progress = progress;
        }
        postInvalidate();
    }
}

activity_main.xml

java 复制代码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    tools:context="com.example.progressbarpro.MainActivity">

    <com.example.progressbarpro.RoundedRectProgressBar
        android:id="@+id/bar"
        android:layout_width="match_parent"
        android:layout_height="24dp"
        android:layout_marginTop="100dp"
        app:backColor="#E6E6E6"
        app:barColor="#33CC99"
        app:textColor="#FFFFFF"/>

    <Button
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="reset"
        android:layout_centerInParent="true"/>
</RelativeLayout>

在values/attrs.xml中添加自定义参数, 使三种颜色可以在布局文件中被配置:

attrs.xml

java 复制代码
<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="RoundedRectProgressBar">
        <attr name="backColor" format="color" />
        <attr name="barColor" format="color" />
        <attr name="textColor" format="color" />
    </declare-styleable>

</resources>
相关推荐
f305170942 分钟前
Python实现数据可视化用Matplotlib轻松创建专业级图表
android
2501_915918415 小时前
iOS 26 App 性能测试|性能评测|iOS 26 性能对比:实战策略
android·macos·ios·小程序·uni-app·cocoa·iphone
咋吃都不胖lyh8 小时前
SQL-多对多关系
android·mysql·数据分析
cyy2989 小时前
android 屏幕适配
android
Digitally10 小时前
如何通过 5 种有效方法同步 Android 和 Mac
android·macos
小蕾Java10 小时前
PyCharm 软件使用各种问题 ,解决教程
ide·python·pycharm
行墨12 小时前
Jetpack Compose 深入浅出(二)——基础组件Text
android
雨白14 小时前
深入理解协程的运作机制 —— 调度、挂起与性能
android·kotlin
沐怡旸14 小时前
【Android】Android系统体系结构
android
namehu14 小时前
React Native 应用性能分析与优化不完全指南
android·react native·ios