Toast

De MediaWiki
Saltar a: navegación, buscar

Introdución

  • Un Toast proporciona un simple feedback de algo que pasa na aplicación a través dunha pequena mensaxe popup.
  • Chámaselle así "Tostada" porque aparece na pantalla do mesmo xeito que as tostadas saltan na torradora cando están feitas.

00 toast.png

  • So usa o espazo que precise a mensaxe e a pantalla actual permanece visible.
  • Desaparecen automaticamente pasado un pequeno espazo de tempo.


  • Para usar o Toast:
  1. Context context = getApplicationContext();
  2. CharSequence text = "Hello toast!";
  3. int duration = Toast.LENGTH_SHORT;
  4.  
  5. Toast toast = Toast.makeText(context, text, duration);
  6. toast.show();
  • Context: é un interface que permite acceder aos recursos da nosa aplicación
  • duration:
    • LENGTH_SHORT: constante que equivale a 2 segundos
    • LENGTH_LONG: constante que equivale a 3,5 segundos


  • As liñas 5 e 6 anteriores poden ser substituídas pola seguinte:
  1. Toast.makeText(context, text, duration).show();


Caso práctico

Se non o temos creado antes, crea un paquete de nome UI como un subpaquete do teu paquete principal.
Dentro do paquete UI, crearemos un novo paquete de nome: Toasts.



  • Dentro do paquete Toasts crear unha nova 'Empty Activity' de nome: UD02_01_Toast de tipo Launcher e sen compatibilidade.
Modifica o arquivo AndroidManifiest.xml e engade unha label á activity como xa vimos na creación do proxecto base.


  • Collendo como base a primeira versión da aplicación dos planetas: U2_12_Spinner.
  • Simplemente agora a nova aplicación ten unha entrada máis ao principio do Spinner Selecciona un planeta.



Arquivo de recursos: array_planetas.xml

  • Copiamos o ficheiro array_planetas.xml ubicado en /res/values/ dunha aplicación á outra.
  • Engadimos un ítem ao principio:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <resources>
  3.  
  4.     <string-array name="planetas_UD02_01_spinner">
  5.         <item>Mercurio</item>
  6.         <item>Venus</item>
  7.         <item>Terra</item>
  8.         <item>Marte</item>
  9.         <item>Xúpiter</item>
  10.         <item>Saturno</item>
  11.         <item>Urano</item>
  12.         <item>Neptuno</item>
  13.     </string-array>
  14.  
  15.     <string-array name="planetas_UD02_01_toast">
  16.         <item>Selecciona un planeta</item>
  17.         <item>Mercurio</item>
  18.         <item>Venus</item>
  19.         <item>Terra</item>
  20.         <item>Marte</item>
  21.         <item>Xúpiter</item>
  22.         <item>Saturno</item>
  23.         <item>Urano</item>
  24.         <item>Neptuno</item>
  25.     </string-array>
  26. </resources>



O XML do layout

  • É igual ao da aplicación orixinal, cambiando a fonte de datos do spinner e actualizando os id´s dos controis.
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.    xmlns:app="http://schemas.android.com/apk/res-auto"
  4.    xmlns:tools="http://schemas.android.com/tools"
  5.    android:layout_width="match_parent"
  6.    android:layout_height="match_parent"
  7.    tools:context=".UI.Toasts.UD02_01_Toast">
  8.  
  9.     <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  10.        xmlns:tools="http://schemas.android.com/tools"
  11.        android:layout_width="match_parent"
  12.        android:layout_height="match_parent"
  13.        android:orientation="vertical" >
  14.  
  15.         <Spinner
  16.            android:id="@+id/spnPlanetas_UD02_01_Toast"
  17.            android:layout_width="wrap_content"
  18.            android:layout_height="wrap_content"
  19.            android:entries="@array/planetas_UD02_01_toast" />
  20.  
  21.         <Button
  22.            android:id="@+id/btnSeleccion_UD02_01_Toast"
  23.            android:layout_width="wrap_content"
  24.            android:layout_height="wrap_content"
  25.            android:onClick="onButtonClick"
  26.            android:text="Preme cando selecciones" />
  27.  
  28.         <TextView
  29.            android:id="@+id/tvResultado_UD02_01_Toast"
  30.            android:layout_width="wrap_content"
  31.            android:layout_height="wrap_content"
  32.            android:text="Selecciona un planeta" />
  33.  
  34.     </LinearLayout>
  35. </android.support.constraint.ConstraintLayout>



