Inicio Android Notificaciones en Android (I): Toast

Notificaciones en Android (I): Toast

por sgoliver

Un tema rápido antes de seguir con el Curso de Programación Android que estamos realizando. En Android existen varias formas de notificar mensajes al usuario, como por ejemplo los cuadros de diálogo modales o las notificaciones de la bandeja del sistema (o barra de estado). Pero en este artículo nos vamos a centrar en primer lugar en la forma más sencilla de notificación: los llamados Toast.

Un toast es un mensaje que se muestra en pantalla durante unos segundos al usuario para luego volver a desaparecer automáticamente sin requerir ningún tipo de actuación por su parte, y sin recibir el foco en ningún momento (o dicho de otra forma, sin interferir en las acciones que esté realizando el usuario en ese momento). Aunque son personalizables, aparecen por defecto en la parte inferior de la pantalla, sobre un rectángulo gris ligeramente translúcido. Por sus propias características, este tipo de notificaciones son ideales para mostrar mensajes rápidos y sencillos al usuario, pero por el contrario, al no requerir confirmación por su parte, no deberían utilizarse para hacer notificaciones demasiado importantes.

Su utilización es muy sencilla, concentrándose toda la funcionalidad en la clase Toast. Esta clase dispone de un método estático makeText() al que deberemos pasar como parámetro el contexto de la actividad, el texto a mostrar, y la duración del mensaje, que puede tomar los valores LENGTH_LONG o LENGTH_SHORT, dependiendo del tiempo que queramos que la notificación aparezca en pantalla. Tras obtener una referencia al objeto Toast a través de este método, ya sólo nos quedaría mostrarlo en pantalla mediante el método show().

Vamos a construir una aplicación de ejemplo para demostrar el funcionamiento de este tipo de notificaciones. Y para empezar vamos a incluir un botón que muestre un toast básico de la forma que acabamos de describir:

btnDefecto.setOnClickListener(new OnClickListener() {
	@Override
	public void onClick(View arg0) {
		Toast toast1 =
			Toast.makeText(getApplicationContext(),
					"Toast por defecto", Toast.LENGTH_SHORT);

		toast1.show();
	}
});

Si ejecutamos esta sencilla aplicación en el emulador y pulsamos el botón que acabamos de añadir veremos como en la parte inferior de la pantalla aparece el mensaje «Toast por defecto», que tras varios segundos desaparecerá automáticamente.

toast-por-defecto

Como hemos comentado, éste es el comportamiento por defecto de las notificaciones toast, sin embargo también podemos personalizarlo un poco cambiando su posición en la pantalla. Para esto utilizaremos el método setGravity(), al que podremos indicar en qué zona deseamos que aparezca la notificación. La zona deberemos indicarla con alguna de las constantes definidas en la clase Gravity: CENTER, LEFT, BOTTOM, … o con alguna combinación de éstas.

Para nuestro ejemplo vamos a colocar la notificación en la zona central izquierda de la pantalla. Para ello, añadamos un segundo botón a la aplicación de ejemplo que muestre un toast con estas características:

btnGravity.setOnClickListener(new OnClickListener() {
	@Override
	public void onClick(View arg0) {
		Toast toast2 =
			Toast.makeText(getApplicationContext(),
					"Toast con gravity", Toast.LENGTH_SHORT);

		toast2.setGravity(Gravity.CENTER|Gravity.LEFT,0,0);

		toast2.show();
	}
});

Si volvemos a ejecutar la aplicación y pulsamos el nuevo botón veremos como el toast aparece en la zona indicada de la pantalla:

toast-gravity

Si esto no es suficiente y necesitamos personalizar por completo el aspecto de la notificación, Android nos ofrece la posibilidad de definir un layout XML propio para toast, donde podremos incluir todos los elementos necesarios para adaptar la notificación a nuestras necesidades. para nuestro ejemplo vamos a definir un layout sencillo, con una imagen y una etiqueta de texto sobre un rectángulo gris:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/lytLayout"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="horizontal"
  android:background="#555555"
  android:padding="5dip" >

    <ImageView android:id="@+id/imgIcono"
    	android:layout_height="wrap_content"
    	android:layout_width="wrap_content"
    	android:src="@drawable/marcador" />

    <TextView android:id="@+id/txtMensaje"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:layout_gravity="center_vertical"
    	android:textColor="#FFFFFF"
    	android:paddingLeft="10dip" />

</LinearLayout>

Guardaremos este layout con el nombre «toast_layout.xml«, y como siempre lo colocaremos en la carpeta «res\layout» de nuestro proyecto.

Para asignar este layout a nuestro toast tendremos que actuar de una forma algo diferente a las anteriores. En primer lugar deberemos inflar el layout mediante un objeto LayoutInflater, como ya vimos en varias ocasiones al tratar los artículos de interfaz gráfica. Una vez construido el layout modificaremos los valores de los distintos controles para mostrar la información que queramos. En nuestro caso, tan sólo modificaremos el mensaje de la etiqueta de texto, ya que la imagen ya la asignamos de forma estática en el layout XML mediante el atributo android:src. Tras esto, sólo nos quedará establecer la duración de la notificación con setDuration() y asignar el layout personalizado al toast mediante el método setView(). Veamos cómo quedaría todo el código incluido en un tercer botón de ejemplo:

btnLayout.setOnClickListener(new OnClickListener() {
	@Override
	public void onClick(View arg0) {
		Toast toast3 = new Toast(getApplicationContext());

		LayoutInflater inflater = getLayoutInflater();
		View layout = inflater.inflate(R.layout.toast_layout,
						(ViewGroup) findViewById(R.id.lytLayout));

		TextView txtMsg = (TextView)layout.findViewById(R.id.txtMensaje);
		txtMsg.setText("Toast Personalizado");

		toast3.setDuration(Toast.LENGTH_SHORT);
		toast3.setView(layout);
		toast3.show();
	}
});

Si ejecutamos ahora la aplicación de ejemplo y pulsamos el nuevo botón, veremos como nuestro toast aparece con la estructura definida en nuestro layout personalizado.

toast-personalizado

Como podéis comprobar, mostrar notificaciones de tipo Toast en nuestras aplicaciones Android es algo de lo más sencillo, y a veces resultan un elemento de lo más interesante para avisar al usuario de determinados eventos.

Puedes consultar y/o descargar el código completo de los ejemplos desarrollados en este artículo accediendo a la página del curso en GitHub.

Curso de Programación Android en PDF

Este curso también está disponible en PDF. Descubre cómo conseguirlo…

¿Te ha sido de utilidad el Curso de Programación Android? ¿Quieres colaborar de forma económica con el proyecto? Puedes contribuir con cualquier cantidad, unos céntimos, unos euros, cualquier aportación será bienvenida. Además, si tu aportación es superior a una pequeña cantidad simbólica recibirás como agradecimiento un documento con la última versión del curso disponible en formato PDF. Sea como sea, muchas gracias por colaborar!

Más información:

También te puede interesar

20 comentarios

Desarrollo en Android | sgoliver.net blog 09/06/2011 - 15:55

[…] Notificaciones en Android: Toast [Nuevo!] […]

Responder
leodufer 28/06/2011 - 20:08

Primeramente felicitaciones por el blog, esta de 10…. mi duda es como se podría crear un toast personalizado con los bordes redondeados como en el toast por defecto?
saludos

Responder
sgoliver 29/06/2011 - 8:20

Puedes hacerlo definiendo un nuevo recurso XML de tipo Shape con bordes redondeados (propiedad ) y después utilizarlo como fondo (android:background) de tu toast personalizado.

Puedes encontrar información sobre esto en la documentación de Android:

http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape

Saludos.

Responder
Victor 02/07/2011 - 1:27

