Ubah warna Lingkaran tombol radio


158

Saya ingin mengubah warna lingkaran RadioButton di salah satu proyek saya , saya tidak bisa mengerti properti mana yang harus diatur. Warna latar belakang yang saya miliki adalah hitam sehingga tidak terlihat. Saya ingin mengatur warna lingkaran menjadi putih.



Gunakan dua gambar untuk tombol radio satu dipilih dan yang lainnya tidak, memotong gambar ini pada klik Radiobutton baik dengan menggunakan sumber daya setbackground atau dengan menggunakan pemilih xml.
SAURABH_12

Jawaban:


288

Lebih sederhana, cukup atur warna buttonTint: (hanya berfungsi pada api level 21 atau lebih tinggi)

<RadioButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/radio"
    android:checked="true"
    android:buttonTint="@color/your_color"/>

di nilai Anda / colors.xml masukkan warna Anda dalam kasus ini yang kemerahan:

<color name="your_color">#e75748</color>

Hasil:

Tombol Radio Android Berwarna

Jika Anda ingin melakukannya dengan kode (juga api 21 ke atas):

if(Build.VERSION.SDK_INT>=21)
{

    ColorStateList colorStateList = new ColorStateList(
            new int[][]{

                    new int[]{-android.R.attr.state_enabled}, //disabled
                    new int[]{android.R.attr.state_enabled} //enabled
            },
            new int[] {

                    Color.BLACK //disabled
                    ,Color.BLUE //enabled

            }
        );                       


    radio.setButtonTintList(colorStateList);//set the color tint list
    radio.invalidate(); //could not be necessary
}

1
@emaillenin, jika Anda ingin mengubah warna warna dengan kode Anda harus menggunakan di control.getDrawable().setColorFilter(getResources().getColor(color), PorterDuff.Mode.SRC_IN);mana controlkontrol Anda ingin mengubah warna dan colormerupakan nilai integer dari warna yang Anda inginkan misalnyaR.color.red
Jorge Arimany

1
@JorgeArimany Untuk RadioButton, apakah getButtonDrawable atau getCompoundDrawables? getCompoundDrawables mengembalikan Daftar
Lenin Raj Rajasekaran

@emaillenin, terima kasih, jawaban saya untuk komentar Anda adalah untuk kontrol lain seperti tombol, saya telah meningkatkan jawaban saya dengan menambahkan kode yang Anda cari, semoga membantu Anda
Jorge Arimany

3
@JorgeArimany Saya sudah bekerja untuk> 21 sudah .. Saya mencari jawaban khusus untuk <21
Lenin Raj Rajasekaran

Untuk mengubah warna tombol yang dicentang, Anda dapat menambah atau mengganti status dengan android.R.attr.state_checkeddan menambahkan warna.
6rchid

159

Pembaruan: 1. gunakan yang ini sebagai gantinya

   <android.support.v7.widget.AppCompatRadioButton
        android:id="@+id/rbtn_test"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:buttonTint="@color/primary" />

2. Kemudian tambahkan baris ini ke tata letak induk atau Alt + Enterdi Android Studio untuk ditambahkan secara otomatis xmlns:app="http://schemas.android.com/apk/res-auto"

Contoh minimum akan terlihat seperti ini:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.AppCompatRadioButton
        android:id="@+id/rbtn_test"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:buttonTint="@color/primary" />

</LinearLayout>

3. Dalam program Anda, harus memanggil seperti ini. AppCompatRadioButton radioButton = (AppCompatRadioButton) view.findViewById(R.id.rbtn_test);

Pada dasarnya, pola seperti ini dapat diterapkan untuk semua jenis AppCompact seperti AppCompatCheckBox, AppCompatButton dan sebagainya.

Jawaban lama:

Untuk mendukung Android 21 API di bawah ini, Anda dapat menggunakan AppCompatRadioButton. Kemudian gunakan setSupportButtonTintListmetode untuk mengubah warna. Ini adalah cuplikan kode saya untuk membuat tombol radio.

    AppCompatRadioButton rb;
    rb = new AppCompatRadioButton(mContext);

    ColorStateList colorStateList = new ColorStateList(
            new int[][]{
                    new int[]{-android.R.attr.state_checked},
                    new int[]{android.R.attr.state_checked}
            },
            new int[]{

                    Color.DKGRAY
                    , Color.rgb (242,81,112),
            }
    );
    rb.setSupportButtonTintList(colorStateList);

