RadioButton的图标大小并没有相应的布局参数,本文通过自定义属性的方式自定义RadioButton,实现控制图片大小。
- 本文要点:
- 自定义属性的使用。
- 解决RadioButton文字上、下、左、右的图标大小自定义问题。
- 此方法对TextView内的图标也适用。
- 问题如下:
- 解决方法:
1.values/attrs.xml 文件中:自定义rb_width 和 rb_height 两个属性
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="MyRadioButton"> <attr name="rb_width" format="dimension"/> <attr name="rb_height" format="dimension"/> </declare-styleable> </resources>
2.自定义RadioButton
1 package top.toly.www.myqq.view; 2 3 import android.content.Context; 4 import android.content.res.TypedArray; 5 import android.graphics.drawable.Drawable; 6 import android.util.AttributeSet; 7 import android.widget.RadioButton; 8 9 import top.toly.www.myqq.R; 10 import utils.shortUtils.Change; 11 12 /** 13 * 作者:张风捷特烈 14 * 时间:2018/3/28:6:30 15 * 邮箱:1981462002@qq.com 16 * 说明:自定义RadioButton 属性:rb_width rb_height 17 */ 18 public class MyRadioButton extends RadioButton { 19 20 private float mImg_width; 21 private float mImg_height; 22 23 public MyRadioButton(Context context) { 24 super(context); 25 } 26 27 public MyRadioButton(Context context, AttributeSet attrs) { 28 super(context, attrs); 29 TypedArray t = context.obtainStyledAttributes(attrs, R.styleable.MyRadioButton); 30 mImg_width = t.getDimension(R.styleable.MyRadioButton_rb_width, Change.dp2px(25)); 31 mImg_height = t.getDimension(R.styleable.MyRadioButton_rb_height, Change.dp2px(25)); 32 t.recycle(); 33 } 34 35 @Override 36 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 37 super.onMeasure(widthMeasureSpec, heightMeasureSpec); 38 //让RadioButton的图标可调大小 属性: 39 Drawable drawableLeft = this.getCompoundDrawables()[0];//获得文字左侧图片 40 Drawable drawableTop = this.getCompoundDrawables()[1];//获得文字顶部图片 41 Drawable drawableRight = this.getCompoundDrawables()[2];//获得文字右侧图片 42 Drawable drawableBottom = this.getCompoundDrawables()[3];//获得文字底部图片 43 if (drawableLeft != null) { 44 drawableLeft.setBounds(0, 0, (int) mImg_width, (int) mImg_height); 45 this.setCompoundDrawables(drawableLeft, null, null, null); 46 } 47 if (drawableRight != null) { 48 drawableRight.setBounds(0, 0, (int) mImg_width, (int) mImg_height); 49 this.setCompoundDrawables(null, null, drawableRight, null); 50 } 51 if (drawableTop != null) { 52 drawableTop.setBounds(0, 0, (int) mImg_width, (int) mImg_height); 53 this.setCompoundDrawables(null, drawableTop, null, null); 54 } 55 if (drawableBottom != null) { 56 drawableBottom.setBounds(0, 0, (int) mImg_width, (int) mImg_height); 57 this.setCompoundDrawables(null, null, null, drawableBottom); 58 } 59 } 60 }
3.使用属性控制RadioButton 中的图片大小
- 注意:
- <top.toly.www.myqq.view.MyRadioButton 为自定义控件类的全路径名
-
xmlns:toly="http://schemas.android.com/apk/res-auto" 声明命名空间,其中toly为自定义名称,可替换(需与第3点冒号前名称一致)
-
toly:rb_width="30dp" toly:rb_height="30dp" 为自定义属性的使用
-
android:drawableTop="@drawable/tab_msg_selector" 为指定的图片资源
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:toly="http://schemas.android.com/apk/res-auto" android:id="@+id/my_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/qq_title_text"> <RadioGroup android:id="@+id/rg_btns" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:orientation="horizontal"> <top.toly.www.myqq.view.MyRadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/rb_msg" android:checked="false" toly:rb_width="30dp" toly:rb_height="30dp" android:button="@null" android:gravity="center" android:drawableTop="@drawable/tab_msg_selector" android:text="消息"/> <top.toly.www.myqq.view.MyRadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/rb_contact" android:background="@android:color/transparent" android:checked="false" android:button="@null" toly:rb_width="30dp" toly:rb_height="30dp" android:gravity="center" android:drawableTop="@drawable/tab_contact_selector" android:text="联系人"/> <top.toly.www.myqq.view.MyRadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/rb_act" android:button="@null" toly:rb_width="30dp" toly:rb_height="30dp" android:gravity="center" android:background="@android:color/transparent" android:drawableTop="@drawable/tab_act_selector" android:text="动态" /> </RadioGroup> </RelativeLayout>
4.结果图: