Android自定义进度条——圆角横向进度条

1.本文将向你介绍自定义进度条的写法，比较简单，但还是有些知识点是需要注意的：

invalidate()方法
RectF方法的应用
onMeasure方法的应用

2.原理
画3层圆角矩形，底层为黑色，第二层为灰色，最上一层为进度条颜色，示例图如下：

3.效果图

实现圆角进度条还有很多其他方法，比如在Progress控件里填充圆角图片，通过拉伸图片来达到预想的效果，虽然听起来很简单，但实现起来还是有些麻烦的。

4.解说方法
（1）invalidate()方法
invalidate()是用来刷新View的，必须是在UI线程中进行工作。比如在修改某个view的显示时，调用invalidate()才能看到重新绘制的界面。invalidate()的调用是把之前的旧的view从主UI线程队列中pop掉。一般在自定义控件中会用到这个方法。

（2）RectF方法的应用
RectF是用来绘画矩形的方法。
RectF（left,top,right,bottom）,四个参数的含义分别是父控件距离矩形左上右下边距的距离，以下用图来说明：

drawRoundRect方法是用来绘制圆角矩形的，它的参数如下：
参数说明
rect：RectF对象。
rx：x方向上的圆角半径。
ry：y方向上的圆角半径。
paint：绘制时所使用的画笔。

（3）onMeasure方法
指定自定义控件在屏幕上的大小,onMeasure方法的两个参数是由上一层控件传入的大小，而且是模式和尺寸混合在一起的数值，需要MeasureSpec.getMode(widthMeasureSpec) 得到模式，MeasureSpec.getSize(widthMeasureSpec)得到尺寸。

onMeasure的几种模式分别为EXACTLY,AT_MOST,UNSPECIFIED。

[1]MeasureSpec.EXACTLY
MeasureSpec.EXACTLY是精确尺寸，当我们将控件的layout_width或layout_height指定为具体数值时如andorid:layout_width=”50dip”，或者为FILL_PARENT是，都是控件大小已经确定的情况，都是精确尺寸。

[2]MeasureSpec.AT_MOST
MeasureSpec.AT_MOST是最大尺寸，当控件的layout_width或layout_height指定为WRAP_CONTENT时，控件大小一般随着控件的子空间或内容进行变化，此时控件尺寸只要不超过父控件允许的最大尺寸即可。因此，此时的mode是AT_MOST，size给出了父控件允许的最大尺寸。

[3]MeasureSpec.UNSPECIFIED
MeasureSpec.UNSPECIFIED是未指定尺寸，这种情况不多，一般都是父控件是AdapterView，通过measure方法传入的模式。

5.activity_main.xml文件：

"http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/container"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.example.progresstest.MainActivity"    tools:ignore="MergeRootFrame" >    <com.example.progresstest.ProgressViewTest         android:id="@+id/progressbar"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/>

6.ProgressViewTest.java文件

