Bagaimana cara mengatur gaya Android Switch?

121

Widget sakelar yang diperkenalkan di API 14 ditata secara default dengan tema holo. Saya ingin menatanya sedikit berbeda, mengubah warna dan bentuknya sedikit karena alasan pencitraan merek. Bagaimana seseorang melakukan ini? Saya tahu itu pasti mungkin, karena saya sudah melihat perbedaan antara ICS default dan tema touchwiz Samsung

masukkan deskripsi gambar di sini

Saya berasumsi bahwa saya memerlukan beberapa state drawable, dan saya telah melihat beberapa gaya di http://developer.android.com/reference/android/R.styleable.html dengan Switch_thumb dan Switch_track yang terlihat seperti yang saya inginkan . Saya hanya tidak tahu bagaimana cara menggunakannya.

Saya menggunakan ActionbarSherlock jika itu membuat perbedaan. Tentu saja, hanya perangkat yang menjalankan API v14 atau lebih tinggi yang dapat menggunakan sakelar.

— Glenn.nz
sumber

258

Anda bisa menentukan drawable yang digunakan untuk latar belakang, dan bagian switcher seperti ini:

<Switch
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:thumb="@drawable/switch_thumb"
    android:track="@drawable/switch_bg" />

Sekarang Anda perlu membuat selektor yang menentukan status berbeda untuk drawable switcher. Berikut salinan dari sumber Android:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:drawable="@drawable/switch_thumb_disabled_holo_light" />
    <item android:state_pressed="true"  android:drawable="@drawable/switch_thumb_pressed_holo_light" />
    <item android:state_checked="true"  android:drawable="@drawable/switch_thumb_activated_holo_light" />
    <item                               android:drawable="@drawable/switch_thumb_holo_light" />
</selector>

Ini mendefinisikan drawable jempol, gambar yang dipindahkan ke latar belakang. Ada empat gambar sembilanepatch yang digunakan untuk slider:

Versi yang dinonaktifkan (versi xhdpi yang digunakan Android)
Penggeser yang ditekan:
Penggeser yang diaktifkan (dalam keadaan):
Versi default (keadaan mati): masukkan deskripsi gambar di sini

Ada juga tiga status berbeda untuk latar belakang yang ditentukan dalam selektor berikut:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:drawable="@drawable/switch_bg_disabled_holo_dark" />
    <item android:state_focused="true"  android:drawable="@drawable/switch_bg_focused_holo_dark" />
    <item                               android:drawable="@drawable/switch_bg_holo_dark" />
</selector>

Versi yang dinonaktifkan:
Versi terfokus:
Dan versi default:

Untuk memiliki sakelar bergaya, cukup buat dua selektor ini, atur ke Tampilan Tukar Anda dan kemudian ubah tujuh gambar ke gaya yang Anda inginkan.

— Janusz
sumber

1

Terima kasih yang sangat detail, gambar slider 9-patch yang membiarkan bagian ibu jari keluar dari trek sangat membantu karena saya tidak tahu bagaimana mereka melakukannya. (slider default memiliki bit tepi runcing yang bergerak melewati ujung trek untuk membuat ujung persegi di satu sisi)

— Glenn.nz

2

Ada satu status lagi yaitu <item android: state_checked = "true"> yang dapat mengubah gambar trek saat sakelar dalam status "on". jadi jika Anda ingin mengubah trek menjadi "on" / "off", gunakan status ini.

— narangrajeev81

1

Bagaimana cara mengatur gaya warna teks untuk ibu jari? saya tidak dapat menemukannya di mana pun :(

— pojomx

1

@ pojun. Apakah Anda menemukan solusi untuk warna teks - yaitu warna teks aktif / nonaktif? Saya menghadapi masalah yang sama dan terjebak pada titik yang sama.

— Smeet

Untuk mengubah warna teks => android: switchTextAppearance = "@ style / mySwitchTextSyle"

— Andrew

50

Ini adalah balasan rinci yang luar biasa dari Janusz. Tetapi hanya demi orang-orang yang datang ke halaman ini untuk mendapatkan jawaban, cara yang lebih mudah adalah di http://android-holo-colors.com/ (tautan mati) ditautkan dari Android Asset Studio

Deskripsi yang bagus tentang semua alat ada di AndroidOnRocks.com (situs offline sekarang)

Namun, saya sangat menyarankan semua orang untuk membaca balasan dari Janusz karena akan membuat pemahaman lebih jelas. Gunakan alat ini untuk melakukan pekerjaan dengan sangat cepat

— kishu27
sumber

6

Penghemat waktu yang tepat. 9-patch, daftar negara yang dapat digambar, dll semuanya dalam satu klik!

— Steve

Jawaban ini sangat berguna. Saya ingin melihatnya diposting sebagai pertanyaan "alat untuk dengan mudah membuat kontrol holo android dengan warna kustom" dan jawaban yang diterima. Pengembang membutuhkan ini.

— Rachael

Saya yakin itu akan menjadi alat yang hebat ... sayangnya semua tautan mati

— Razvan_TK9692

3

Anda dapat menyesuaikan gaya material dengan mengatur properti warna yang berbeda. Misalnya tema aplikasi kustom

<style name="CustomAppTheme" parent="Theme.AppCompat">
    <item name="android:textColorPrimaryDisableOnly">#00838f</item>
    <item name="colorAccent">#e91e63</item>
</style>

Tema sakelar kustom

<style name="MySwitch" parent="@style/Widget.AppCompat.CompoundButton.Switch">
    <item name="android:textColorPrimaryDisableOnly">#b71c1c</item>
    <item name="android:colorControlActivated">#1b5e20</item>
    <item name="android:colorForeground">#f57f17</item>
    <item name="android:textAppearance">@style/TextAppearance.AppCompat</item>
</style>

Anda dapat menyesuaikan jalur peralihan dan mengganti jempol seperti gambar di bawah ini dengan menentukan drawable xml. Untuk informasi lebih lanjut http://www.zoftino.com/android-switch-button-and-custom-switch-examples

— Arnav Rao
sumber

1

Alternatif dan cara yang lebih mudah adalah dengan menggunakan bentuk daripada 9-patch. Sudah dijelaskan di sini: https://stackoverflow.com/a/24725831/512011

— netpork
sumber

idk, alat yang disebutkan dalam jawaban kishu27 jauh lebih cepat hanya dengan mengubah warna karena itu membuat semua file untuk Anda. Saya kira jika Anda ingin menyesuaikan bentuk selain warna meskipun ini mungkin lebih cepat.

— JStephen

Alat ini sangat hebat, meskipun, sejujurnya, saya tidak menyukai gagasan bahwa jika Anda hanya ingin mengubah warna sesuatu yang Anda butuhkan untuk menghasilkan banyak gambar. Selain itu, jika Anda menggunakan bentuk, Anda dapat memiliki warna yang berbeda untuk posisi sakelar mati / hidup.

— netpork

benar, jika Anda bimbang seperti saya dan terus mengubah warna sampai Anda menemukan yang Anda suka maka ini jauh lebih cepat, beruntung bagi saya orang lain yang bertanggung jawab untuk memilih warna :)

— JStephen