Android自定義RadioButton

自定義RadioButton 實現性別選擇效果,經過自定義RadioButton背景來完成。android

自定義矩形邊框背景

res/drawable/bg_radio_button_normal.xml 正常狀態背景

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 內部顏色 -->
    <solid
        android:color="@android:color/white" />
    <!-- 邊緣線條顏色 -->
    <stroke
        android:width="1dp"
        android:color="@android:color/darker_gray" />
    <!-- 圓角的幅度 -->
    <corners
        android:topLeftRadius="0dip"
        android:topRightRadius="0dip"
        android:bottomLeftRadius="0dip"
        android:bottomRightRadius="0dip" />
</shape>

res/drawable/bg_radio_button_checked.xml 選中狀態背景

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 內部顏色 -->
    <solid
        android:color="@android:color/white" />
    <!-- 邊緣線條顏色 -->
    <stroke
        android:width="1dp"
        android:color="@color/colorPrimary" />
    <!-- 圓角的幅度 -->
    <corners
        android:topLeftRadius="0dip"
        android:topRightRadius="0dip"
        android:bottomLeftRadius="0dip"
        android:bottomRightRadius="0dip" />
</shape>

res/drawable/bg_radio_button.xml Selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/bg_radio_button_checked"/>
    <item android:state_focused="true" android:drawable="@drawable/bg_radio_button_checked"/>
    <item android:drawable="@drawable/bg_radio_button_normal"/>
</selector>

定義字體顏色

res/drawable/radio_button_text_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="@color/colorPrimary"/>
    <item android:state_focused="true" android:color="@color/colorPrimary"/>
    <item android:color="@android:color/darker_gray"/>
</selector>

使用

<RadioButton
    android:id="@+id/rb_male"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/bg_radio_button"
    android:button="@null"
    android:text="Male" />
相關文章
相關標籤/搜索