Android 扩展RadioButton 灵活控制drawable的大小

来源:互联网 发布:maven nexus windows 编辑:程序博客网 时间:2024/06/05 15:22

android系统自带的radioButton当设置drawableTop ,drawableBottom,drawableLeft,drawableRight时,drawable的大小很难进行控制,默认显示为drawable图标的原始大小。一般在xml布局文件中没法进行设置,但是可以通过代码进行动态控制,这样的做法是灵活性太差了。

在activity中动态设置radioButton中drawable的大小:

RadioButton mAppBtn;Drawable drawable=getDrawable(R.drawable.tab_icon_app);drawable.setBounds(0,0,100,100);//将drawable设置为宽100 高100固定大小mAppBtn.setCompoundDrawables(null,drawable,null,null);

这里涉及到2个方法 一个是Drawable类的setBounds 和 RadioButton 的setCompoundDrawables,首先来分析下这2个方法的作用。

Drawable类的setBounds :

void setBounds (int left, int top, int right, int bottom)
Specify a bounding rectangle for the Drawable. This is where the drawable will draw when its draw() method is called.
翻译:设置一个矩形边界给Drawable对象,Drawable类调用draw()方法进行绘制。
draw(Canvas canvas)
Draw in its bounds (set via setBounds)
翻译:当设置Bounds时,Drawable类将会在canvas画布里的Bounds矩形区域内绘制drawable。

由官方文档可以知道,left,top,right,bottom四个参数指的是drawable将在被绘制在canvas的哪个矩形区域内。这4个参数的坐标值是相对于canvas里的坐标为参考值,一般设置left , top为绘制起点坐标,一般设为0 ,right为drawable宽,bottom为drawable高进行设置。也可以理解为setBounds(x,y,width,height)。

RadioButton 的setCompoundDrawables:
RadioButton -> CompoundButton -> Button -> TextView
->代表继承 也就是说RadioButton继承于TextView ,而setCompoundDrawables是TextView里面的方法:

/**
* Sets the Drawables (if any) to appear to the left of, above, to the
* right of, and below the text. Use {@code null} if you do not want a
* Drawable there. The Drawables must already have had
* {@link Drawable#setBounds} called.
*/
public void setCompoundDrawables(@Nullable Drawable left, @Nullable Drawable top, @Nullable Drawable right, @Nullable Drawable bottom)
翻译:可以调用setCompoundDrawables 来设置drawable显示在text的左边,上边,右边,下边。如果不想某个方向显示drawable可以设置null。当调用这个方法时,drawable必须已经调用setBounds设置了边界。也就是要添加的资源必须已经设置过初始位置、宽和高等信息。

由此知道了setCompoundDrawables 是与 setBounds 关联在一起的 ,setBounds必须在setCompoundDrawables 前调用 才能使RadioButton中控制drawable的大小。

但是这种动态控制的灵活性太差,每次都要写一大堆代码,那就只能继承RadioButton自己来扩展了,也就是自定义View了。
首先来了解下TextView中 setCompoundDrawablesWithIntrinsicBounds(Drawable left,Drawable top,Drawable right,Drawable bottom) 的方法:

/**
* Sets the Drawables (if any) to appear to the left of, above, to the
* right of, and below the text. Use {@code null} if you do not want a
* Drawable there. The Drawables’ bounds will be set to their intrinsic
* bounds.
* * Calling this method will overwrite any Drawables previously set using
* {@link #setCompoundDrawablesRelative} or related methods.
*
*/
翻译:可以调用setCompoundDrawables 来设置drawable显示在text的左边,上边,右边,下边。如果不想某个方向显示drawable可以设置null。Drawable的Bounds边界值为被设置为drawable的固定宽和高。也就是drawable图标的宽高将会设置为固有宽高,既自动通过getIntrinsicWidth和getIntrinsicHeight获取,即按照图片原有比例大小显示drawable。

public void setCompoundDrawablesWithIntrinsicBounds(@Nullable Drawable left,            @Nullable Drawable top, @Nullable Drawable right, @Nullable Drawable bottom) {        if (left != null) {            left.setBounds(0, 0, left.getIntrinsicWidth(), left.getIntrinsicHeight());        }        if (right != null) {            right.setBounds(0, 0, right.getIntrinsicWidth(), right.getIntrinsicHeight());        }        if (top != null) {            top.setBounds(0, 0, top.getIntrinsicWidth(), top.getIntrinsicHeight());        }        if (bottom != null) {            bottom.setBounds(0, 0, bottom.getIntrinsicWidth(), bottom.getIntrinsicHeight());        }        setCompoundDrawables(left, top, right, bottom);    }

