自定义View（音量条）

初来乍到，写点东西，方便自己以后用

首先要感谢鸿洋大神的自定义view攻略

自定义view分成几个部分，我自己选择的是顺序是：1view属性确定；2创建view并在构造方法中获取到属性；3重写onDraw； 4重写onMeasure；

View属性确定：

res/values中创建attr文件，里面写明的是自己需要填写的属性

<?xml version="1.0" encoding="utf-8"?><resources>    <attr name="bgColor" format="color"></attr>    <attr name="itemPadding" format="dimension"></attr>    <attr name="unPic" format="reference"></attr>    <attr name="inPic" format="reference"></attr>    <attr name="needNum" format="integer"></attr>    <declare-styleable name="PersonalView">        <attr name="bgColor"></attr>        <attr name="itemPadding"></attr>        <attr name="unPic"></attr>        <attr name="inPic"></attr>        <attr name="needNum"></attr>    </declare-styleable></resources>

可以从代码中看到，其中name为属性名，format为属性所需的值（其中dimesion为尺寸值如dp、sp，reference指的是指定值，例如R.drawable.****，其余的可以百度）

declare-styleable name 为自定义view的名称

然后我们在需要所在的activity的xml中可以写成如下

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    xmlns:app="http://schemas.android.com/apk/res-auto"    tools:context="com.example.administrator.gasprogress.MainActivity">        <com.example.administrator.gasprogress.PersonalView        android:id="@+id/pView"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        app:bgColor="@color/white"        app:itemPadding="7dp"        app:unPic="@drawable/ic_gray"        app:inPic="@drawable/ic_yellow"        app:needNum="15"        android:layout_centerInParent="true"        />    </RelativeLayout>

view构造方法

public class PersonalView extends View {    private int mBgColor;    private int mPadding;    private Drawable mUnBg;    private Drawable mInBg;    private int mNum;    private Paint mPaint;    private Rect mBound;    private int LeastGas;    public int getLeastGas() {        return LeastGas;    }    public void setLeastGas(int leastGas) {        LeastGas = leastGas;    }    public PersonalView(Context context) {        this(context,null);    }    public PersonalView(Context context,  AttributeSet attrs) {        this(context, attrs,0);    }    public PersonalView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        TypedArray a = context.getTheme().obtainStyledAttributes(attrs,R.styleable.PersonalView,defStyleAttr,0);        int n = a.getIndexCount();        for(int i = 0;i<n;i++){            int attr = a.getIndex(i);            switch (attr){                case R.styleable.PersonalView_bgColor:                    mBgColor = a.getColor(attr, Color.BLACK);                    break;                case R.styleable.PersonalView_itemPadding:                    mPadding = a.getDimensionPixelSize(attr,(int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,5,getResources().getDisplayMetrics()));                    break;                case R.styleable.PersonalView_unPic:                    mUnBg = a.getDrawable(attr);                    break;                case R.styleable.PersonalView_inPic:                    mInBg = a.getDrawable(attr);                    break;                case R.styleable.PersonalView_needNum:                    mNum = a.getInt(attr,5);                    break;            }        }        a.recycle();        mPaint = new Paint();        mBound = new Rect();    }

如上述代码中，创建了我们自定义view的构造器，并在构造器中，获取了相应的属性值，view的3个构造参数，第一个Context就不多说了，第二个参数AttributeSet

，这个参数就是在xml中获取的数值的调用，我个人理解就是，xml中付的值将通过这个参数在这里返还个自定义view，并使其可以调用，第三个参数defStyleAttr,这个

是一个默认的style，一般不会调用，具体大家可以自行百度。

重写OnDraw（）

@Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        mPaint.setColor(mBgColor);        BitmapDrawable bgB = (BitmapDrawable)mUnBg;        canvas.drawRect(0,0,getMeasuredWidth(),getMeasuredHeight(),mPaint);//        for(int x = 0;x<mNum;x++){            canvas.drawBitmap(bgB.getBitmap(),0+x*(bgB.getBitmap().getWidth()+mPadding),getHeight()/2-bgB.getBitmap().getHeight()/2,null);        }        BitmapDrawable fb = (BitmapDrawable)mInBg;        canvas.saveLayer(0,0,0,0,null,Canvas.FULL_COLOR_LAYER_SAVE_FLAG);        for(int x = 0;x <getLeastGas(); x++){            canvas.drawBitmap(fb.getBitmap(),0+x*(fb.getBitmap().getWidth()+mPadding),getHeight()/2-fb.getBitmap().getHeight()/2,null);        }        canvas.restore();    }
我这里是做一个类似音量条的一个view，所以其中主要是需要两个图层（因为是最基版，所以并没有加入拖动功能，也没有考虑特别全面，以后应该会完善），这里说明一下

canvas如果要创建一个新图层，需要用到saveLayer这个方法，通过创建新图层，然后再还原最初图层，就可以得到一个覆盖的效果

重写onMeasure()

@Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        BitmapDrawable bit = (BitmapDrawable)mUnBg;        int widthMode = MeasureSpec.getMode(widthMeasureSpec);        int widthSize = MeasureSpec.getSize(widthMeasureSpec);        int heightMode = MeasureSpec.getMode(heightMeasureSpec);        int heightSize = MeasureSpec.getSize(heightMeasureSpec);        int width;        int height;        if(widthMode == MeasureSpec.EXACTLY){            width = widthSize;        }else {            width = (bit.getBitmap().getWidth()+mPadding)*mNum-mPadding;        }        if(heightMode == MeasureSpec.EXACTLY){            height = heightSize;        }else {            height = bit.getBitmap().getHeight();        }        setMeasuredDimension(width, height);    }

EXACTLY：一般是设置了明确的值或者是MATCH_PARENT
AT_MOST：表示子布局限制在一个最大值内，一般为WARP_CONTENT
UNSPECIFIED：表示子布局想要多大就多大，很少使用

就这样一个很基本的自定view(音量条)，就完成了，效果如图