Hasil yang diuji di API 19:

Yang ini diuji pada API 19

Lihat tautan referensi android untuk detail lebih lanjut.


10
Jawaban ini harus diterima. Jika Anda ingin menambahkan tombol radio dukungan ini melalui xml, gunakan<android.support.v7.widget.AppCompatRadioButton ../>
Vinayak Garg

22
setSupportButtonTintListadalah metode pribadi yang tidak dimaksudkan untuk Anda gunakan. Tombol radio akan berperilaku aneh pada versi Android tertentu. Sebaliknya, gunakan CompoundButtonCompat.setButtonTintList(rb, colorStateList).
wampastompa

2
@wampastompa benar. Di API 22, hasilnya adalah saya hanya melihat lingkaran luar, tidak pernah terisi ketika diperiksa. @aknay; perbarui jawaban Anda
Nino van Hooff

1
Saya menggunakan API 16. Saya menambahkan tombol Radio AppCompat seperti yang tercantum di atas, namun masih belum ditampilkan dengan benar.
tccpg288

1
Anda tidak memerlukan kode apa pun, lihat jawaban IgorOliveira. Bekerja untuk semua versi.
Kirill Karmazin

77
<android.support.v7.widget.AppCompatRadioButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:buttonTint="@color/Color" />

11
Ini adalah jawaban untuk perangkat lollypop pra, saat ini, dan pos !! Hebat
sdelvalle57

1
Ini harus menjadi jawaban yang diterima. Pendek dan sempurna. CATATAN: gunakan aplikasi: buttonTint = "@ color / Color" tetapi tidak andoid: buttonTint = "@ color / Color"!
Kirill Karmazin

@ KirillKarmazin yang diterima harus yang berfungsi untuk <21
user924

56

Bekerja pada API pra 21 serta pos 21. Di tempat Anda styles.xml:

<!-- custom style -->
<style name="radionbutton"
       parent="Base.Widget.AppCompat.CompoundButton.RadioButton">
    <item name="android:button">@drawable/radiobutton_drawable</item>
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowIsFloating">false</item>
    <item name="android:backgroundDimEnabled">true</item>
</style>

Anda radio buttondi xml akan terlihat seperti:

<RadioButton
    android:layout_width="wrap_content"
    style="@style/radionbutton"
    android:checked="false"
    android:layout_height="wrap_content"
    />

Sekarang yang perlu Anda lakukan adalah membuat radiobutton_drawable.xmldi drawable folder. Inilah yang perlu Anda masukkan ke dalamnya:

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

Anda radio_unchecked.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="oval">
  <stroke android:width="1dp" android:color="@color/colorAccent"/>
  <size android:width="30dp" android:height="30dp"/>
</shape>

Anda radio_checked.xml:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item>
    <shape android:shape="oval">
      <stroke android:width="1dp" android:color="@color/colorAccent"/>
      <size android:width="30dp" android:height="30dp"/>
    </shape>
  </item>
  <item android:top="5dp" android:bottom="5dp" android:left="5dp" android:right="5dp">
    <shape android:shape="oval">
      <solid android:width="1dp" android:color="@color/colorAccent"/>
      <size android:width="10dp" android:height="10dp"/>
    </shape>
  </item>
</layer-list>

Ganti saja @color/colorAccentdengan warna pilihan Anda.


Bagaimana saya melakukan ini secara terprogram?
tccpg288

@ tccpg288 Jika Anda menggunakan xml ini dan jika Anda ingin mengubah warna secara pemrograman, cukup gunakan radioButton.setChecked (false) atau radioButton.setChecked (true)
Vaibhav Sharma

Saya tidak mengerti pertanyaan Anda. Bisakah Anda jelaskan?
Vaibhav Sharma

Kesalahan saya, apakah penting jika saya menggunakan RadioButton biasa atau AppBompat RadioButton?
tccpg288

1
Ini tidak berfungsi, bagaimana ketika saya menginisialisasi RadioButton? Ini kode saya: mPollAnswerArrayList.add ((indexCreated), RadioButton baru ((getActivity (). GetApplicationContext ()), null, R.style.radiobutton));
tccpg288

18

Anda harus menggunakan kode ini:

<android.support.v7.widget.AppCompatRadioButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:buttonTint="@color/black"
                    android:text="Radiobutton1"
                    app:buttonTint="@color/black" />

