安卓自定义进度条样式

    xiaoxiao2021-03-25  132

    好,话不多说,先上效果图(gif图的效果不是很清晰,可以下载demo看比较清晰):

    使用方法很简单: 1.在xml中放入进度条控件

    <cn.com.cxsz.wocarnetwork.view.MyProgress android:id="@+id/ui_main_mb_progress" android:layout_width="@dimen/d300" android:layout_height="@dimen/d300" android:layout_centerVertical="true" android:layout_gravity="center_horizontal" />

    2.初始化进度条 myprogress.setMaxProgress(2000); myprogress.setLoadingText("查询中"); myprogress.setmTxtHint1("总进度" + myprogress.getMaxProgress()); myprogress.setmTxtHint2("当前进度"); 3.设置进度

    myprogress.setLoopThread(1500);``` 就这样就可以了。 下面是自定义ProgressBar的代码:

    public class MyProgress extends View { private int mMaxProgress = 100; private int mProgress = 0;

    int unit = mMaxProgress / 25; int time = 0; //area we're going to draw this view private final RectF mRectF; private final Paint mPaint; private String mTxtHint1; private String mTxtHint2; private String middletext = ""; private int startProgess = 0; private Handler handler = new Handler(); public MyProgress(Context context, AttributeSet attrs) { super(context, attrs); mRectF = new RectF(); mPaint = new Paint(); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //TODO 设置进度条高度宽度为控件高度,宽度 int width = this.getWidth(); int height = this.getHeight(); //make sure it's a square. int min = Math.min(width, height); int widthDif = width - min; int heightDif = height - min; //设置抗锯齿(画笔样式) mPaint.setAntiAlias(true); mPaint.setColor(Color.rgb(0xe9, 0xe9, 0xe9)); canvas.drawColor(Color.TRANSPARENT); int mCircleLineStrokeWidth = 8; mPaint.setStrokeWidth(mCircleLineStrokeWidth); mPaint.setStyle(Paint.Style.STROKE); //先画一个矩形,规范四维 mRectF.left = (widthDif > 0 ? (widthDif / 2) : 0) + mCircleLineStrokeWidth / 2; // left x mRectF.top = (heightDif > 0 ? (heightDif / 2) : 0) + mCircleLineStrokeWidth / 2; // left y mRectF.right = width - mCircleLineStrokeWidth / 2 - (widthDif > 0 ? (widthDif / 2) : 0); // right x mRectF.bottom = height - mCircleLineStrokeWidth / 2 - (heightDif > 0 ? (heightDif / 2) : 0); // right y canvas.drawArc(mRectF, -90, 360, false, mPaint);//画背景 mPaint.setColor(getResources().getColor(R.color.yongliang)); canvas.drawArc(mRectF, (((float) startProgess / mMaxProgress) * 360) - 90, ((float) mProgress / mMaxProgress) * 360, false, mPaint);//画进度条 //画中间的进度数字 int mTxtStrokeWidth = 2; mPaint.setStrokeWidth(mTxtStrokeWidth); int textHeight = height / 6; mPaint.setTextSize(textHeight); mPaint.setColor(getResources().getColor(R.color.white)); int textWidth = (int) mPaint.measureText(middletext, 0, middletext.length()); mPaint.setStyle(Paint.Style.FILL); canvas.drawText(middletext, width / 2 - textWidth / 2, height / 2 + textHeight / 2, mPaint); //绘制进度数字上的文字 if (!TextUtils.isEmpty(mTxtHint1)) { mPaint.setStrokeWidth(mTxtStrokeWidth); textHeight = height / 10; mPaint.setTextSize(textHeight); mPaint.setColor(getResources().getColor(R.color.gray)); textWidth = (int) mPaint.measureText(mTxtHint1, 0, mTxtHint1.length()); mPaint.setStyle(Paint.Style.FILL); canvas.drawText(mTxtHint1, width / 2 - textWidth / 2, height / 4 + textHeight / 2, mPaint); } //绘制进度数字下的文字 if (!TextUtils.isEmpty(mTxtHint2)) { mPaint.setStrokeWidth(mTxtStrokeWidth); textHeight = height / 12; mPaint.setTextSize(textHeight); mPaint.setColor(getResources().getColor(R.color.gray)); textWidth = (int) mPaint.measureText(mTxtHint2, 0, mTxtHint2.length()); mPaint.setStyle(Paint.Style.FILL); canvas.drawText(mTxtHint2, width / 2 - textWidth / 2, 3 * height / 4 + textHeight / 2, mPaint); } } //获取最大进度数 public int getMaxProgress() { return mMaxProgress; } //设置最大进度数 public void setMaxProgress(int maxProgress) { this.mMaxProgress = maxProgress; unit = mMaxProgress / 25; } //设置进度 public void setProgress(int progress) { startProgess = 0; middletext = ""; this.mProgress = progress; middletext = mProgress + ""; this.postInvalidate(); } //获取进度值时的一个加载动画 public void setLoopProgress(int startProgess, int mProgress) { this.startProgess = startProgess; this.mProgress = mProgress; this.postInvalidate(); } //设置中间的文字 public void setLoadingText(String text) { this.middletext = text == null ? "" : text; } public int getProgress() { return mProgress; } public String getmTxtHint1() { return mTxtHint1; } //设置上边文字 public void setmTxtHint1(String mTxtHint1) { this.mTxtHint1 = mTxtHint1; } public String getmTxtHint2() { return mTxtHint2; } //设置下边文字 public void setmTxtHint2(String mTxtHint2) { this.mTxtHint2 = mTxtHint2; } //调用加载动画线程 public void setLoopThread(int pro) { handler.post(new LoopRunable(pro)); } //动画线程 public class LoopRunable implements Runnable { private int pro; public LoopRunable(int pro) { this.pro = pro; } @Override public void run() { if (mProgress < mMaxProgress) { mProgress = mProgress + unit; } else { mProgress = 0; } setLoopProgress(mProgress - 20, mProgress); time = time + 20; if (time > 2000 && mProgress == 0) { setLoopProgress(0, 0); time = 0; setRunProgess(pro); } else { handler.postDelayed(this, 20); } } } private void setRunProgess(int pro) { handler.post(new GoalRunnable(pro)); } public class GoalRunnable implements Runnable { private int unit = 0; private int progess; public GoalRunnable(int progess) { this.progess = progess; } @Override public void run() { if (unit < progess) { if (progess > 20) { unit = unit + progess / 20; } else { unit++; } setProgress(unit); handler.postDelayed(this, 10); } } }

    } “` 基本逻辑就是画两个颜色不同的圆弧,一个画满作为背景,一个用参数设置角度,然后用handler线程设置刷新数据。

    备注://画中间的进度数字 int mTxtStrokeWidth = 2; mPaint.setStrokeWidth(mTxtStrokeWidth); int textHeight = height / 6; mPaint.setTextSize(textHeight); mPaint.setColor(getResources().getColor(R.color.white)); int textWidth = (int) mPaint.measureText(middletext, 0, middletext.length()); mPaint.setStyle(Paint.Style.FILL); canvas.drawText(middletext, width / 2 - textWidth / 2, height / 2 + textHeight / 2, mPaint); 这个是绘制:中间文字的代码,但是发现绘制文字的时候,中文文字明显要比数字和字母大一些,不知道什么原因,各位看官,如果有解决办法可以告知一下。多谢啦

    附录demo源代码下载地址:http://download.csdn.net/download/as4399/9774079

    转载请注明原文地址: https://ju.6miu.com/read-2360.html

    最新回复(0)