package com.example.progresstest;import android.content.Context;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 ProgressViewTest extends View {    /**进度条最大值*/    private float maxCount;    /**进度条当前值*/    private float currentCount;    /**画笔*/    private Paint mPaint;    private int mWidth,mHeight;    public ProgressViewTest(Context context, AttributeSet attrs, int defStyle) {        super(context, attrs, defStyle);        // TODO Auto-generated constructor stub    }    public ProgressViewTest(Context context, AttributeSet attrs) {        super(context, attrs);        // TODO Auto-generated constructor stub    }    public ProgressViewTest(Context context) {        super(context);        // TODO Auto-generated constructor stub    }    /***     * 设置最大的进度值     * @param maxCount     */    public void setMaxCount(float maxCount) {        this.maxCount = maxCount;    }    /**     * 得到最大进度值     */    public double getMaxCount(){        return maxCount;    }    /***     * 设置当前的进度值     * @param currentCount     */    public void setCurrentCount(float currentCount) {        this.currentCount = currentCount > maxCount ? maxCount : currentCount;        /**         * invalidate()是用来刷新View的，必须是在UI线程中进行工作。比如在修改某个view的显示时，         * 调用invalidate()才能看到重新绘制的界面。invalidate()的调用是把之前的旧的view从主UI         * 线程队列中pop掉。          */        invalidate();    }    @Override    protected void onDraw(Canvas canvas) {        // TODO Auto-generated method stub        super.onDraw(canvas);        mPaint = new Paint();        //设置抗锯齿效果        mPaint.setAntiAlias(true);        //设置画笔颜色        mPaint.setColor(Color.BLACK);        int round = mHeight/2;        /**         * RectF：绘制矩形，四个参数分别是left,top,right,bottom         * 类型是单精度浮点数         */        RectF rf = new RectF(0, 0, mWidth, mHeight);        /*绘制圆角矩形，背景色为画笔颜色*/        canvas.drawRoundRect(rf, round, round, mPaint);        /*设置progress内部是灰色*/        mPaint.setColor(Color.rgb(211, 211, 211));        RectF rectBlackBg = new RectF(2, 2, mWidth-2, mHeight-2);        canvas.drawRoundRect(rectBlackBg, round, round, mPaint);        //设置进度条进度及颜色        float section = currentCount/maxCount;        RectF rectProgressBg = new RectF(3, 3, (mWidth-3)*section, mHeight-3);        if(section!=0.0f){            mPaint.setColor(Color.GREEN);        }else{            mPaint.setColor(Color.TRANSPARENT);        }        canvas.drawRoundRect(rectProgressBg, round, round, mPaint);    }    //dip * scale + 0.5f * (dip >= 0 ? 1 : -1)    private int dipToPx(int dip){        float scale = getContext().getResources().getDisplayMetrics().density;        return (int) (dip * scale + 0.5f * (dip >= 0 ? 1 : -1));//加0.5是为了四舍五入    }    /**指定自定义控件在屏幕上的大小,onMeasure方法的两个参数是由上一层控件     * 传入的大小，而且是模式和尺寸混合在一起的数值，需要MeasureSpec.getMode(widthMeasureSpec)     * 得到模式，MeasureSpec.getSize(widthMeasureSpec)得到尺寸     *      */    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        // TODO Auto-generated method stub        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);        int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);        int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);        int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);        //MeasureSpec.EXACTLY，精确尺寸        if (widthSpecMode == MeasureSpec.EXACTLY || widthSpecMode == MeasureSpec.AT_MOST) {            mWidth = widthSpecSize;        } else {            mWidth = 0;        }        //MeasureSpec.AT_MOST，最大尺寸，只要不超过父控件允许的最大尺寸即可，MeasureSpec.UNSPECIFIED未指定尺寸        if (heightSpecMode == MeasureSpec.AT_MOST || heightSpecMode == MeasureSpec.UNSPECIFIED) {            mHeight = dipToPx(20);        } else {            mHeight = heightSpecSize;        }        //设置控件实际大小        setMeasuredDimension(mWidth, mHeight);    }}

MainActivity.java文件

package com.example.progresstest;import android.support.v7.app.ActionBarActivity;import android.os.Bundle;import android.os.Handler;import android.os.Message;public class MainActivity extends ActionBarActivity {    private ProgressViewTest progress;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        progress = (ProgressViewTest) findViewById(R.id.progressbar);        progress.setMaxCount(100);        new Thread(new Runnable() {            @Override            public void run() {                // TODO Auto-generated method stub                for (int i = 0; i <=progress.getMaxCount(); i++) {                    Message msg = new Message();                    msg.arg1 = i;                    msg.what = 0x01;                    handler.sendMessage(msg);                    try {                        //每隔0.1秒进度前进1                        Thread.sleep(100);                    } catch (InterruptedException e) {                        // TODO Auto-generated catch block                        e.printStackTrace();                    }                }            }        }).start();    }    Handler handler = new Handler(){        public void handleMessage(Message msg) {            if(msg.what==0x01){                progress.setCurrentCount(msg.arg1);            }        };    };}

内容比较简单，这里就不贴源码下载地址了。

Android自定义进度条——圆角横向进度条

Android自定义进度条——圆角横向进度条

更多相关文章

随机推荐