Como crear un diálogo ‘AlertDialog ‘

En Android tienes la posibilidad de mostrar diálogos al usuario, sea solo para mostrarle información, o pedirle que seleccione una opción. Esto se puede conseguir con muy poquitas líneas de código gracias al componente AlertDialog.

Básicamente un AlertDialog es una ventana superpuesta a toda la aplicación en la que se muestra un mensaje, oscureciendo ligeramente el fondo para centrar la atención del usuario.

Existen variaciones en los diálogos tipo AlertDialog, tienes la opción de mostrar uno o varios botones de acción que permitirán obtener la respuesta del usuario

Vamos a ver como crear un AlertDialog sencillo.

AlertDialog con un botón

        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setTitle("Titulo");
        builder.setMessage("Mensaje");
        builder.setPositiveButton("Aceptar", null);       

        AlertDialog dialog = builder.create();
        dialog.show();

Con la primera línea creamos el objeto AlertDialog.Builder pasándole el contexto del Activity actual. Seguidamente se le da la el contenido del título y el mensaje a mostrar, incluyendo el texto que se mostrará como botón.

Una vez lleno, se crea el propio AlertDialog a partir del builder que tenías y se muestra con .show().

Como ves es muy sencillo crear el diálogo. Vamos a ver ahora como añadirle hasta 3 botones diferentes.

AlertDialog con dos botones

        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setTitle("AlertDialog 2 botones");
        builder.setMessage("¿Quieres cerrar la app?");        

        builder.setPositiveButton("Aceptar", null);
        builder.setNegativeButton("Cancelar", null);        
        AlertDialog dialog = builder.create();
        dialog.show();

Como ves, con respecto al primer ejemplo, solo tienes que añadir .setNegativeButton(«»,»»);

AlertDialog con tres botones

En el caso de los tres botones, solo será necesario añadir al builder el método «.setNeutralButton(«»,»»);»

AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setTitle("Morfeo dice:");
        builder.setMessage("¿Qué píldora quieres Neo?\n\nLa azul te hará olvidar lo ocurrido y volverás a Matrix, mientras que la roja te llevará al mundo real.");        // add the buttons
        builder.setPositiveButton("La Roja", null);
        builder.setNeutralButton("Recordar más tarde", null);
        builder.setNegativeButton("La azul", null);        
        AlertDialog dialog = builder.create();
        dialog.show();

Y como puedes comprobar, cuando el texto de los botones de demasiado largo para entrar en pantalla, él mismo se dispone de manera vertical.

Controlando el evento de los botones

En los ejemplos anteriores, cada vez que añadías un botón el segundo parametro era null. Ahí es donde debe ir un DialogInterface.OnClickListener(). De manera que si lo implementamos en el código de los tres botones quedaría algo así:

builder.setPositiveButton("La Roja", new DialogInterface.OnClickListener() {
    @Override
    public void onClick(DialogInterface dialog, int which) {        
        ComerPildora();
    }
});

Deberás realizar las funciones del botón dentro del método «onClick()» creado.

Cambiar el color del botón del AlertDialog

Por defecto el color de los botones de un AlertDialog es el mismo que el «colorAccent» definido en el archivo colors.xml en el directorio «res > values». Puedes cambiar el color cambiando el valor hexadecimal que pertenece a «colorAccent».

 #D81B60

Esta acción no solo cambiará el color de los botones de los AlertDialog, sino que también cambiará los demás componentes de tu app que hagan referencia a ese color. Puedes crear un tema personalizado en el archivo styles.xml y luego utilizarlo como tema en tu AlertDialog.

Primero de todo, crea un color nuevo en el archivo colors.xml:

 #90E714

Ahora en el archivo styles.xml crea un nuevo tema incluyendo una referencia al color que has creado antes:

Ahora, cada vez que crees un nuevo AlertDialog, además de pasarle el contexto de la Actividad actual, le añadirás una referencia al nuevo tema creado:

AlertDialog.Builder builder = new AlertDialog.Builder(this, R.style.TemaAlertDialog);

Como ves es muy sencillo crear un AlertDialog y añadirle los botones, pero no se queda aquí la cosa, también puedes mostrar una lista de elementos en el lugar del mensaje. Si quieres que el usuario seleccione una opción entre X posibles, la lista es la mejor opción para ello.

Puedes ver cómo utilizar una lista de opciones en este artículo:

¡Nos vemos en el siguiente artículo!