隨着市場的不斷髮展壯大,Android的系統控件樣式越來越不能滿足Android開發者的需求,所以我們經常就需要修改系統控件，這裏我們只是從樣式上修改RadioGroup,不併非從功能上去擴展組件。廢話不多說，我們先看看RadioGroup的原生態樣式如下:
可以看到RadioGroup的原生控件的樣式就是這個樣式的.需要說明的是:RadioGroup的長相受到它button和backgroud兩個屬性的影響!當我們設置button屬性爲null時,代碼如下:
<RadioButton
android:id="@+id/rb1"
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1"
android:checked="true"
android:gravity="center"
android:button="@null"
android:text="今日頭條"
android:textSize="17sp" />運行截圖如下:
會發現第一個RadioButton前面的圓形不見了,這就是button屬性的效果,那麼background自然就是給RadioButton添加背景了。
討論完了RadioButton自定義樣式,我們就需要看看RadioButton的應用場景了。由於RadioGroup的button選擇是唯一的,就是兩個選項是互斥的,利用這個特性,我們很容易就會把它Android的底部導航以及互斥列表導航開發的設計上，我們會分別舉例說明。
列表開關導航
運行效果如下:
關鍵代碼如下:
<relativelayout android:id="@+id/course_layout" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1">
<linearlayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centervertical="true" android:orientation="vertical">
<imageview android:id="@+id/course_image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:src="@drawable/book_normal">
<textview android:id="@+id/course_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:text="推薦" android:textcolor="#7597B3">
</textview></imageview></linearlayout>
</relativelayout>
可以看出,通過給RadioGroup和RadioButton設置backgroud屬性,可以使得RadioGroup設計出非常優雅的樣式。需要完整代碼的,單擊源碼下載
此處需要說明的是,第一個項目不是使用RadioGroup做出來的,其部分樣式如下:
<RelativeLayout
android:id="@+id/course_layout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:orientation="vertical" >
<ImageView
android:id="@+id/course_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="@drawable/book_normal" />
<TextView
android:id="@+id/course_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="推薦"
android:textColor="#7597B3" />
</LinearLayout>
</RelativeLayout>可以看到,此處使用線性佈局裏添加IamgeView和TextView組成,而第二個項目則是使用RadioGroup寫的,關鍵代碼如下:
<RadioButton
android:id="@+id/homeRb"
style="@style/main_tab_style"
android:checked="true"
android:drawableTop="@drawable/main_tab_home_img"
android:text="@string/nav_home"
android:textColor="@drawable/main_tab_text_color" />通過設置 drawableTop設置在文本上面添加圖片,同時設置文本顏色的切換效果,選中該項時,文字爲紅色,未選中時文字爲黑色.代碼如下:
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">
<item android:state_focused="true" android:color="@color/red"></item>
<item android:state_pressed="true" android:color="@color/red"></item>
<item android:state_selected="true" android:color="@color/red"></item>
<item android:state_checked="true" android:color="@color/red"></item>
<item android:color="@color/black"></item>
</selector>
RadioGroup的應用還很多，我在這裏希望起到拋磚引玉的作用,也希望大家自己多總結，多積累吧。最後歡迎大家和我一起討論學習，一起提高！