Pulsante di attivazione / disattivazione utilizzando due immagini in uno stato diverso


101

Devo creare un pulsante di attivazione / disattivazione utilizzando due immagini invece dello stato ON / OFF.

Nello stato off ho impostato un'immagine di sfondo, ma il testo OFF non può essere rimosso mentre uso l'immagine di sfondo.

E non posso impostare un'altra immagine sullo stato ON facendo clic sul pulsante di attivazione / disattivazione :( Sono nuovo in Android. Spero che voi ragazzi mi aiutiate a uscire da questo problema


Risposte:


219

Fai questo:

<ToggleButton 
        android:id="@+id/toggle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/check"   <!--check.xml-->
        android:layout_margin="10dp"
        android:textOn=""
        android:textOff=""
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:layout_centerVertical="true"/>

creare check.xml nella cartella disegnabile

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- When selected, use grey -->
    <item android:drawable="@drawable/selected_image"
          android:state_checked="true" />
    <!-- When not selected, use white-->
    <item android:drawable="@drawable/unselected_image"
        android:state_checked="false"/>

 </selector>

1
Aggiungi due immagini (selezionate / non selezionate) in check.xml che funzioneranno come due diversi stati del pulsante di
attivazione /

19
Hai avuto problemi con l'allungamento dello sfondo?
Mike Bevz

2
android: textOn = "" android: textOff = "" era quello che stavo cercando
png

9
Poiché sembra che anche altri abbiano avuto questo problema, aggiungo la mia soluzione qui. Aggiungi android:background="@null"e android:drawableRight="@drawable/check". Di solito ho scoperto che i pulsanti di attivazione / disattivazione sono giustificati a destra. Se ti serve giustificato a sinistra, usaandroid:drawableLeft
Patrick

1
@Patrick Ma cosa succede se vuoi che il centro sia giustificato? ... su tutti i dispositivi. Quindi non entriamo nei margini e nel padding.
Martin Erlic

47

La soluzione di AkashG non funziona per me. Quando imposto check.xml sullo sfondo è solo stratched in direzione verticale. Per risolvere questo problema devi impostare check.xml sulla proprietà "android: button":

<ToggleButton 
    android:id="@+id/toggle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:button="@drawable/check"   //check.xml
    android:background="@null"/>

check.xml:

<?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- When selected, use grey -->
    <item android:drawable="@drawable/selected_image"
          android:state_checked="true" />
    <!-- When not selected, use white-->
    <item android:drawable="@drawable/unselected_image"
          android:state_checked="false"/>
    </selector>

10
ToggleButton ha CompoundButton padre. E CompoundButton ha android: attributo button: developer.android.com/reference/android/…
MistaGreen

3
Questa dovrebbe essere la risposta corretta. La risposta accettata risulta in drawables allungati.
Bamerza

Se le immagini hanno trasparenza, android:background="@android:color/transparent"possono essere utilizzate
Pavel

@Bamerza, no anche questo non si applica a tutti i casi. Se lo provi con .svg otterrai uno sfondo allungato.
Farid

2

Puoi provare qualcosa di simile. Qui, facendo clic sul pulsante dell'immagine, attiva la visualizzazione dell'immagine.

holder.imgitem.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View view) {
            if(!onclick){
            mSparseBooleanArray.put((Integer) view.getTag(), true);
            holder.imgoverlay.setImageResource(R.drawable.ipad_768x1024_editmode_delete_overlay_com);
            onclick=true;}
            else if(onclick)
            {
                 mSparseBooleanArray.put((Integer) view.getTag(), false);
                  holder.imgoverlay.setImageResource(R.drawable.ipad_768x1024_editmode_selection_com);

            onclick=false;
            }
        }
    });
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.