Android 自定义 RadioButton 单选按钮样式


项目开发中系统自带的radioButton可能满足不了我们实际的需要,配合APP整体的风格我们要对按钮进行改变,所以只能自定义一下,其实RadioButton自定义实现与checkBox区别不是很大,上篇博客编写了自定义checkBox的实现,该兴趣的同学可以去看一下。下面来实现自定义RadioButton

一、首先准备选中与未选中的两张图片,将它们存放在res下的drawable里面

   radio_check.png     radio_nor.png

二、然后准备选中与为选中的radio_style.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:drawable="@drawable/radio_check"
        android:state_checked="true"/>
    <item
        android:drawable="@drawable/radio_nor"
        android:state_checked="false"/>
    <item
        android:drawable="@drawable/radio_nor"/>
 
</selector>

三、准备好选中与未选中的xml后,我们在style.xml中添加。

 <!-- CustomRadiotheme -->
    <style name="CustomRadioTheme" parent="@android:style/Widget.CompoundButton.CheckBox">
        <item name="android:button">@drawable/radio_style</item>
    </style>

四、最后在我们需要应用的radioButton的地方添加上style就可以

<RadioButton
        android:id="@+id/rb_message_radio"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/CustomRadioTheme" />

这样下来我们就可以应用自己的自定义的单选按钮了

 

Android 自定义 RadioButton 单选按钮样式 第二种写法

这种写法可以避免出现文字与图片间距太近的问题

 

自定义:

设置一个selector给button属性(给RadioButton设置):

android:button="@drawable/radiobutton_selector"

selector如下:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/ic_select_yes" android:state_checked="true" android:state_enabled="true"/>
    <item android:drawable="@drawable/ic_select_no" android:state_checked="false" android:state_enabled="true"/>

</selector>

这样设置好之后样式就ok了,但此时会出现文字与图片间距太近的问题,那么这时候在设置几个属性(给RadioButton设置)就可以调整距离了,代码如下:

android:background="@null"
android:button="@drawable/radiobutton_selector"
android:drawableLeft="@drawable/radiobutton_selector"
android:drawablePadding="5dp"

如果只要一个按钮可以把  android:button 设置为 @null 

android:button="@drawable/radiobutton_selector"

下面是一个RadioGroup的完整代码(当然这里只有xml代码):

<RadioGroup
                        android:id="@+id/radio_group"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginRight="18dp"
                        android:gravity="left|center_vertical"
                        android:orientation="horizontal" >

                        <RadioButton
                            android:id="@+id/radio_one"
                            android:layout_width="wrap_content"
                            android:layout_height="match_parent"
                            android:layout_marginRight="18dp"
                            android:background="@null"
                            android:button="@null"
                            android:drawableLeft="@drawable/radiobutton_selector"
                            android:drawablePadding="5dp"
                            android:text="@string/net_wired"
                            android:textColor="@color/text_color_black"
                            android:textSize="15sp" />

                        <RadioButton
                            android:id="@+id/radio_two"
                            android:layout_width="wrap_content"
                            android:layout_height="match_parent"
                            android:background="@null"
                            android:button="@null"
                            android:drawableLeft="@drawable/radiobutton_selector"
                            android:drawablePadding="5dp"
                            android:text="@string/net_wifi"
                            android:textColor="@color/text_color_black"
                            android:textSize="15sp" />
                    </RadioGroup>

参考:

https://blog.csdn.net/tiger_gy/article/details/83340209

https://my.oschina.net/u/2473169/blog/860410

Logo

助力广东及东莞地区开发者,代码托管、在线学习与竞赛、技术交流与分享、资源共享、职业发展,成为松山湖开发者首选的工作与学习平台

更多推荐