Diferencia entre revisiones de «Usuario:ManuelRomero/Android2/PrimerPrograma/Dialogo»

De WikiEducator
Saltar a: navegación, buscar
(Empezamos)
Línea 1: Línea 1:
{{TEP}}
+
===Dialog con 2 o 3 botones===
{{:Usuario:ManuelRomero/Android2/PrimerPrograma/nav}}
+
{{Actividad|
{{TEP}}
+
#Primero añadimos un botón para que realice esta acción
{{:Usuario:ManuelRomero/Android2/PrimerPrograma/nav}}
+
#Le asignamos en el atributo onClick en nombre de la función
<br>
+
#implementamos la función
{{#widget:Slides}}
+
}}
{{MiTitulo| Programación en android }}
+
  
<div class="slides layout-regular template-default">
+
<source lang=xml>
<div class="slide">
+
<Button
</div>
+
        android:id="@+id/btnDialogo1"
===Concepto de cajas de dialogo===
+
        android:text="Dialogo1"
*Son widgets que contienen informción para el usuario
+
        android:layout_width="wrap_content"
*La información se presenta en una ventana aparte de la aplicación
+
        android:layout_height="wrap_content"
*La ventana puede tener botones para que el usuario interactúe
+
        android:onClick="clickDialogo1" />
*Puede pedir información o simplemente aceptar o confirmar algo
+
</xml>
*Iremos presentando las diferentes opciones que se plantean
+
===El código ===
===Métodos para presentar los diálogos===
+
*Una caja de diálog es un objeto de la clase '''AlertDialog'''
*Existen dos métodos
+
*Para configurar las propiedades de la caja de diálogo usamos un objeto que devuelve el método estático '''''AlertDialog.Builder(Context );
#Basado en versiones anteriores
+
*El procedimiento para crear/usar cajas de diálogos es el siguiente
##los diálogos los gestiona la clases  '''''activity''''' desde  una pila
+
  #creo un objeto para las propiedades de la caja de diálogo ''AlerDialog.Builder''
##Los diálogos no se comparten entre actividades
+
  #creo la caja de diálogo  AlertDialog a partir de objeto anterior
##Muchos métodos utilizados están obsoletos
+
  #Muestro la caja de diálogo
##Es el más fácil de implementar
+
<source lang=java>
#Basado en fragmentos
+
AlertDialog.Builder caja = new AlertDialog.Builder(this);7
##Usados desde el API 11 (Android 3.0)
+
caja.setTitle("Titulo");
##Puede funcionar con versiones anteriores si usamos el ''paquete de soporte Android''
+
    .setIcon("icono.png");
##Los diálogos los gestiona '''''FragmentManager''''' ''android.app.FragmentManager
+
  ......
##Los diálogos son un tipo especial de fragmento
+
  AlertDialog dialogo = caja.create();
===Tipos de diálogo===
+
dialogo.show();
*Estos son algunos de los tipos de cajas de diálogos que podemos ver
+
</source>
*Implementaremos algunos de ellos y veremos su utilidad
+
*Realizamos el código
*Son sencillos de utilizar
+
#Toast
+
#Dialog con uno dos o tres botones
+
#Dialog seleccionar una opción
+
#Dialog seleccionar varias opciones
+
#ProgresDialog circular
+
#ProgresDialog horizontal
+
#Otras que no implemenaremos
+
##CharacterPickerDialog
+
##TimePickerDialog
+
##Dialogo personalizado
+
  
===Empezamos===
+
Observar que para dar las diferentes propiedades puedo hacerlo seguido
<br/>
+
objeto.propiedad1()
{{Actividad| *Creamos un nuevo proyecto de android
+
      .propiedad2()
*Le llamamos por ejemplo Dialogos}}
+
      ....
 +
      .propiedadn();
 +
   
 +
*Una vez creado el objeto le damos las propiedades que necesarias
 +
*Los métodos que asignas propiedades son muy intuitivos, y permiten asignar
 +
#Un título setTitle
 +
#Un mensaje de texto
 +
#Uno, dos o tres botones
 +
#Una lista de items seleccionables (con casillas de verificación (checkboxes) o botones de opción (radio buttons) opcionales)
 +
#El método setCancelabre(boolean) convierte la ventana de dialogo en modal respecto al botón de retroceso
  
===El fichero java===
+
Vermos el código
*Escribimos el código para que aparezca el mensaje
+
<source lang=java>
*Básicamente lo que haremos es escribir el código de este método '''''clickToast'''''
+
  public void clickDialogo1(View v){
*Este método recibe como argumento la vista donde está el botón ç
+
  AlertDialog.Builder builder = new AlertDialog.Builder(this);
*En él instanciaremos un objeto de la clase '''''Toast'''''
+
  builder.setMessage("¿Desea continuar con la transferencia de dinero?")
 +
          .setTitle("Advertencia")
 +
          .setCancelable(false)
 +
          .setNegativeButton("Cancelar",
 +
                  new DialogInterface.OnClickListener() {
 +
                      public void onClick(DialogInterface dialog, int id) {
 +
                          dialog.cancel();
 +
                      }
 +
                  })
 +
          .setPositiveButton("Continuar",
 +
                  new DialogInterface.OnClickListener() {
 +
                      public void onClick(DialogInterface dialog, int id) {
 +
                          msgOK(); // metodo que se debe implementar
 +
                      }
 +
                  });
 +
  AlertDialog alert = builder.create();
 +
  alert.show();
 +
  }
  
===Clase Toast===
+
private void msgOK(){
clase definida en el paquete  '''''widget'''''
+
        Toast t = Toast.makeText(getApplicationContext(), "Has presionado ok", Toast.LENGTH_SHORT);
android.widget.Toast
+
        t.show();
;Referencia
+
}
http://developer.android.com/guide/topics/ui/notifiers/toasts.html
+
*Esta clase implementa la ventana mas sencilla de diálogo
+
*Es simplemente un alert o MsgBox con un solo parámetro,
+
*El parámetro es el texto que visualiza
+
*Se visualiza independientemente del activity de la aplicación
+
*Por lo que no oculta la activity que sigue visible y activa
+
*El mensaje generado por '''''Toast''''' desaparece cuando se cumple un ''timeout''
+
 
+
 
+
*Un objeto de la clase Toast se puede instanciar con un método estático '''''makeText''''' de la misma clase
+
<source lang=java>
+
makeText(contexto, texto, duracion)
+
</source>
+
Este métod recibe tres parámetros
+
;contexto
+
:Objeto que describe el en entorno actual de la interfaz de la aplicación
+
;texto
+
:La cadena de caracteres que se va a visualizar
+
;duración
+
:tiempo en el que dura la ventana emergente
+
:puede tomar dos valores  como constantes de la propia clase
+
LENGTH_LONG
+
LENGTH_SHORT
+
El método que añadimos es el siguiente
+
<source lang=java>
+
    public void clickToast(View v){
+
    Context contesto = getApplicationContext();
+
    CharSequence texto = "Este ejemplo ha funcionado FACIL!!!!";
+
    int duracion = Toast.LENGTH_LONG;
+
   
+
    Toast mensaje = Toast.makeText(contesto, texto, duracion);
+
    mensaje.show();
+
    }
+
 
</source>
 
</source>
 +
*Conviene revisar el método para añadir botones
 +
*Tenemos tres métodos para este cometido
 +
setPositiveButton
 +
setNegativeButton
 +
setNeutralButton
 +
*Estos métodos tienen dos parámetros el texto y el listener
 +
*Se suele pasar una instancia del listener creandola en el propio parámetros
 +
*Si quiere usar variables de la clase, éstas tienen que ser constantes
  
===Ventana dialogo con ckeckbox===
+
{{Actividad|Se puede añadir otro botón a la caja de diálogo anterior}}
*A continución realizaremos otra ventana de diálogo
+
===checkButton como opciones===
*Seguimos usando el mismo proyecto
+
*Tenemos diferentes opciones y queremos seleccionar  algunas de ellas
*En ella el usuario debe checkear distintas opciones (seleccionar idiomas)
+
*En este caso debemos invocar al método
*En la misma confirmaremos o cancelaremos la selección
+
===ratio$Button como opciones===
===Realización de la práctica===
+
*Tenemos diferentes opciones y queremos seleccionar solo una
*Modificamos el interfaz
+
===Ventana dialogo con direfentes opciones===
 +
*En este caso añadimos el método setItems, en lugar de setMessage
 +
*El método setItems como primer parámetro le pasaremos un vector de charSequences y el segundo es un listener
 +
*Vemos el código
 
<source lang=xml>
 
<source lang=xml>
 
   <Button
 
   <Button
         android:id="@+id/button2"
+
         android:id="@+id/btnOpciones"
 +
        android:text="Opciones"
 
         android:layout_width="wrap_content"
 
         android:layout_width="wrap_content"
 
         android:layout_height="wrap_content"
 
         android:layout_height="wrap_content"
        android:text="Opciones Lengaje"
+
         android:onClick="clickMsgOpciones" />
         android:onClick="clickMesajeOpciones"/>
+
</source>
+
*Definimos un array de opciones
+
<source lang=java>
+
CharSequence[] idiomas={"Españlo","Inglés","Alemán"};
+
    boolean [] idiomasSeleccionados=new boolean[idiomas.length];
+
 
</source>
 
</source>
 +
<sourece lang=java>
 +
public void clickMsgOpciones(View v){
 +
   
 +
      AlertDialog.Builder caja = new AlertDialog.Builder(this);
 +
      caja.setTitle("Indica sexo")
 +
          .setPositiveButton("Continuar",
 +
              new DialogInterface.OnClickListener() {
 +
                  public void onClick(DialogInterface dialog, int id) {
 +
                      msgOK(); // metodo que se debe implementar
 +
                  }
 +
              })
 +
          .setItems(sexo, new DialogInterface.OnClickListener() {
 +
@Override
 +
      public void onClick(DialogInterface dialog, int elemento) {
 +
// TODO Auto-generated method stub
 +
      Toast t = Toast.makeText(getApplicationContext(), "Has seleccionado "+sexo[elemento],Toast.LENGTH_LONG);
 +
      t.show();
 +
      dialog.cancel();
 +
      }
 +
});
  
<source lang=java>
+
AlertDialog alert = caja.create();
    public void clickDialogoOpciones(View v){
+
alert.show();
    showDialog(0);
+
 
}
 
}
 
</source>
 
</source>
*El uso del método showDialog esta depreciado a partir de la versión 3.0 de android.
+
*
*El argumento indica un determinado cuadro de diálogo a mostrar
+
  
*implementamos el método '''''clickMesajeOpciones'''''
 
*Este método lo que hace es llamar al método '''''onCreateDialog()''''' que hay que sobreescribir
 
*Retorna un objeto Dialog que hay que importar de la clase import android.app.Dialog;
 
  
 
+
*A continución realizaremos otra ventana de diálogo
*Para mostrar el código debemos implementar el método '''''onCreateDialog(int)'''''
+
*Seguimos usando el mismo proyecto
*Para crear un cuadro de diálogo utiliza el constructur '''''Buider''''' de la clase '''''AlertDialog'''''
+
*En ella el usuario debe checkear distintas opciones (seleccionar idiomas)
*Se establecen las propiedades como icono, título, botones, casillas de verificación, ...
+
*En la misma confirmaremos o cancelaremos la selección
*se invoca al método create del objeto builder
+
<source lang=java>
+
Builder ventanaDialogo = new AlertDialog.Builder(this);
+
ventanaDialogo.setIcon(R.drawable.ic_launcher);
+
ventanaDialogo.setTitle("Ejemplo de cuadro diálogo 1 con texto" );
+
ventanaDialogo.setPositiveButton("SI", new DialogInterface.OnClickListener() {
+
@Override
+
  public void onClick(DialogInterface dialog, int which) {
+
          // TODO Auto-generated method stub
+
          Context contesto = getBaseContext();
+
          int duracion=Toast.LENGTH_LONG;
+
          Toast.makeText(contesto,"OK seleccionado",duracion).show();
+
  }
+
});
+
</source>
+
===Barra de progreso===
+
*En este caso usaremos un objeto ProgressDialog en lugar de un Builder
+
<source lang=java>
+
public void clickProgressDialog(View v){
+
final ProgressDialog barraProgreso = ProgressDialog.show(this, "Haciendo algo","Espere que termine",true);
+
new Thread(new Runnable(){
+
public void run(){
+
try{
+
Thread.sleep(5000);
+
barraProgreso.dismiss();
+
}catch (InterruptedException e){
+
e.printStackTrace();
+
}
+
}
+
}).start();
+
}
+
</source>
+
*Lo peculiar de este método es que creamos un thread
+
*Un thread o hilo es una línea de ejecución independiente de la ejecución de la aplicación que la invoca.
+
===Otra barra de tarea===
+
<source lang=java>
+
case 2:
+
   
+
    barraSofisticadaDialogo = new ProgressDialog(this);
+
    barraSofisticadaDialogo.setIcon(R.drawable.ic_launcher);
+
    barraSofisticadaDialogo.setTitle("Hanciendo algo, no molesten!!");
+
    barraSofisticadaDialogo.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
+
    barraSofisticadaDialogo.setButton(DialogInterface.BUTTON_POSITIVE,"OK",
+
    new DialogInterface.OnClickListener() {
+
@Override
+
public void onClick(DialogInterface dialog, int which) {
+
// TODO Auto-generated method stub
+
Toast.makeText(getBaseContext(), "Ok cliqueado",Toast.LENGTH_SHORT).show(); }
+
});
+
    return barraSofisticadaDialogo;
+
</source>
+

Revisión de 23:15 22 may 2013

Dialog con 2 o 3 botones

Icon activity.jpg

Actividad

  1. Primero añadimos un botón para que realice esta acción
  2. Le asignamos en el atributo onClick en nombre de la función
  3. implementamos la función





 <Button
        android:id="@+id/btnDialogo1"
        android:text="Dialogo1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickDialogo1" />
</xml>
===El código ===
*Una caja de diálog es un objeto de la clase '''AlertDialog'''
*Para configurar las propiedades de la caja de diálogo usamos un objeto que devuelve el método estático '''''AlertDialog.Builder(Context );
*El procedimiento para crear/usar cajas de diálogos es el siguiente
  #creo un objeto para las propiedades de la caja de diálogo ''AlerDialog.Builder''
  #creo la caja de diálogo  AlertDialog a partir de objeto anterior
  #Muestro la caja de diálogo
<source lang=java>
 AlertDialog.Builder caja = new AlertDialog.Builder(this);7
 caja.setTitle("Titulo");
     .setIcon("icono.png");
  ......
 AlertDialog dialogo = caja.create();
 dialogo.show();
  • Realizamos el código

Observar que para dar las diferentes propiedades puedo hacerlo seguido

objeto.propiedad1()
     .propiedad2()
     ....
     .propiedadn();
   
  • Una vez creado el objeto le damos las propiedades que necesarias
  • Los métodos que asignas propiedades son muy intuitivos, y permiten asignar
  1. Un título setTitle
  2. Un mensaje de texto
  3. Uno, dos o tres botones
  4. Una lista de items seleccionables (con casillas de verificación (checkboxes) o botones de opción (radio buttons) opcionales)
  5. El método setCancelabre(boolean) convierte la ventana de dialogo en modal respecto al botón de retroceso

Vermos el código

  public void clickDialogo1(View v){
	  AlertDialog.Builder builder = new AlertDialog.Builder(this);
	  builder.setMessage("¿Desea continuar con la transferencia de dinero?")
	          .setTitle("Advertencia")
	          .setCancelable(false)
	          .setNegativeButton("Cancelar",
	                  new DialogInterface.OnClickListener() {
	                      public void onClick(DialogInterface dialog, int id) {
	                          dialog.cancel();
	                      }
	                  })
	          .setPositiveButton("Continuar",
	                  new DialogInterface.OnClickListener() {
	                      public void onClick(DialogInterface dialog, int id) {
	                          msgOK(); // metodo que se debe implementar
	                      }
	                  });
	  AlertDialog alert = builder.create();
	  alert.show();
  }
 
private void msgOK(){
        Toast t = Toast.makeText(getApplicationContext(), "Has presionado ok", Toast.LENGTH_SHORT);
        t.show();
}
  • Conviene revisar el método para añadir botones
  • Tenemos tres métodos para este cometido
setPositiveButton
setNegativeButton
setNeutralButton
  • Estos métodos tienen dos parámetros el texto y el listener
  • Se suele pasar una instancia del listener creandola en el propio parámetros
  • Si quiere usar variables de la clase, éstas tienen que ser constantes



Icon activity.jpg

Actividad

Se puede añadir otro botón a la caja de diálogo anterior



checkButton como opciones

  • Tenemos diferentes opciones y queremos seleccionar algunas de ellas
  • En este caso debemos invocar al método

ratio$Button como opciones

  • Tenemos diferentes opciones y queremos seleccionar solo una

Ventana dialogo con direfentes opciones

  • En este caso añadimos el método setItems, en lugar de setMessage
  • El método setItems como primer parámetro le pasaremos un vector de charSequences y el segundo es un listener
  • Vemos el código
  <Button
        android:id="@+id/btnOpciones"
        android:text="Opciones"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickMsgOpciones" />

<sourece lang=java> public void clickMsgOpciones(View v){

      AlertDialog.Builder caja = new AlertDialog.Builder(this);
      caja.setTitle("Indica sexo")
          .setPositiveButton("Continuar",
              new DialogInterface.OnClickListener() {
                  public void onClick(DialogInterface dialog, int id) {
                      msgOK(); // metodo que se debe implementar
                  }
              })
          .setItems(sexo, new DialogInterface.OnClickListener() {

@Override public void onClick(DialogInterface dialog, int elemento) { // TODO Auto-generated method stub Toast t = Toast.makeText(getApplicationContext(), "Has seleccionado "+sexo[elemento],Toast.LENGTH_LONG); t.show(); dialog.cancel(); } });

AlertDialog alert = caja.create(); alert.show(); } </source>


  • A continución realizaremos otra ventana de diálogo
  • Seguimos usando el mismo proyecto
  • En ella el usuario debe checkear distintas opciones (seleccionar idiomas)
  • En la misma confirmaremos o cancelaremos la selección