إضافة أزرار الاختيار إلى تطبيقك

تجربة ميزة "الكتابة"
‫Jetpack Compose هي مجموعة أدوات واجهة المستخدم المُقترَحة لنظام التشغيل Android. تعرَّف على كيفية إضافة مكوّنات في ميزة "الإنشاء".
أزرار الاختيار →

تسمح أزرار الاختيار للمستخدم باختيار خيار واحد من مجموعة من الخيارات التي يستبعد أحدها الآخر. استخدِم أزرار الاختيار إذا كان المستخدم بحاجة إلى الاطّلاع على كل الخيارات المتاحة مرتبة. إذا لم يكن من الضروري عرض جميع الخيارات، استخدِم أداة اختيار بدلاً من ذلك.

مثال على أزرار الاختيار من material.io
الشكل 1. مثال على أزرار الاختيار من التصميم المتعدّد الأبعاد

لإنشاء كل خيار من خيارات زر الاختيار، أنشئ رمزًا RadioButton في تنسيقك. بما أنّ أزرار الاختيار لا يمكن استخدامها مع بعضها، اجمعها داخل a RadioGroup. يضمن النظام إمكانية اختيار زر اختيار واحد فقط ضمن مجموعة في كل مرة.

الردّ على أحداث النقر

عندما يختار المستخدم زر اختيار، يتلقّى عنصر RadioButton المقابل حدث النقر.

يوضّح المثال التالي تفاعلًا مع نقر المستخدم على عنصر RadioButton في مجموعة:

<?xml version="1.0" encoding="utf-8"?>
<RadioGroup
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
    <RadioButton android:id="@+id/radio_pirates"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Pirates"/>
    <RadioButton android:id="@+id/radio_ninjas"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Ninjas"/>
</RadioGroup>

ضمن Activity أو Fragment الذي يستضيف هذا التنسيق، ابحث عن أزرار الاختيار واضبط مستمع تغييرات لكل منها على النحو التالي:

Kotlin

findViewById<RadioButton>(R.id.radio_pirates).setOnCheckedChangeListener { buttonView, isChecked ->
    Log.d("RADIO", "Pirates is checked: $isChecked")
}

findViewById<RadioButton>(R.id.radio_ninjas).setOnCheckedChangeListener { buttonView, isChecked ->
    Log.d("RADIO", "Ninjas is checked: $isChecked")
}

Java

findViewById<RadioButton>(R.id.radio_pirates).setOnCheckedChangeListener { buttonView, isChecked ->
    Log.d("RADIO", "Pirates is checked: $isChecked");
}

findViewById<RadioButton>(R.id.radio_ninjas).setOnCheckedChangeListener { buttonView, isChecked ->
    Log.d("RADIO", "Ninjas is checked: $isChecked");
}

في هذا المثال، عندما ينقر المستخدم على أحد الأزرار الاختيارية، تتم طباعة رسالة في Logcat.