Recomendado

Cambiar imagen al hacer clic en un boton ~Android Studio~

Hoy vamos a ver como hacer algo que en sí, es muy sencillo, y es que tengamos una imagen de fondo en un botón, y al hacer clic sobre el se cambie la imagen, y a su vez, dependiendo de la imagen mostrada, haremos una cosa u otra, comenzamos.



Tendremos en nuestro activity.xml el botón, nuestro ejemplo será el siguiente:

  1. <Button
  2.  android:id="@+id/boton"
  3.  android:layout_width="wrap_content"
  4.  android:layout_height="wrap_content"
  5.  android:background="@drawable/1º_imagen"
  6.  android:onClick="pulsado"/>

Como veis hemos creado un botón que le hemos dado un id llamado botón y un método onclick que lo hemos llamado pulsado.

Ahora ya solo nos queda programar en java, que queremos que haga y que fondo le ponemos al hacer clic sobre dicho botón, veamos nuestro archivo MainActivity.java como quedaría:

En primer lugar crearemos un boolean y lo iniciaremos como verdadero.

  1. boolean boton_pulsado = true;
Este boolean lo utilizaremos para ir cambiando de verdadero a falso y así sucesivamente , y segun su estado actuaremos.


  1. public void pulsado(View view) {
        if (boton_pulsado){
           //aquí la acción 
        }
    
    }

Como veis al recibir el clic, lo primeros es comprobar el estado del boolean (true o false). Como cuando inicia la aplicación lo henos puesto en verdadero(true), comenzara con la imagen que le hemos iniciado, a partir de aquí es cuando le cambiamos la imagen , cambiamos el estado del boolean y le decimos que queremos que haga.

  1. public void pulsado(View view) {
        if (boton_pulsado){
            boton_pulsado= false;
            nuestro_boton.setBackgroundResource(R.drawable.2º_imagen);
           //aquí la acción que queramos
  2.     }
    
    }

Ya tenemos cambiado el boolean a false, la imagen de fondo la hemos cambiado y hemos realizado la acción que queríamos.
Ahora solo nos queda decirle que queremos que haga cuando haya cambiado la imagen, lo haríamos añadiendo el siguiente código.


  1. else {
        boton_pulsado = true;
    pulsado.setBackgroundResource(R.drawable.1º_imagen);
    //aquí la acción que queramos
        
  2. }

Ahora que teníamos el boolean en falso(false) lo hemos vuelto a pasar a verdadero(true) , hemos vuelto a poner la imagen que teníamos al inicio y hemos ejecutado la segunda acción.

Para que lo veáis mas claro voy a poner un ejemplo con un botón que utilizaremos para iniciar y parar una reproducción, botón play stop.



  1. public void pulsado(View view) {
        if (boton_pulsado){
            boton_pulsado = false;
            pulsado.setBackgroundResource(R.drawable.stop);
            //ponemos en marcha la reproducción
    
  2.         mMediaPlayer.play();
        }else {
            boton_pulsado = true;
            pulsado.setBackgroundResource(R.drawable.play);
            //paramos la reproducción 
  3.         mMediaPlayer.stop();
        }
    
    }

Como habéis visto es sencillo cambiar imagen del botón y además ejecutar una acción diferente según sea su imagen de fondo.

Espero que os sea útil.


Un saludo.






Entradas que pueden interesarte

Sin comentarios