Pulsante di attivazione Android look personalizzato

Question

Ho cercato di personalizzare l'aspetto del pulsante di attivazione, ma senza successo. Ecco come voglio farlo sembrare come:

Qualcuno può darmi un tutorial?

Answer 1

Creare selettore

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

e usarlo come sfondo per il tuo ToggleButton.

Answer 2

Penso che sia necessario definire uno sfondo personalizzato per il pulsante. Dai un'occhiata alla Guida per gli sviluppatori sulla personalizzazione di Button's background.

Tuttavia, nella fase tre, Creare un nuovo file XML nella res/drawable/ directory Utilizzare questa Xml:

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

L'elemento android:state_checked="true" è ciò che definisce questo stato come sfondo selezionato.

Fatemi sapere se questo funziona per voi.

Answer 3

creare toggle_selector.xml in res/drawable

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

applicano il selettore al pulsante di commutazione

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

Nota: per rimuovere il testo ho usato seguente nel codice sopra

textOff="" 
textOn="" 

Answer 4

Non so se questa è la soluzione migliore ma ha funzionato bene per me:

1.- Decidi quanto è grande il pulsante di attivazione/disattivazione. Nel mio caso larghezza 56dp e altezza 76dp.

2.- Creare il set di icone 56px 76px-per MDPI, 84px-113px hdpi, lo stesso per xhdpi e xxhdpi

3.- Spostare le icone nella cartella corrispondente drawable. Nel mio caso 20 icone 5 di ogni cartella, denominata ic_name1_on, ic_name1_off [...] ic_name5_off

4.- creare i seguenti file XML in una nuova cartella denominata disegnabile (se non esiste ancora):

• ic_name1_toggle.xml
• ic_name1_toggle_bg.xml
• ic_name2_toggle.xml
• (...)
• ic_name5_toggle_bg.xml

5.- In ic_name1_toggle.xml il codice deve essere:

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

6.- Nel ic_name1_toggle_bg.xml il codice deve essere:

<?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_name1_toggle" /> 
</layer-list> 

7.- Infine nel layout.xml:

<ToggleButton 
       android:id="@+id/toggleButton1" 
       android:layout_width="56dp" 
       android:layout_height="76dp" 
       android:background="@android:color/transparent" 
       android:button="@drawable/ic_name1_toggle_bg" 
       android:textOff="" 
       android:textOn="" />