通过源码可以看到setCompoundDrawablesWithIntrinsicBounds 中通过Drawable.getIntrinsicWidth和Drawable.getIntrinsicHeight来获取图片的大小,调用setBounds设置drawable为固定宽高,然后再调用setCompoundDrawables 进行设置了。这也就是在xml中设置drawable时总显示为图片的宽高了,无法对drawable大小进行控制的原因了。当想在xml中控制drawable大小时,就必须要重写这个方法了。

知道了原因后就可以进行扩展了,下面介绍下如果进行扩展:
首先在res/values/attrs 文件中声明自定义属性 (如果没有atrrs 文件,鼠标右键自己创建一个)

<?xml version="1.0" encoding="utf-8"?><resources>    <declare-styleable name="MyRadioButton">        <attr name="drawableSizes" format="dimension"/><!--drawable的大小-->        <attr name="drawableTop" format="reference"/><!--显示在上方的图片-->        <attr name="drawableLeft" format="reference"/><!--显示在左边的图片-->        <attr name="drawableRight" format="reference"/><!--显示在右边的图片-->        <attr name="drawableBottom" format="reference"/><!--显示下边的图片-->    </declare-styleable></resources>

创建一个MyRadioButton类继承RadioButton

public class MyRadioButton extends RadioButton {    private int mDrawableSize;//drawable大小    public MyRadioButton(Context context) {        this(context,null);    }    public MyRadioButton(Context context, AttributeSet attrs) {        this(context, attrs,0);    }    public MyRadioButton(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        Drawable drawableLeft=null;        Drawable drawableRight=null;        Drawable drawableBottom=null;        Drawable drawableTop=null;        TypedArray a=context.obtainStyledAttributes(attrs, R.styleable.MyRadioButton);//获取自定义属性        int n=a.getIndexCount();        for(int i=0;i<n;i++){            int attr=a.getIndex(i);            switch (attr){                case R.styleable.MyRadioButton_drawableSizes:                    mDrawableSize=a.getDimensionPixelSize(R.styleable.MyRadioButton_drawableSizes,50);//获取drawable大小,没设置时默认为50dp                    break;                case R.styleable.MyRadioButton_drawableTop:                    drawableTop=a.getDrawable(attr);//获取显示在上方的drawable                    break;                case R.styleable.MyRadioButton_drawableBottom:                    drawableBottom=a.getDrawable(attr);//获取显示在下方的drawable                    break;                case R.styleable.MyRadioButton_drawableRight:                    drawableRight=a.getDrawable(attr);//获取显示在右方的drawable                    break;                case R.styleable.MyRadioButton_drawableLeft:                    drawableLeft=a.getDrawable(attr);//获取显示在左方的drawable                    break;                default:                    break;            }        }        a.recycle();        setCompoundDrawablesWithIntrinsicBounds(drawableTop,drawableBottom,drawableLeft,drawableRight);//调用重写的方法进行设置drawable的大小.    }   //重写TextView中的setCompoundDrawablesWithIntrinsicBounds的方法    @Override    public void setCompoundDrawablesWithIntrinsicBounds(Drawable top,Drawable bottom,Drawable left,Drawable right){        if(left!=null){            left.setBounds(0,0,mDrawableSize,mDrawableSize);//drawable的bounds设置为了我们自定义大小了,第三个参数是设置宽度,第四个参数是设置高度,这里我就只设置了同一个也就是正方形了,如果想设置矩形的可以声明2个不同的自定义属性来设置。        }        if(right!=null){            right.setBounds(0,0,mDrawableSize,mDrawableSize);        }        if(top!=null){            top.setBounds(0,0,mDrawableSize,mDrawableSize);        }        if(bottom!=null){            bottom.setBounds(0,0,mDrawableSize,mDrawableSize);        }        setCompoundDrawables(left,top,right,bottom);//设置完了bounds就可以调用这个方法进行设置了 不用在代码中进行动态控制了。    }}

使用方法:

xmlns:custom="http://schemas.android.com/apk/res-auto"//在根布局中引入自定义属性的命名空间<customView.MyRadioButton //目录名.MyRadioButton             android:id="@+id/MainActivity_btn_personal"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:text="消息"            android:gravity="center_horizontal"//内部横向居中            android:drawablePadding="3dp"            android:clickable="true" //设置为可点击            custom:drawableTop="@drawable/tab_icon_personal"//自定义为上边显示的图片            custom:drawableSizes="25dp"////自定义为drawable的大小了            />

完了 就可以随心所欲的在xml中控制drawable大小了
这里写图片描述
但美工给的drawable的尺寸不合适时 ,就可以在XML中设置固定大小了
这里写图片描述

0 0
原创粉丝点击