devstory

Le Tutoriel de Android RadioGroup et RadioButton

  1. RadioButton & RadioGroup
  2. L'exemple avec RadioGroup & RadioButtons
  3. Phụ lục: Thiết kế giao diện

1. RadioButton & RadioGroup

RadioButton est un view dans Android, il est souvent utilisé avec RadioGroup. Dans lequel RadioGroup est un conteneur (container) comprenant des RadioButton, lorsque vous cochez et choisissez un bouton radio en groupe, tous les autres boutons radio du groupe seront désélectionnés(deselect).

Ci- dessous sont des images de RadioButton qui ont regroupé dans différents groupes.
RadioGroup peut exposer des RadioButton horizontallement ou verticalement.

2. L'exemple avec RadioGroup & RadioButtons

Example preview:
Créez le projet baptisé AndroidRadioDemo.
  • File > New > New Project > Empty Activity
    • Name: AndroidRadioDemo
    • Package name: org.o7planning.androidradiodemo
    • Language: Java
L'interface de l'application:
If you are interested in the steps to design the interface of this application, please see the appendix at the end of the article.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="19dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Game Settings"
        android:textSize="24sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="0dp"
        android:layout_height="30dp"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="19dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Game character"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

    <RadioGroup
        android:id="@+id/radioGroup_character"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="12dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView2">

        <RadioButton
            android:id="@+id/radioButton_male"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Male" />

        <RadioButton
            android:id="@+id/radioButton_female"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Famale" />
    </RadioGroup>

    <TextView
        android:id="@+id/textView3"
        android:layout_width="0dp"
        android:layout_height="29dp"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="24dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Difficulty Level"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/radioGroup_character" />

    <RadioGroup
        android:id="@+id/radioGroup_diffLevel"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="24dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:orientation="horizontal"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView3">

        <RadioButton
            android:id="@+id/radioButton_easy"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:text="Easy" />

        <RadioButton
            android:id="@+id/radioButton_medium"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:text="Medium" />

        <RadioButton
            android:id="@+id/radioButton_hard"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:text="Hard" />
    </RadioGroup>

    <Button
        android:id="@+id/button_save"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:text="Save"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/radioGroup_diffLevel" />
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.java
package org.o7planning.androidradiodemo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.CompoundButton;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    private RadioGroup radioGroupCharacter;
    private RadioButton radioButtonMale;
    private RadioButton radioButtonFemale;

    private RadioGroup radioGroupDiffLevel;
    private RadioButton radioButtonEasy;
    private RadioButton radioButtonMedium;
    private RadioButton radioButtonHard;

    private Button buttonSave;

    private String LOGTAG = "AndroidRadioDemo";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //
        this.radioGroupCharacter= (RadioGroup) this.findViewById(R.id.radioGroup_character);
        this.radioButtonMale = (RadioButton) this.findViewById(R.id.radioButton_male);
        this.radioButtonFemale  =  (RadioButton)this.findViewById(R.id.radioButton_female);
        this.radioButtonMale.setChecked(true);

        //
        this.radioGroupDiffLevel= (RadioGroup) this.findViewById(R.id.radioGroup_diffLevel);
        this.radioButtonEasy = (RadioButton) this.findViewById(R.id.radioButton_easy);
        this.radioButtonMedium  =  (RadioButton)this.findViewById(R.id.radioButton_medium);
        this.radioButtonHard =  (RadioButton)this.findViewById(R.id.radioButton_hard);
        this.radioButtonMedium.setChecked(true);

        this.buttonSave= (Button) this.findViewById(R.id.button_save);

        // When radio group "Difficulty Level" checked change.
        this.radioGroupDiffLevel.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                doOnDifficultyLevelChanged(group, checkedId);
            }
        });

        // When radio button "Female" checked change.
        this.radioButtonMale.setOnCheckedChangeListener(new RadioButton.OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                doOnGameCharacterChanged(buttonView,isChecked);
            }
        });

        // When radio button "Male" checked change.
        this.radioButtonFemale.setOnCheckedChangeListener(new RadioButton.OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                doOnGameCharacterChanged(buttonView,isChecked);
            }
        });

        // When button "Save" clicked.
        this.buttonSave.setOnClickListener(new Button.OnClickListener() {
            @Override
            public void onClick(View v) {
                doSave();
            }
        });
    }


    // When radio group "Difficulty Level" checked change.
    private void doOnDifficultyLevelChanged(RadioGroup group, int checkedId) {
        int checkedRadioId = group.getCheckedRadioButtonId();

        if(checkedRadioId== R.id.radioButton_easy) {
            Toast.makeText(this,"You choose the level of difficulty: Easy",Toast.LENGTH_SHORT).show();
        } else if(checkedRadioId== R.id.radioButton_medium ) {
            Toast.makeText(this,"You choose the level of difficulty: Medium",Toast.LENGTH_SHORT).show();
        } else if(checkedRadioId== R.id.radioButton_hard) {
            Toast.makeText(this,"You choose the level of difficulty: Hard",Toast.LENGTH_SHORT).show();
        }
    }

    // When radio button checked change.
    private void doOnGameCharacterChanged(CompoundButton buttonView, boolean isChecked)  {
        RadioButton radio =(RadioButton) buttonView;

        Log.i(LOGTAG, "RadioButton "+ radio.getText()+" : "+ isChecked);
    }

    // When button "Save" clicked.
    private void doSave()  {
        int difficultyLevel = this.radioGroupDiffLevel.getCheckedRadioButtonId();
        int gameCharacter = this.radioGroupCharacter.getCheckedRadioButtonId();

        RadioButton radioButtonDiffLevel = (RadioButton) this.findViewById(difficultyLevel);
        RadioButton radioButtonGameCharacter = (RadioButton) this.findViewById(gameCharacter);

        String message ="Difficulty Level: "+ radioButtonDiffLevel.getText()
                +", Game Character: " + radioButtonGameCharacter.getText() ;

        Toast.makeText(this,message,Toast.LENGTH_LONG).show();
    }
}

3. Phụ lục: Thiết kế giao diện

Set the font size for the first TextView, and set the horizontal orientation for the second RadioGroup.
Add RadioButton(s) to the interface:
Set ID, Text for components on the interface.

Tutoriels de programmation Android

Show More