Implementing Radio Button

0
1315

Hello friends!!! In this tutorial we are going to implement radio button.

  • All we will do in this tutorial is on clicking the specific radio button the text will be set to the specific button clicked .
  • So follow the Steps :
    1. Create a new project and for example name it as RadioButton.
    2. Your MainActivity and activity_main files will be generated respectively.
    3. Now go to your activity_main.xml file and in your graphical Layout take RadioGroup also take one LargeText in the layout .
    4. So now your activity_main.xml file graphical layout will as shown below :
    5. 1.1

    6. Now set the text of the TextView as -> android:text = “ ”
      So that the Large Text will not be seen on the layout.
    7. Also set the id of the RadioGroup as radioGroup
    8. Also set the text of the radio button’s as ONE ,TWO ,THREE in the strings.xml file
    9. So go to res->values->strings.xml.
    10. 2

    11. Click on the Add button
    12. In the Name column write : rb1Text and in the
      value column write : ONE (which will be displayed as text of the Radio button)
    13. Again click on the Add button and perform same steps for second and third button.
    14. The code of your activity_main.xml file is shown below :
    15. [code language=”xml”]<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingBottom="@dimen/activity_vertical_margin"
      android:paddingLeft="@dimen/activity_horizontal_margin"
      android:paddingRight="@dimen/activity_horizontal_margin"
      android:paddingTop="@dimen/activity_vertical_margin"
      tools:context=".MainActivity" >

      <RadioGroup
      android:id="@+id/radioGroup"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentLeft="true"
      android:layout_alignParentTop="true"
      android:layout_marginLeft="81dp"
      android:layout_marginTop="128dp" >

      <RadioButton
      android:id="@+id/rb1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:checked="true"
      android:text="@string/rb1Text" />

      <RadioButton
      android:id="@+id/rb2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/rb2Text" />

      <RadioButton
      android:id="@+id/rb3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/rb3Text" />
      </RadioGroup>

      <TextView
      android:id="@+id/textView1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignLeft="@+id/radioGroup"
      android:layout_below="@+id/radioGroup"
      android:layout_marginTop="51dp"
      android:text=""
      android:textAppearance="?android:attr/textAppearanceLarge" />

      </RelativeLayout>

      [/code]

    16. Your window will look like as shown below :
    17. 2
      3

    18. Now go to your MainActivity.Java file and let the Activity implement OnCheckedChangeListener .
    19. Create object of the RadioGroup as rGroup
    20. In onCreate( ) method write the code for getting the id of the radioGroup and set it to OnCheckedChangeListener.
    21. Where the code will be :
    22. [code language=”java”]protected void onCreate(Bundle savedInstanceState)
      {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      rGroup = (RadioGroup)findViewById(R.id.radioGroup);
      rGroup.setOnCheckedChangeListener(this);

      }

      [/code]

    23. Now write the code for the onCheckedChanged( )method for which the radio button when clicked will set the text to the respective radio button selected.
    24. The code is as follows :
    25. [code language=”java”]public void onCheckedChanged(RadioGroup group, int radioId)
      {
      // TODO Auto-generated method stub
      //get the id of the text view :
      TextView tv = (TextView)findViewById(R.id.textView1);
      RadioButton selected = (RadioButton)findViewById(radioId);
      String radioStr = selected.getText().toString();
      tv.setText(String.format("%s SELECTED.", radioStr));
      }
      [/code]

    26. Now your MainActivity.Java file will look as shown below :
    27. 4

    28. Now run your application and you will have following output :
    29. 5

    30. Now select TWO and you will have your text to be set to display “ TWO SELECTED “
    31. 6

    32. Thus we have implemented radio button successfully !!