Bir Android Switch'i nasıl şekillendirebilirim?


121

API 14'te sunulan anahtar widget'ı varsayılan olarak holo temasıyla tasarlanmıştır. Markalaşma nedenleriyle biraz farklı bir stil vermek, renklerini değiştirmek ve biraz şekil vermek istiyorum. Bu nasıl yapılır? Varsayılan ICS ile Samsung'un touchwiz teması arasındaki farkı gördüğüm için bunun mümkün olması gerektiğini biliyorum.

görüntü açıklamasını buraya girin

Bazı durum çekilebilir öğelerine ihtiyacım olacağını varsayıyorum ve http://developer.android.com/reference/android/R.styleable.html'de Switch_thumb ve Switch_track ile birlikte daha sonra olabileceğim gibi görünen birkaç stil gördüm . Onları nasıl kullanacağımı bilmiyorum.

Bu bir fark yaratırsa ActionbarSherlock kullanıyorum. Elbette, yalnızca API v14 veya üstünü çalıştıran cihazlar bir anahtarı kullanabilir.

Yanıtlar:


258

Arka plan için kullanılan çekmeceleri ve anahtarlayıcı kısmını şu şekilde tanımlayabilirsiniz:

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

Şimdi, anahtarlayıcı çekmecesi için farklı durumları tanımlayan bir seçici oluşturmanız gerekir. İşte Android kaynaklarından alınan kopyalar:

<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>

Bu, arka plan üzerinde hareket ettirilen başparmağın çekilebilir görüntüsünü tanımlar. Kaydırıcı için kullanılan dört dokuzpatch görüntüsü vardır :

Devre dışı bırakılmış sürüm (Android'in kullandığı xhdpi sürümü) Devre dışı bırakılan versiyon
Basılan kaydırıcı: Preslenmiş kaydırıcı
Etkinleştirilmiş kaydırıcı (açık durum): Etkinleştirilmiş kaydırıcı
Varsayılan sürüm (kapalı durum):görüntü açıklamasını buraya girin

Aşağıdaki seçicide tanımlanan arka plan için ayrıca üç farklı durum vardır:

<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>

Devre dışı bırakılmış sürüm: Devre dışı bırakılan versiyon
Odaklanmış sürüm: Odaklanmış versiyon
Ve varsayılan sürüm:varsayılan sürüm

Tarzlı bir anahtara sahip olmak için bu iki seçiciyi oluşturun, bunları Anahtar Görünümü'ne ayarlayın ve ardından yedi resmi istediğiniz stile değiştirin.


1
Çok detaylı teşekkürler, başparmağın bir kısmının pistin dışına çıkmasına izin veren 9 yama kaydırıcı görüntüleri, bunu nasıl yaptıklarını çözemediğim için özellikle yardımcı oldu. (varsayılan kaydırıcı, bir tarafta kare bir uç oluşturmak için yolun sonunu geçen sivri uçlu bitlere sahiptir)
Glenn.nz

2
Anahtar "açık" durumdayken izleme görüntüsünü değiştirebilen <item android: state_checked = "true"> olan bir durum daha var. bu nedenle parçayı "açık" / "kapalı" olarak değiştirmek istiyorsanız, bu durumu kullanın.
narangrajeev81

1
Başparmak için metin rengini nasıl biçimlendirebilirim? hiçbir yerde bulamıyorum :(
pojomx

1
@ pojomx. Metin rengi için herhangi bir çözüm buldunuz mu - yani açık / kapalı metin rengi? Aynı sorunla karşı karşıyayım ve aynı noktada sıkıştım.
Smeet'in

Metin rengini değiştirmek için => android: switchTextAppearance = "@ style / mySwitchTextSyle"
Andrew

50

Janusz'dan harika ayrıntılı bir cevap. Ancak yalnızca yanıtlar için bu sayfaya gelen kişilerin iyiliği için, daha kolay yol, Android Asset Studio'dan bağlanan http://android-holo-colors.com/ (ölü bağlantı) adresindedir.

Tüm araçların iyi bir açıklaması AndroidOnRocks.com'da (şu anda site çevrimdışı)

Bununla birlikte, Janusz'dan gelen cevabı, anlayışı daha net hale getireceği için herkesin okumasını şiddetle tavsiye ediyorum. İşleri çok hızlı yapmak için aracı kullanın


6
Harika zaman tasarrufu. 9 yama, durum listesi çekilebilir öğeleri, vb. Hepsi tek bir tıklamayla!
Steve

Bu cevap o kadar kullanışlıdır ki, "özel renge göre kolayca android sanal kontroller oluşturmaya yarayan bir araç" sorusu ve kabul edilen bir cevap olarak yayınlanmasını isterim. Geliştiricilerin buna ihtiyacı var.
Rachael

Eminim bu harika bir araç olurdu ... tüm bağlantılar ne yazık ki öldü
Razvan_TK9692

3

Farklı renk özelliklerini ayarlayarak malzeme stillerini özelleştirebilirsiniz. Örneğin özel uygulama teması

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

Özel anahtar teması

<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>

Sen edebilir makas değiştirir ve anahtar başparmak özelleştirmek xml drawables tanımlayarak resmin altında gibi. Daha fazla bilgi için http://www.zoftino.com/android-switch-button-and-custom-switch-examples

özel anahtar izi ve başparmak


1

Alternatif ve çok daha kolay yol, 9 yama yerine şekiller kullanmaktır. Zaten burada açıklanmıştır: https://stackoverflow.com/a/24725831/512011


idk, kishu27'nin cevabında bahsedilen araç, tüm dosyaları sizin için oluşturduğu için sadece rengi değiştirmek için çok daha hızlıydı. Rengin yanı sıra şekli de özelleştirmek isteseydiniz sanırım bu muhtemelen daha hızlıdır.
JStephen

Araç gerçekten harika, ancak açıkçası, bir şeyin rengini değiştirmek istiyorsanız, bir sürü görüntü oluşturmanız gerektiği fikrine pek düşkün değilim. Ayrıca, şekiller kullanıyorsanız, kapalı / açık anahtar konumları için farklı renklere sahip olabilirsiniz.
netpork

doğru, eğer benim gibi kararsızsanız ve beğendiğiniz birini bulana kadar rengini değiştirmeye devam ederseniz, o zaman bu çok daha hızlı, benim için başka biri renkleri seçmekle görevli :)
JStephen
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.