Android: Utwórz przycisk przełączania z obrazem i bez tekstu

Question

czy można utworzyć przycisk przełączania w systemie Android, który ma obraz, ale bez tekstu? Idealnie byłoby to wyglądać tak:

Widziałem podobne posty w których odpowiedź była, aby zmienić tło, ale chcę zachować układ Holo lekki i po prostu zamienić tekst z obrazka.

muszę być w stanie programaticallly zmienić źródło obrazu,

Wszelkie pomysły jak ja byłoby to?

Jeśli to nie można zrobić, czy jest sposób, w jaki można włączać i wyłączać normalny przycisk?

Answer 1

1. mogę zastąpić tekst przełączania z obrazem

   Nie, nie możemy, chociaż możemy ukryć tekst overiding domyślny styl przycisku przełączającego, ale nadal nie będzie daj nam przełącznik, który chcesz, ponieważ nie możemy zastąpić tekstu obrazem.

2. Jak mogę zrobić normalny przycisk przełączania

   Utwórz plik ic_toggle w folderze res/drawable

   <selector xmlns:android="http://schemas.android.com/apk/res/android"> 
   
       <item android:state_checked="false" 
         android:drawable="@drawable/ic_slide_switch_off" /> 
   
       <item android:state_checked="true" 
         android:drawable="@drawable/ic_slide_switch_on" /> 
   
   </selector> 
   

   Tutaj @drawable/ic_slide_switch_on & @drawable/ic_slide_switch_off obrazy są tworzone.

   Następnie należy utworzyć inny plik w tym samym folderze, nazwać ic_toggle_bg

   <?xml version="1.0" encoding="utf-8"?> 
   <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
   
       <item android:id="@+android:id/background" 
         android:drawable="@android:color/transparent" /> 
   
       <item android:id="@+android:id/toggle" 
         android:drawable="@drawable/ic_toggle" /> 
   
   </layer-list> 
   

   teraz Dodaj do niestandardowego tematu, (jeśli nie masz utworzyć plik styles.xml w folderze res/values/)

   <style name="Widget.Button.Toggle" parent="android:Widget"> 
       <item name="android:background">@drawable/ic_toggle_bg</item> 
       <item name="android:disabledAlpha">?android:attr/disabledAlpha</item> 
   </style> 
   
   <style name="toggleButton" parent="@android:Theme.Black"> 
       <item name="android:buttonStyleToggle">@style/Widget.Button.Toggle</item> 
       <item name="android:textOn"></item> 
       <item name="android:textOff"></item> 
   </style> 
   

   Spowoduje to utworzenie niestandardowego przycisku przełączającego.

3. Jak używać

   Użyj niestandardowy styl i tło w widoku.

   <ToggleButton 
        android:id="@+id/toggleButton" 
        android:layout_width="wrap_content" 
        android:layout_height="match_parent" 
        android:layout_gravity="right" 
        style="@style/toggleButton" 
        android:background="@drawable/ic_toggle_bg"/> 
   

Answer 2

ToggleButton dziedziczy z TextView tak kanału alfa mają być wyświetlane w 4 granicami tekstu można ustawić.Można używać, aby wyświetlić żądaną ikonę na górze tekstu i ukryć rzeczywisty tekst

<ToggleButton 
    android:id="@+id/toggleButton1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:drawableTop="@android:drawable/ic_menu_info_details" 
    android:gravity="center" 
    android:textOff="" 
    android:textOn="" 
    android:textSize="0dp" /> 

Wynik porównaniu do zwykłej ToggleButton wygląda

Opcja sekund jest użycie ImageSpan, aby faktycznie zastąpić tekst obrazem. Wygląda trochę lepiej, ponieważ ikona jest we właściwej pozycji, ale nie można tego zrobić bezpośrednio za pomocą układu xml.

utworzyć zwykły ToggleButton

<ToggleButton 
    android:id="@+id/toggleButton3" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:checked="false" /> 

następnie ustawić „tekst” programmatially

ToggleButton button = (ToggleButton) findViewById(R.id.toggleButton3); 
ImageSpan imageSpan = new ImageSpan(this, android.R.drawable.ic_menu_info_details); 
SpannableString content = new SpannableString("X"); 
content.setSpan(imageSpan, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE); 
button.setText(content); 
button.setTextOn(content); 
button.setTextOff(content); 

Wynik tutaj w środku - ikona umieszczona jest nieco niższa, ponieważ zajmuje miejsce w tekście .

Answer 3

tworzyć toggle_selector.xml w RES/rozciągliwej

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

zastosować przełącznik do przycisku przełączania

<ToggleButton 
      android:id="@+id/chkState" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/toggle_selector" 
      android:textOff="" 
      android:textOn=""/> 

Uwaga: do usuwania tekstu Użyłem w powyższym kodzie

textOff="" 
textOn="" 

Answer 4

Wiem, że to trochę późno, ale dla każdego, kto zainteresowany, I utworzeniu niestandardowego komponentu, który jest po prostu przycisk przełączania obrazu The odkształcalne mogą mieć członkowskich, jak również tło

https://gist.github.com/akshaydashrath/9662072