Código Java

  • Ao método da aplicación orixinal engadímoslle un control: se esta seleccionada ou non a posición 0 do Spinner.
  1. package es.cursoandroid.cifprodolfoucha.aprendiendo.UI.Toasts;
  2.  
  3. import android.app.Activity;
  4. import android.os.Bundle;
  5. import android.view.View;
  6. import android.widget.Spinner;
  7. import android.widget.TextView;
  8. import android.widget.Toast;
  9.  
  10. import es.cursoandroid.cifprodolfoucha.aprendiendo.R;
  11.  
  12. public class UD02_01_Toast extends Activity {
  13.  
  14.     public void onButtonClick(View v) {
  15.         Spinner spinPlanetas = (Spinner) findViewById(R.id.spnPlanetas_UD02_01_Toast);
  16.         TextView lblResultado = (TextView) findViewById(R.id.tvResultado_UD02_01_Toast);
  17.  
  18.         if (spinPlanetas.getSelectedItemId() == 0) {
  19.             Toast.makeText(this, "Por favor selecciona un planeta",Toast.LENGTH_LONG).show();
  20.             lblResultado.setText("");
  21.         } else
  22.  
  23.             lblResultado.setText("Seleccionaches "
  24.                     + spinPlanetas.getSelectedItem()
  25.                     + "\nque está na posición "
  26.                     + spinPlanetas.getSelectedItemId());
  27.     }
  28.  
  29.  
  30.     @Override
  31.     protected void onCreate(Bundle savedInstanceState) {
  32.         super.onCreate(savedInstanceState);
  33.         setContentView(R.layout.activity_ud02_01__toast);
  34.     }
  35. }
  • Liña 18: Comprobamos se a posición seleccionada no Spinner é a 0 de ser así ...
  • Liña 19: realizamos un Toast.
  • Liña 20: Poñemos a etiqueta a baleiro.



Personalizando o Toast

  • O toast é un obxecto da clase Toast que se crea cando chamamos o makeToast.
Unha vez creado podemos acceder as súas propiedades e métodos.
  • Por exemplo:


  • Vexamos un exemplo, baseado no mesmo código do exemplo anterior, no que imos crear un View de tipo TextView que imos asociado a o Toast e tamén imos modificar a posición na que aparece a mensaxe:
PDM toast 4.jpg


  • O código modificado:
  1.     public void onButtonClick(View v) {
  2.         Spinner spinPlanetas = (Spinner) findViewById(R.id.spnPlanetas_UD02_01_Toast);
  3.         TextView lblResultado = (TextView) findViewById(R.id.tvResultado_UD02_01_Toast);
  4.  
  5.         if (spinPlanetas.getSelectedItemId() == 0) {
  6.             Toast toast =  Toast.makeText(this, "",Toast.LENGTH_LONG);   // Creamos o obxecto Toast
  7.  
  8.             TextView viewToast = new TextView(this);    // Creamos un view que imos asociado ao Toast en vez dunha cadea de texto. Podería ser calquera view
  9.             viewToast.setText("Por favor selecciona un planeta");
  10.             viewToast.setTextColor(Color.RED);
  11.  
  12.             toast.setGravity(Gravity.TOP|Gravity.RIGHT,10,10);  // Cambiamos as propiedades do toast
  13.             toast.setView(viewToast);
  14.            
  15.             toast.show();   // Amosamos o toast
  16.             lblResultado.setText("");
  17.         } else {
  18.  
  19.             lblResultado.setText("Seleccionaches "
  20.                     + spinPlanetas.getSelectedItem()
  21.                     + "\nque está na posición "
  22.                     + spinPlanetas.getSelectedItemId());
  23.        }
  24.     }





-- Ángel D. Fernández González e Carlos Carrión Álvarez -- (2018).