Menggunakan app:buttonTintbukannya android:buttonTintdan juga android.support.v7.widget.AppCompatRadioButtonbukannya Radiobutton!


16
  1. Nyatakan gaya khusus di file styles.xml Anda.

    <style name="MyRadioButton" parent="Theme.AppCompat.Light">  
      <item name="colorControlNormal">@color/indigo</item>
      <item name="colorControlActivated">@color/pink</item>
    </style>  
  2. Terapkan gaya ini ke RadioButton Anda melalui atribut android: theme.

    <RadioButton  
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:checked="true"
        android:text="Radio Button"
        android:theme="@style/MyRadioButton"/>

    hanya jika aktivitas Anda meluas AppCompatActivity


1
Ini harus diterima sebagai jawaban, ini berfungsi pada semua versi dan ini paling bersih
Antonis Radz

Saya harus menggunakannya <item name="android:colorControlActivated">@color/pink</item>agar bisa bekerja untuk saya. Saya masih tidak yakin mengapa. Kalau tidak, ini jawaban yang bagus.
Taylor Venissat

16

Untuk di bawah API 21

Buat gaya kustom RadioButton style.xml

 <style name="RadioButton" parent="Theme.AppCompat.Light">
     <item name="colorAccent">@color/green</item>
     <item name="android:textColorSecondary">@color/mediumGray</item>
     <item name="colorControlNormal">@color/red</item>
 </style>

Dalam tata letak menggunakan tema:

<RadioButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:theme="@style/RadioButton" />

Untuk API 21 dan lebih banyak lagi

Cukup gunakan tombolTint

 <RadioButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:buttonTint="@color/green" />

Harus diklarifikasi: buttonTint berfungsi untuk API 21 dan aplikasi yang menggunakan AppCompat / AndroidX, apa pun API
Chisko

12

Pertanyaannya sudah lama tetapi saya pikir jawaban saya akan membantu orang. Anda dapat mengubah warna tombol radio yang tidak dicentang dan diperiksa dengan menggunakan gaya dalam xml.

<RadioButton
    android:id="@+id/rb"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:theme="@style/RadioButtonStyle" />

Di style.xml

<style name="RadioButtonStyle" parent="Theme.AppCompat.Light">
        <item name="colorAccent">@android:color/white</item>
        <item name="android:textColorSecondary">@android:color/white</item>
</style>

Anda dapat mengatur warna yang diinginkan dalam gaya ini.


Tema di dalam RadioButton tidak berfungsi (lagi?). Itu crash saat mengklik tombol, karena metode onClick tidak ditemukan, meskipun ada di sini.
Bevor

masalah ini akan memiliki beberapa alasan lain. Pastikan Anda mendapatkan ID tampilan yang benar sebelum menerapkan onClick pada tampilan itu.
Jaura

9

Atur buttonTintproperti. Sebagai contoh android:buttonTint="#99FF33",.


9
Ini hanya setelah API 21
miracle-doh

7

Saya membuatnya dengan cara singkat seperti ini (Bekerja pada API pra 21 serta pos 21)

Tombol radio Anda di xml akan terlihat seperti ini

  <RadioButton android:id="@+id/radioid"                    
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"                 
                android:button="@drawable/radiodraw" />

di radiodraw.xml

  <?xml version="1.0" encoding="utf-8"?>
  <selector xmlns:android="http://schemas.android.com/apk/res/android">    
      <item android:state_checked="false" >
          <shape  android:shape="oval" >
              <stroke android:width="1dp" android:color="#000"/>
              <size android:width="30dp" android:height="30dp"/>
              <solid android:color="@android:color/transparent"/>
          </shape>
      </item>
      <item android:state_checked="true">
          <layer-list>
              <item>
                  <shape android:shape="oval">
                      <stroke android:width="1dp" android:color="#000"/>
                      <size android:width="30dp" android:height="30dp"/>
                      <solid android:color="@android:color/transparent"/>
                  </shape>
              </item>
              <item android:top="5dp" android:bottom="5dp" android:left="5dp" android:right="5dp">
                  <shape android:shape="oval">
                      <solid android:width="1dp" android:color="#000"/>
                      <size android:width="10dp" android:height="10dp"/>
                  </shape>
              </item>
          </layer-list>
      </item>
  </selector>

harus menambahkan warna transparan untuk menggambar status yang tidak dicentang, selain itu menggambar oval hitam pekat.


6

