Android基本控制項之RadioGroup

標籤：按鈕   log   方法   效果   顏色   content   表示   ppc   先來   

我們在手機上經常看到一堆選項，但是我們只能選擇一個，那麼在Android中，這個控制項就叫做RadioButton，也就是選項按鈕的意思，他們之所以能夠達到只能選擇一個的效果，是因為有一個RadioGroup這樣一個組件。

這次，我們就來詳細的解說一下RadioButton和RadioGroup這兩個控制項的關係和區別，以及如何去使它們默契的搭配在一起~

要實現RadioButton由兩部分組成，也就是RadioButton和RadioGroup配合使用，其中RdioGroup是單選組合框，可以容納多個RadioButton的一個容器。在沒有RadioGroup的情況下，RadioButton可以全部被選中；當多個RadioButton被RadioGroup包含的情況下，RadioButton只可以選擇一個，從而達到了單選的目的。並用setOnCheckChangeLinstener()來對選項按鈕進行監聽。

RadioGroup的相關屬性：

　　1.RadioGroup.getCheckedRadioButtonId();

　　　　該方法可以擷取選中的按鈕

　　2.RadioGroup.clearCheck();

　　　　該方法可以清除選中狀態

　　3.setOnCheckedChangeLintener(RadioGroup.OnCheckedChangeListener listener);

　　　　當一個選項按鈕組中的選項按鈕選中狀態發生改變的時候調用的回調方法

　　4.RadioGroup.check(int id);

　　　　該方法可以通過傳入ID來設定該選項為選中狀態

　　5.addView(View child,int index, ViewGroup.LayoutParams params);

　　　　使用指定布局參數添加一個字視圖（其中child是要添加的子視圖，index是將要添加子視圖的位置，params 所要添加的子視圖的布局參數）

　　6.RadioButton.getText();

　　　　擷取單選框的值

　　此外，RadioButton的checked屬性設定為true，代碼裡調用RadioButton的check(id)方法，不會觸發onCheckedChanged事件

然後，我們來看一下RadioButton和RadioGroup的關係：

　　　　1.RadioButton表示單個原型單選框，而RadioGroup是可以容納多個RadioButton的容器

　　　　2.每個RadioGroup中的RadioButton同時只能有一個被選中

　　　　3.不同的RadioGroup中的RadioButton互不相干，即如果組A中有一個選中了，那麼組B中依然可以有一個被選中。

　　　　4.在大部分場合下，一個RadioGroup中至少有兩個RadioButton

　　　　5.在大部分場合下，一個RadioGroup中的RadioButton預設會有一個被選中，並建議您將它放在RadioGroup的起始位置

我們繼續來看一下RadioButton和CheckBox的區別（是與CheckBox哦~）：

　　　　1.單個RadioButton選中之後，通過點擊無法變為未選中

　　　　　單個CheckBox在選中後，通過點擊可以變為未選中

　　　　2.一組RadioButton，只能同時選中一個

　　　　   一組CheckBox，能同時選中多個

　　　　3.RadioButton在大部分UI架構中預設都以圓形表示

　　　　　CheckBox在大部分UI架構中預設都以矩形表示

 

然後，我們來做一個小案例，來進一步的解釋說明RadioButton和RadioGroup

二話不說，我們先

  

今天哈，我們就用RadioButton和RadioGroup來實現我們上面的這個小案例。

　　首先，我們來分析一下，我們想要實現這個案例都需要準備寫什麼吧

我們根據上面的圖，我們能看出來，我們需要圖片~然而需要幾張呢？這裡事需要6張的哦！我們看起來是三張圖片，但是當我們點擊的時候，我們會發現圖片變色了， 這就是另一張圖片了。所以，我們需要準備6張圖片。

這是資源。

　　接下來，我們來分析一下，我們都需要建立什麼設定檔

不用想，我們首先必須要有一個主介面的布局檔案，並且放上三個RadioButton，用一個RadioGroup把這三個RadioButton包裹起來，並設定相應屬性

然後，我們還需要在drawable目錄下建立一個改變字型顏色的設定檔，和三個改變圖片的設定檔

　　然後，我們再來分析一下，在Activity中，我們應該如何去做

首先，我們需要擷取到這個RadioGroup，然後為其設定點擊事件，在點擊事件中，我們實現點擊按鈕彈出一個多士

好了，我們的分析就暫時到這裡，接下來，我們根據我們的分析來做具體的實現

第一步、我們先來建立主介面的布局檔案：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="application.smile.myapplicationdemo.MainActivity">        <RadioGroup        android:id="@+id/rg"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="@color/colorBackground"        android:orientation="horizontal">        <RadioButton            android:id="@+id/radioButton_xiaoxi"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/bottom_icon_iamge_selector_xiaoxi"            android:gravity="center"            android:text="訊息"            android:textColor="@drawable/bottom_icon_text_selector" />        <RadioButton            android:id="@+id/radioButton_lianxiren"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/buttom_icon_image_selector_lianxiren"            android:gravity="center"            android:text="連絡人"            android:textColor="@drawable/bottom_icon_text_selector" />        <RadioButton            android:id="@+id/radioButton_dongtai"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/bottom_icon_image_selector_dongtai"            android:gravity="center"            android:text="動態"            android:textColor="@drawable/bottom_icon_text_selector" />    </RadioGroup></LinearLayout>

在這裡，我們解釋一下其中上面沒有介紹到的屬性

　　android：drawableTop 屬性是用來將指定的圖片顯示到RadioButton的頂部，為了方便我們下面放文字

第二步、我們來看改變字型顏色的設定檔：

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_checked="false" android:color="@color/colorWhite"></item>　　這個是白色    <item android:state_checked="true" android:color="@color/colorRed"></item>　　　　這個是橘黃色</selector>

第三步、我們來看改變那三張圖片的設定檔：

改變“訊息”：

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

改變“連絡人”：

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

改變“動態”：

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

我們來詳細的看一下這些檔案中的屬性

　　其中android:state_checked 屬性是設定狀態的，如果是選中狀態，就為true，否則為false。後面對應的 android:drawable 屬性就是對應的圖片

第四步、我們來看Activity中的具體實現：

public class MainActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener{    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {            //通過findViewById()來找到我們需要的RadioGroup        RadioGroup radioGroup = (RadioGroup) findViewById(R.id.rg);            //設定狀態改變的事件        radioGroup.setOnCheckedChangeListener(this);    }    /**     * 重寫的狀態改變的事件的方法     * @param group 單選組合框     * @param checkedId 其中的每個RadioButton的Id     */    @Override    public void onCheckedChanged(RadioGroup group, int checkedId) {            //根據不同ID 彈出不同的多士        switch (group.getCheckedRadioButtonId()){            case  R.id.radioButton_xiaoxi:                Toast.makeText(this, "你點擊了“訊息”按鈕", Toast.LENGTH_SHORT).show();                break;            case  R.id.radioButton_lianxiren:                Toast.makeText(this, "你點擊了“連絡人”按鈕", Toast.LENGTH_SHORT).show();                break;            case  R.id.radioButton_dongtai:                Toast.makeText(this, "你點擊了“動態”按鈕", Toast.LENGTH_SHORT).show();                break;        }    }}

根據我們的思路，我們實現了這樣的一個小案例，我們來測試一下吧。

這樣，我們就完美的實現了我們的小案例。

 

讓程式寫入生命，將代碼融入靈魂

　　　　　　　　　　　　　　　　　　　　-------smile、zj

Android基本控制項之RadioGroup