Cómo mostrar alertas amigables en Android

Cómo mostrar alertas amigables en Android

Nuestro amigo Samsungner de la India, Imtiyaz Khalani, nos trae un excelente tutorial con el que aprenderemos a mostrar elegantes ventanas emergentes en nuestra aplicación Android, hemos traducido el artículo al castellano, pero puedes consultar el original aquí

UI es uno de los aspectos más importantes en el desarrollo de apps para Android. En este sentido, te recomiendo usar pequeñas animaciones en el desarrollo de la aplicación. Al respecto, esta librería te ayudará a crear notificaciones atractivas.

Teniendo en cuenta que el usuario interactúa con la aplicación a través de la interfaz, los principios del diseño se deben de tener muy en cuenta. Estos principios, también llamados principios de la heurística, son principios generales y que pueden resultar de gran utilidad.

Hay varias librerías libres de código abierto disponibles en Android. Estas son algunas:

  1. sweet alert
  2. SweetDialog 2

Para usar la librería sweet alert en tu proyecto, necesitas añadir la siguiente dependencia:


compile 'cn.pedant.sweetalert: library: 1.3'

Usa el siguiente código para mostrar las diferentes variantes del alert.


Alerta simple

 

Sweet Alert Dialog in android 1

new SweetAlertDialog(this)
 .setTitleText("Here's a message!")
 .show();

Alerta simple con descripción

Sweet Alert Dialog in android 2

new SweetAlertDialog(this)
 .setTitleText("Here's a message!")
 .setContentText("It's pretty, isn't it?")
 .show();

Mensaje de error

Sweet Alert Dialog in android 3

 

new SweetAlertDialog(this, SweetAlertDialog.ERROR_TYPE)
    .setTitleText("Oops...")
    .setContentText("Something went wrong!")
    .show();

Mensaje de warning

Sweet Alert Dialog in android 4

 



new SweetAlertDialog(this, SweetAlertDialog.WARNING_TYPE)
 .setTitleText("Are you sure?")
 .setContentText("Won't be able to recover this file!")
 .setConfirmText("Yes,delete it!")
 .show();

Mensaje de éxito

Sweet Alert Dialog in android 5

new SweetAlertDialog (this, SweetAlertDialog.SUCCESS_TYPE)
 .setTitleText ("Good job!")
 .setContentText ("You clicked the button!")
 .Show();

Mensaje con icono personalizado

Sweet Alert Dialog in android 6

 

new SweetAlertDialog(this, SweetAlertDialog.CUSTOM_IMAGE_TYPE)
 .setTitleText("Sweet!")
 .setContentText("Here's a custom image.")
 .setCustomImage(R.drawable.custom_img)
 .show();

Enlaza el listener al botón de confirmación:

new SweetAlertDialog(this, SweetAlertDialog.WARNING_TYPE)
 .setTitleText("Are you sure?")
 .setContentText("Won't be able to recover this file!")
 .setConfirmText("Yes,delete it!")
 .setConfirmClickListener(new SweetAlertDialog.OnSweetClickListener() {
 @Override
 public void onClick(SweetAlertDialog sDialog) {
 sDialog.dismissWithAnimation();
 }
 })
 .show();

 


Muestra el botón Cancelar y enlaza un listener a él:


new SweetAlertDialog(this, SweetAlertDialog.WARNING_TYPE)
 .setTitleText("Are you sure?")
 .setContentText("Won't be able to recover this file!")
 .setCancelText("No,cancel plx!")
 .setConfirmText("Yes,delete it!")
 .showCancelButton(true)
 .setCancelClickListener(new SweetAlertDialog.OnSweetClickListener() {
 @Override
 public void onClick(SweetAlertDialog sDialog) {
 sDialog.cancel();
 }
 })
 .show();


Cambia el estilo del dialog después de confirmar


new SweetAlertDialog(this, SweetAlertDialog.WARNING_TYPE)
 .setTitleText("Are you sure?")
 .setContentText("Won't be able to recover this file!")
 .setConfirmText("Yes,delete it!")
 .setConfirmClickListener(new SweetAlertDialog.OnSweetClickListener() {
 @Override
 public void onClick(SweetAlertDialog sDialog) {
 sDialog
 .setTitleText("Deleted!")
 .setContentText("Your imaginary file has been deleted!")
 .setConfirmText("OK")
 .setConfirmClickListener(null)
 .changeAlertType(SweetAlertDialog.SUCCESS_TYPE);
 }
 })
 .show();

SPECIAL THANKS TO https://github.com/pedant/sweet-alert-dialog

Some good UI of android deisgn on android teachers Here

Mr. Android Developer

Autor: Imtiyaz Khalani

Share This Post On

Deja un comentario

A %d blogueros les gusta esto:
Bitnami