学习自定义View（一）实现进度条加载

android开发也快2年了，一直没有深入自定义View，总是在重复用轮，却没有自己造过，实在惭愧~   好吧，开始学习自定义View！今天先来一个简单的（PS：说的好像复杂你就会是的）

废话不多说效果图：

[插入]

接下来上代码

package com.example.lly.myapplication;

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.graphics.Typeface;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

/**
 * @author 世界第一AP雷子
 */
public class MyProgressView extends View {

    private Paint mPaint;
    private Paint mPanint1;
    private Paint mPanint2;

    private float mRadius;//圆弧的半径

    private float sweepAngle ;//圆弧角度

    private int mProgress = 0;//进度值

    private int progress_color;//进度条的颜色
    private float progress_weight;//进度条的宽度


    private float mTextSize = 30f;//文字大小

    public MyProgressView(Context context) {
        super(context);
    }

    public MyProgressView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }


    public MyProgressView(Context context, AttributeSet attrs) {
        super(context, attrs);
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.MyProgressView);
        progress_color = array.getColor(R.styleable.MyProgressView_progress_color, Color.parseColor("#00CC00"));
        progress_weight = array.getDimension(R.styleable.MyProgressView_progress_weight, 8f);
        mTextSize = array.getDimension(R.styleable.MyProgressView_textSize, 20f);
        mRadius = array.getDimension(R.styleable.MyProgressView_radius, 50f);
        array.recycle();
        init();
    }

    private void init() {
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setColor(progress_color);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(progress_weight);

        mPanint1 = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPanint1.setColor(Color.parseColor("#CCCC99"));
        mPanint1.setStyle(Paint.Style.STROKE);
        mPanint1.setStrokeWidth(progress_weight);

        mPanint2 = new Paint();
        mPanint2.setStrokeWidth(0);
        mPanint2.setColor(Color.BLUE);
        mPanint2.setTextSize(mTextSize);
        mPanint2.setTypeface(Typeface.DEFAULT_BOLD); //设置字体
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        float centreX = getWidth() / 2;
        float centreY = getWidth() / 2;
        RectF oval = new RectF();
        oval.left = centreX - mRadius;
        oval.top = centreY - mRadius;
        oval.right = centreX + mRadius;
        oval.bottom = centreY + mRadius;
        sweepAngle = mProgress * (3.6f);

        canvas.drawArc(oval, 0, 360, false, mPanint1);//圆环底色

        canvas.drawArc(oval, 270, sweepAngle, false, mPaint);//圆环进度

        float textWidth = mPanint2.measureText(mProgress + "%");
        canvas.drawText(mProgress + "%", centreX - textWidth / 2, centreX + mTextSize / 2, mPanint2);
    }


    /**
     * 设置进度
     *
     * @param progress
     */
    public void setProgress(int progress) {
        if (progress < 0) {
            throw new IllegalArgumentException("progress not less than 0");
        }
        if (progress <= 100) {
            mProgress = progress;
            invalidate();
        }
    }
}

首先读取自定义属性，然后初始化画笔，最后在onDraw方法里面开始画了~ 下面说下onDraw方法，首先我初始化一个RectF 对象,其实就是一个矩形，然后我画一个圆环，作为这个矩形的内切圆，最后就是画Text文字了了，提供一个方法setProgress对外，每次调用invalidate()刷新就行了

Activity代码：

package com.example.lly.myapplication;

import android.os.Handler;
import android.os.Message;
import android.support.v4.app.FragmentActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;


public class MainActivity extends FragmentActivity {

    private MyProgressView mMyProgressView;
    private int mProgress = 0;

    private Handler Handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            mMyProgressView.setProgress(mProgress);
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mMyProgressView = (MyProgressView) findViewById(R.id.my_progressview);
        new Thread() {
            @Override
            public void run() {
                super.run();
                while (mProgress <= 100) {
                    try {
                        sleep(100);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                    mProgress++;
                    Handler.sendEmptyMessage(1);
                }
            }
        }.start();

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }


}

这个就不说了，接下来上XML

<pre name="code" class="html"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:MyProgressView="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.example.lly.myapplication.MyProgressView
        android:id="@+id/my_progressview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"

        MyProgressView:progress_color="@android:color/holo_blue_light"
        MyProgressView:radius="40dp"
        MyProgressView:textSize="14sp"
        MyProgressView:progress_weight="6dp"/>
</RelativeLayout>

attrs：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="MyProgressView">
        <attr name="radius" format="dimension"/>
        <attr name="textSize" format="dimension"/>
        <attr name="progress_color" format="color"></attr>
        <attr name="progress_weight" format="dimension"></attr>
    </declare-styleable>
</resources>

好了，到这里就结束了，是不是很简单啊~  但是再简单还是希望能够自己写一遍，效果绝对会不一样的~  

以后可能会慢慢写更多自定义View，祝自己加油~