Hey pss muchas feicidades!! esta excelente todo lo que publicas dia con dia yo tuve la oportunidad de recibir en pdf los temas y pss te quedaron muy bn!! Solo que aa me quede esperando las TabActivity jeje espero que un dia de estos puedas hacer un articulo sobre esto estuve buscando y pues la vdd hay agunas cosas que no logre entender del todo, gracias por este gran esfuerzo.

Responder
Royal 09/07/2011 - 12:52

Felicitaciones por el blog! todo super claro, me esta ayudando muchisimo en el curso que estoy haciendo sobre android, este blog es super complementario, obviamente voy a donarte un par de pavos para poder tener en pdf esta super biblia que para mi me es imprescindible!! muchas gracias por tu trabajo

Responder
Notificaciones en Android (III): Diálogos | sgoliver.net blog 27/12/2011 - 11:16

[…] alternativas a la hora de mostrar notificaciones a los usuarios de nuestra aplicaciones: los toast y las notificaciones de la barra de estado. En este último artículo sobre notificaciones vamos a […]

Responder
Markus 09/10/2012 - 22:21

Hola,
Este último ejemplo con un layout personalizado, no me deja poner un texto al lado de la imagen en:
TextView txtMsg = (TextView)layout.findViewById(R.id.txtMensaje);
txtMsg.setText(«Toast Personalizado»);

A todo el mundo le funciona si es copiar y pegar
Gracias por todo.

Responder
Stanley 05/06/2013 - 14:50

Buen tuto, amigo este código me sirve cuando lo corro en el emulador, pero cuando lo empaqueto y lo instalo en el dispositivo no muestra ni los Toast ni los AlertDialog, sabes por que será?? habrá que modificar algún xml??

Responder
Notificaciones en Android (II): Barra de Estado | sgoliver.net blog 16/07/2013 - 21:31

[…] este curso un primer mecanismo de notificaciones disponibles en la plataforma Android: los llamados Toast. Como ya comentamos, este tipo de notificaciones, aunque resultan útiles y prácticas en muchas […]

Responder
jorge 11/12/2013 - 1:19

che hermano como descargo tus proyectos

Responder
oscar 12/12/2013 - 15:40

De repente me ha aparecido muy toast es message pero no se ni como se ha puesto ni como quitar. me podrías ayudar?

Responder
wolmedo 09/05/2014 - 15:31

excelente. muchas gracias.

Responder
Luna 14/04/2015 - 18:15

Como le hago para que un toast salga en un marcador de un mapa al dar clic? El codigo lo estoy haciendo en php y lapag web la metere a un webview

Responder
Crear notificicaciones Toast | JCristobal 28/04/2015 - 9:56

[…] Para más información sobre los toast puedes consultar esta página. […]

Responder
Crear notificaciones Toast | JCristobal 29/04/2015 - 9:18

[…] Para más información sobre los toast puedes consultar esta página. […]

Responder
pablo hdz 14/05/2015 - 15:46

me marca error en:

btnLayout.»setOnClickListener»(new «OnClickListener»() {
» @Override»
public void onClick(View «arg0″) {

y en :

(ViewGroup) findViewById(R.id.»lytLayout»));

porque me marca error xd ???

Responder
pablo hdz 14/05/2015 - 15:47

lo que esta entre comillas es lo que me marca error

Responder
Notificaciones en Android (IV): Snackbar | sgoliver.net blog 01/06/2015 - 19:43

[…] para mostrar feedback sobre alguna operación realizada por el usuario, y es similar a un toast en el sentido de que aparece en pantalla por un corto periodo de tiempo y después desaparece […]

Responder
Leo 04/11/2015 - 15:27

Hola saludos, antes felicidades por el tutorial. Disuclpa, me podrìas ayudar en saber como puedo mostrar un Toast desde una clase que no es mi actividad principal?. Se que si lo declaro en dicha clase, me marca un error.
De antemano muchas gracias. Saludos

Responder
RicardoOro96 09/02/2017 - 16:04

Como puedo bloquear el toas ya que le doy clic afuera y se cierra

Responder

Dejar un comentario

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información. Aceptar Más Información

Política de Privacidad y Cookies