Est-il possible de changer l'icône du bouton radio dans un groupe de boutons radio Android


95

Je souhaite permettre à l'utilisateur de mon application Android de définir certains paramètres. Le bouton radio est idéal pour cette situation. Cependant, je n'aime pas que les boutons radio soient rendus.

Est-il possible de changer l'icône du bouton radio? Par exemple, est-il possible de créer une mise en page personnalisée pour chaque ligne et dans cette mise en page, faites référence à ma propre icône et changez la police et al.

Réponses:


168

Oui, c'est possible, vous devez définir votre propre style pour les boutons radio, à res / values ​​/ styles.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CustomTheme" parent="android:Theme">
   <item name="android:radioButtonStyle">@style/RadioButton</item>
</style>
<style name="RadioButton" parent="@android:style/Widget.CompoundButton.RadioButton">
   <item name="android:button">@drawable/radio</item>
</style>
</resources>

'radio' ici devrait être un dessinable avec état, radio.xml:

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:state_window_focused="false"
        android:drawable="@drawable/radio_hover" />
    <item android:state_checked="false" android:state_window_focused="false"
        android:drawable="@drawable/radio_normal" />
    <item android:state_checked="true" android:state_pressed="true"
        android:drawable="@drawable/radio_active" />
    <item android:state_checked="false" android:state_pressed="true"
        android:drawable="@drawable/radio_active" />
    <item android:state_checked="true" android:state_focused="true"
        android:drawable="@drawable/radio_hover" />
    <item android:state_checked="false" android:state_focused="true"
        android:drawable="@drawable/radio_normal_off" />
    <item android:state_checked="false" android:drawable="@drawable/radio_normal" />
    <item android:state_checked="true" android:drawable="@drawable/radio_hover" />
    </selector>

Ensuite, appliquez simplement le thème personnalisé à l'ensemble de l'application ou aux activités de votre choix.

Pour plus d'informations sur les thèmes et les styles, consultez http://brainflush.wordpress.com/2009/03/15/understanding-android-themes-and-styles/ qui est un bon guide.


13
Vous pouvez également simplement définir la propriété android: button sur le bouton radio lui-même, plutôt que de lui définir un style personnalisé distinct.
Yoni Samlan

7
C'est vrai, mais ce n'est pas une très bonne pratique, car vous avez généralement plus d'un bouton radio.
Konstantin Burov

@KonstantinBurov Et si j'utilise une image de patch 9?
Hadès

@KonstantinBurov Sauf si vous ajoutez des boutons par programme, auquel cas c'est génial :)
Cornholio

1
Pour le support, le thème peut souhaiter utiliser <style name = "CustomTheme" parent = "android: Theme"> <item name = "android: radioButtonStyle"> @ style / RadioButton </item> <item name = "radioButtonStyle"> @ style / RadioButton </item> </style>
Dhruv Mevada

30

Vous pouvez mettre une image personnalisée dans le bouton radio comme le bouton normal. pour cela, créez un fichier XML dans un dossier pouvant être dessiné, par exemple

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/sub_screens_aus_hl" 
    android:state_pressed="true"/>  
<item android:drawable="@drawable/sub_screens_aus" 
    android:state_checked="true"/>  
<item android:drawable="@drawable/sub_screens_aus" 
    android:state_focused="true" />
<item android:drawable="@drawable/sub_screens_aus_dis" />  
</selector> 

Ici, vous pouvez utiliser 3 images différentes pour le bouton radio

et utilisez ce fichier pour RadioButton comme:

android:button="@drawable/aus"
android:layout_height="120dp"
android:layout_width="wrap_content" 

13

Le moyen le plus simple de ne changer que le bouton radio est simplement de définir le sélecteur pour dessiner à droite

<RadioButton
    ...
    android:button="@null"
    android:checked="false"
    android:drawableRight="@drawable/radio_button_selector" />

Et le sélecteur est:

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

C'est tout


1
Meilleure solution, pour mon cas, j'ai également changé 'drawableRight' en 'button' et ajouté un peu de remplissage au sélecteur xml
F-1

C'est la meilleure solution. J'ai été utilisé de cette manière et cela fonctionne bien.Mais après la migration vers andoidx android: button = "@ null" ne fonctionne pas et nous voyons deux icône de bouton radio pour chaque élément! .
maniaq

1

oui .... `de Xml

android:button="@drawable/yourdrawable" 

et depuis Java

myRadioButton.setButtonDrawable(resourceId or Drawable);

»


0

Voici probablement une approche rapide,

entrez la description de l'image ici

Avec deux icônes affichées ci-dessus, vous aurez RadioGroupquelque chose comme ça

entrez la description de l'image ici

  • changer l RadioGroup'orientation de l' en horizontal
  • pour chacune RadioButtondes propriétés, essayez de donner l'icône pour Button sous CompoundButton,
  • ajuster le rembourrage et la taille,
  • et définissez l'attribut Arrière-plan lorsqu'il est coché.

0

Au cas où vous voudriez le faire par programme,

checkBoxOrRadioButton.setButtonDrawable(null);
checkBoxOrRadioButton.setBackgroundResource(R.drawable.resource_name);
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.