RadioButton icon resizes (TextView also works)

Keywords: Android xml Attribute encoding

There is no corresponding layout parameter for the icon size of RadioButton. In this paper, the RadioButton is customized by means of custom attribute to control the image size.

  • Key points of this paper:
  1. Use of custom properties.
  2. Solve the problem of customizing the size of icons on the top, bottom, left and right of RadioButton text.
  3. This method is also applicable to icons in TextView.
  • The questions are as follows:

 

  • resolvent:

1. In the values / attrs.xml file: two attributes: Custom rb_width and 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. Customize 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  * Author: Zhang fengjietrei
14  * Time: 2018 / 3 / 28:6:30
15  * Email: 1981462002@qq.com
16  * Description: Custom RadioButton attribute: 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         //Give Way RadioButton Icon resizable properties for:
39         Drawable drawableLeft = this.getCompoundDrawables()[0];//Get the picture to the left of the text
40         Drawable drawableTop = this.getCompoundDrawables()[1];//Get top picture of text
41         Drawable drawableRight = this.getCompoundDrawables()[2];//Get the picture to the right of the text
42         Drawable drawableBottom = this.getCompoundDrawables()[3];//Get bottom picture of text
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. Use attributes to control the image size in RadioButton

  • Be careful:
  1. < top.only.www.myqq.view.myradiobutton is the full path name of the custom control class
  2.  Xmlns: to ly = "http://schemas.android.com/apk/res-auto" declare the namespace, where to ly is a custom name and can be replaced (it should be consistent with the name before the colon in point 3)
  3.  To ly: rb_width = "30dp" to ly: rb_height = "30dp" for the use of custom attributes
  4.  Android: drawabletop = "@ drawable / tab" is the specified picture resource
<?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="news"/>

        <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="Contacts"/>

        <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="dynamic"
           />
    </RadioGroup>
</RelativeLayout>

 

4. Result chart:

Posted by TimSawyers on Tue, 31 Mar 2020 22:18:46 -0700