Terkadang Anda hanya perlu mengganti colorControlNormal seperti ini:

    <style name="RadioButtonStyle" parent="AppTheme">
       <item name="colorControlNormal">@color/pink</item>
       <item name="colorAccent">@color/colorPrimary</item>
       <item name="android:textColorSecondary">@color/black</item>
    </style>

Dan Anda akan mendapatkan tombol seperti ini:

masukkan deskripsi gambar di sini

colorControlNormal digunakan untuk keadaan tidak dicentang dan colorAccent untuk diperiksa.


5

Ada atribut xml untuknya:

android:buttonTint="yourcolor"

Pastikan min API Anda lebih tinggi dari 21 atau ini tidak akan berfungsi
Jcorretjer

Anda dapat menggunakan ini untuk kompatibilitas mundur: app: buttonTint = "your_color"
Mridul Das

"Make sure your min API is higher then 21 or this won't work"itu salah. Saya menargetkan API 17 dengan AndroidX dan ini adalah satu-satunya yang bekerja untuk saya
Chisko

3

Bagi mereka yang ingin mengubah keadaan dinonaktifkan, dicentang dan diaktifkan, Anda melakukan langkah-langkah berikut:

<!-- Or androidX radio button or material design radio button -->
<android.support.v7.widget.AppCompatRadioButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:buttonTint="@color/black"
                    android:text="Radiobutton1"
                    app:buttonTint="@color/radio_button_color" />

lalu di folder res warna buat file bernama "radio_button_color.xml":

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/yellow900" android:state_selected="true" />
    <item android:color="@color/yellow800" android:state_checked="true" />
    <item android:color="@color/gray800" android:state_enabled="false" />
    <item android:color="@color/yellow800" android:state_enabled="true" />
</selector>

2
<RadioButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/radio"
    android:buttonTint="@color/my_color"/>

Semua tombol akan berubah warna, kotak lingkaran dan centang pusat.


1
Tapi bukan riak ;-)
Waza_Be

1

RadioButton secara default mengambil warna colorAccent dalam file res / values ​​/ colors.xml. Jadi buka file itu dan ubah nilainya

<color name="colorAccent">#3F51B5</color>

dengan warna yang Anda inginkan.


0

Cara termudah adalah dengan mengubah colourAccentwarna values->colours.xml
tetapi perlu diketahui bahwa itu juga akan mengubah hal-hal lain seperti mengedit warna kursor teks dll.

< color name="colorAccent">#75aeff</color >


0

Jika Anda ingin mengatur warna berbeda untuk tombol radio yang diklik dan tidak diklik, gunakan saja:

   android:buttonTint="@drawable/radiobutton"  in xml of the radiobutton and your radiobutton.xml will be:  
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#1E88E5"/>
<item android:state_checked="true" android:color="#00e676"/>
<item android:color="#ffffff"/>


0

cukup gunakan android:buttonTint="@color/colorPrimary"atribut pada tag, semoga membantu


0

Saya punya masalah ini. Jika aplikasi Anda memiliki latar belakang hitam dan Anda memiliki banyak RadioButtons yang tidak terlihat karena latar belakangnya, sulit untuk mengedit android: buttonTint masing-masing, solusi terbaik adalah mengubah tema induk di file styles.xml Anda

aku berubah

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

untuk

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">

Jadi lingkaran RadioButtons menjadi warna abu-abu yang lebih terang dan sekarang mereka terlihat bahkan dengan latar belakang hitam.

Ini adalah file style.xml saya:

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>


-4

@ jh314 benar. Di AndroidManifest.xml,

 <application
    android:allowBackup="true"
    android:icon="@drawable/icon"
    android:label="@string/app_name"
    android:theme="@style/AppTheme"></application>

Di style.xml

  <!-- Application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorAccent">@color/red</item>
    <!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>

nama item harus colorAccent, itu menentukan warna default widget aplikasi.

Tetapi jika Anda ingin mengubah warna dalam kode, mungkin jawaban @ aknay benar.


Ini tidak memberikan jawaban untuk pertanyaan itu. Setelah memiliki reputasi yang cukup, Anda dapat mengomentari setiap pos ; alih-alih, berikan jawaban yang tidak memerlukan klarifikasi dari penanya . - Dari Ulasan
semirturgay

Jawaban saya adalah mengubah warna dasar aplikasi dan tentu saja itu dapat mengubah warna radiobutton menjadi putih.
Iturbo
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.