自定义TextView实现设置drawable图片大小

在开发项目的过程中有到过很多难题，例如途中的左侧个人中心栏中的四个图标，该如何实现呢？

大概有两种方式解决
方法1：一个LinearLayout里面放一个ImageView和一个TextView
方法2：一个TextView然后设置drawableLeft

下面的是问题：
方法1：巨麻烦！要写三个控件，还要嵌套。要是一行多几个这样的控件，一整个页面得嵌套多少层啊？太麻烦了。。。

方法2：这个不错，直接设置drawableLeft（四个方向都行）搞定。但是，这个drawable的大小是不能够通过代码设置大小的！而且在代码里也没提供重新设置这个图片的方式，只能在xml布局文件中。是个坑！也走不通！

这次就和各位老司机分享一个最简单的自定义View，一起走向繁荣富强！

Come on baby ,按照自定义View的四大步骤走起！

自定义View的步骤：

1、自定义View的属性
2、在View的构造方法中获得我们自定义的属性
3、重写onMesure
4、重写onDraw

这次的自定义View继承于TextView，不用重新计算宽高，因为TextView 会帮我们计算，这就是继承自带控件的好处。

开始了：

　1、自定义View的属性　

按照需求，属性有：drawable，drawable宽度，drawable高度，drawable位置
在 /value/attrs.xml 中这么写：

<?xml version="1.0" encoding="utf-8"?><resources>  <declare-styleable name="MoreTextView">        <attr name="drawable_src" format="reference"/>        <attr name="imageHight" format="dimension"/>        <attr name="imageWidth" format="dimension"/>        <attr name="imageLocation">            <enum name="left" value="0"/>            <enum name="top" value="1"/>            <enum name="right" value="2"/>            <enum name="bottom" value="3"/>        </attr>    </declare-styleable></resources>

2.在View的构造方法中获得我们自定义的属性

public class MoreTextView extends TextView {    public static final int LEFT = 0, TOP = 1, RIGHT = 2, BOTTOM = 3;    private int mHight, mWidth, mLocation;    private Bitmap mImage;    public MoreTextView(Context context) {        this(context, null);    }    public MoreTextView(Context context, AttributeSet attrs) {        this(context, attrs, 0);    }    public MoreTextView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.MoreTextView, defStyleAttr, 0);        int n = a.getIndexCount();        for (int i = 0; i < n; i++) {            int attr = a.getIndex(i);            switch (attr) {                case R.styleable.MoreTextView_imageWidth:                    mWidth = a.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(                            TypedValue.COMPLEX_UNIT_SP, 0, getResources().getDisplayMetrics()));                    break;                case R.styleable.MoreTextView_imageHight:                    mHight = a.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(                            TypedValue.COMPLEX_UNIT_SP, 0, getResources().getDisplayMetrics()));                    break;                case R.styleable.MoreTextView_drawable_src:                    mImage = BitmapFactory.decodeResource(getResources(), a.getResourceId(attr, 0));                    break;                case R.styleable.MoreTextView_imageLocation:                    mLocation = a.getInt(attr, LEFT);                    break;            }        }        a.recycle();        drawPicture();//设置图片方法    }}

为什么开始就说这是一个很简单的自定义View呢？因为这里不用重写onDraw方法，因为这里没有什么需要绘制的。

核心方法：

textView.setCompoundDrawablesWithIntrinsicBounds(drawable, null, null, null);//参数分表代表左，上，右，下。使用drawable,不设置就设置null

下面是设置drawable的代码：

 private void drawPicture() {        if (mImage != null) {            Drawable mDrawable;            if (mHight != 0 && mWidth != 0) {                mDrawable = new BitmapDrawable(getResources(), getRealBitmap(mImage));            } else {                mDrawable = new BitmapDrawable(getResources(), Bitmap.createScaledBitmap(mImage, mImage.getWidth(), mImage.getHeight(), true));            }            switch (mLocation) {                case LEFT:                    this.setCompoundDrawablesWithIntrinsicBounds(mDrawable, null,                            null, null);                    break;                case TOP:                    this.setCompoundDrawablesWithIntrinsicBounds(null, mDrawable,                            null, null);                    break;                case RIGHT:                    this.setCompoundDrawablesWithIntrinsicBounds(null, null,                            mDrawable, null);                    break;                case BOTTOM:                    this.setCompoundDrawablesWithIntrinsicBounds(null, null, null,                            mDrawable);                    break;            }        }    }    private Bitmap getRealBitmap(Bitmap image) {       //根据需要Drawable原来的大小和目标宽高进行裁剪（缩放）        int width = image.getWidth();// 获得图片的宽高        int height = image.getHeight();        // 取得想要缩放的matrix参数        float scaleWidth = (float) mWidth / width;        float scaleHeight = (float) mHight / height;        Matrix matrix = new Matrix();        matrix.postScale(scaleWidth, scaleHeight);        // 返回新的Bitmap        return Bitmap.createBitmap(image, 0, 0, width, height, matrix, true);    }

这样下来获取到的的Drawable才是完整的，按照我们想要的大小缩放后的Drawable

  <com.example.captain_shan.myapplication.views.MoreTextView        android:id="@+id/moreTextview"        android:layout_marginTop="10dp"        android:layout_below="@+id/volume"        android:text="这是一条巴哥犬"        android:textColor="#ee00ee"        custom:imageLocation="top"        android:drawablePadding="5dp"        custom:imageHight="20dp"        custom:imageWidth="20dp"        android:background="#eeeeee"        custom:drawable_src="@drawable/dog"        android:layout_width="50dp"        android:layout_height="50dp"/>

记得根部局要获得自定义的空间哦（空间名称随你起），压脉带。。。。

是不是很简单呢？而且TextView的各种属性也可以照用，爽。