Diferencia entre revisiones de «Usuario:ManuelRomero/Android/PrimerosContactos/EjemploCajasDialogo»

De WikiEducator
Saltar a: navegación, buscar
(Página creada con '{{:Usuario:ManuelRomero/Android/PrimerosContactos/nav}}')
 
Línea 1: Línea 1:
 
{{:Usuario:ManuelRomero/Android/PrimerosContactos/nav}}
 
{{:Usuario:ManuelRomero/Android/PrimerosContactos/nav}}
 +
<br/>
 +
===Dialog con 2 o 3 botones===
 +
<br/>
 +
{{Actividad|
 +
#Primero añadimos un botón para que realice esta acción
 +
#Le asignamos en el atributo onClick en nombre de la función
 +
#implementamos la función
 +
}}
 +
 +
<source lang=xml>
 +
<Button
 +
        android:id="@+id/btnDialogo1"
 +
        android:text="Dialogo1"
 +
        android:layout_width="wrap_content"
 +
        android:layout_height="wrap_content"
 +
        android:onClick="clickDialogo1" />
 +
</source>
 +
===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();
 +
</source>
 +
*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
 +
#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 setCancelable(boolean) convierte la ventana de dialogo en modal respecto al botón de retroceso
 +
 +
Vermos el código
 +
<source lang=java>
 +
  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();
 +
}
 +
</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
 +
 +
{{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 ella el usuario debe checkear distintas opciones (seleccionar idiomas)
 +
*En este caso debemos invocar al método '''''setMultiChoiceItems'''''
 +
*Este método le pasamos el vector de opciones, un vector de boolenos que nos dice cada opción si está  o no seleccionada y un listener.
 +
*Igualmente podemos añadir botones de aceptar o cancelar.
 +
<source lang=xml>
 +
  <Button
 +
        android:id="@+id/Dialog4"
 +
        android:text="Idiomas"
 +
        android:layout_width="wrap_content"
 +
        android:layout_height="wrap_content"
 +
        android:onClick="clickOpcionMultiple" />
 +
</source>
 +
<source lang=java>
 +
public void clickOpcionMultiple(View v){
 +
 +
 +
AlertDialog.Builder caja = new AlertDialog.Builder(this);
 +
 +
caja.setTitle("Tu OS móvil preferido?")
 +
    .setMultiChoiceItems(idiomas,idiomasSeleccionados,
 +
                          new DialogInterface.OnMultiChoiceClickListener() {
 +
                  @Override
 +
                public void onClick(DialogInterface dialog, int which, boolean isChecked) {
 +
// TODO Auto-generated method stub
 +
                      Context contesto = getBaseContext();
 +
                      int duracion=Toast.LENGTH_SHORT;
 +
                      Toast.makeText(contesto,idiomas[which]+(isChecked ? "seleccionado":"NOOOOOO seleccionado"),duracion).show();
 +
                              }
 +
                  });
 +
 +
AlertDialog alert = caja.create();
 +
alert.show();
 +
}
 +
}
 +
 +
 +
</source>
 +
===ratioButton ===
 +
*Tenemos diferentes opciones y queremos seleccionar  solo una
 +
*En este caso usaremos el método setSingleChoiceItems(charSequence[] lista,int item_seleccionado,listener)
 +
<source lang=xml>
 +
<Button
 +
        android:id="@+id/Dialog3"
 +
        android:text="Sexo"
 +
        android:layout_width="wrap_content"
 +
        android:layout_height="wrap_content"
 +
        android:onClick="clickSingle" />
 +
</source>
 +
 +
<source lang=java>
 +
public void clickSingle(View v){
 +
 +
 +
AlertDialog.Builder caja = new AlertDialog.Builder(this);
 +
caja.setTitle("Tu OS móvil preferido?")
 +
    .setSingleChoiceItems(sexo, -1, new DialogInterface.OnClickListener() {
 +
    public void onClick(DialogInterface dialog, int item) {
 +
        Toast toast = Toast.makeText(getApplicationContext(), "Haz elegido la opcion: " + sexo[item] , Toast.LENGTH_SHORT);
 +
        toast.show();
 +
        dialog.cancel();
 +
    }
 +
    });
 +
AlertDialog alert = caja.create();
 +
alert.show();
 +
}
 +
 +
</source>
 +
===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>
 +
  <Button
 +
        android:id="@+id/btnOpciones"
 +
        android:text="Opciones"
 +
        android:layout_width="wrap_content"
 +
        android:layout_height="wrap_content"
 +
        android:onClick="clickMsgOpciones" />
 +
</source>
 +
<source 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>
 +
===Barra de progreso circular===
 +
*En este caso la barra de progreso puede ser circular u horizontal
 +
*Este tipo de barra de progreso se ha de actualizar
 +
*Si queremos que se ejecute de forma independiente del proceso debemo crear un hilo de ejecución
 +
*En este caso creamos un objeto de la clase '''''ProgressDialog'''''
 +
<source lang=xml>
 +
    <Button
 +
        android:id="@+id/ProgressDialog"
 +
        android:text="Progress Circulo"
 +
        android:layout_width="wrap_content"
 +
        android:layout_height="wrap_content"
 +
        android:onClick="clickProgressCirculo" />
 +
</source>
 +
*En este caso simplemente
 +
#creamos el objeto ProgressDialog
 +
#Lo visualizamos
 +
#Creamos un thread que espere 5 segundos
 +
#cerramos la barra de diálogo con dismiss()
 +
<sourece lang=java>
 +
public void clickProgressCirculo(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>
 +
 +
===Barra de progreso horizontal===
 +
*Ahora le diremos que el objeto que tiene la forma horizontal de línea
 +
*En este caso tenemos una barra que se va rellenando
 +
*Esto implica que el progreso tendrá un valor inicial e irá modificando hasta llegar a estar totalmente rellena
 +
*Vamos a añadir un botón para cancelar
 +
<source lang=xml>
 +
<Button
 +
        android:id="@+id/ProgressDialog2"
 +
        android:text="Progress Dialog 2"
 +
        android:layout_width="wrap_content"
 +
        android:layout_height="wrap_content"
 +
        android:onClick="clickProgressHorizontal" />
 +
</source>
 +
<source lang=java>
 +
public void clickProgressHorizontal(View v){
 +
 +
Toast t=Toast.makeText(getApplicationContext(),"hola",Toast.LENGTH_LONG);
 +
final ProgressDialog barraSofisticadaDialogo = new ProgressDialog(this);
 +
t.show();
 +
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(); }
 +
  }
 +
);
 +
barraSofisticadaDialogo.setProgress(0);
 +
barraSofisticadaDialogo.show();
 +
Log.d("BARRASOFISTICADA","Antes del Runnable");
 +
new Thread(new Runnable(){
 +
public void run(){
 +
for (int i=1;i<=15;i++){
 +
try{
 +
Log.d("BARRASOFISTICADA","dentro del Runnable");
 +
Thread.sleep(100);
 +
barraSofisticadaDialogo.incrementProgressBy((int)(100/15));
 +
 +
}catch (InterruptedException e){
 +
e.printStackTrace();
 +
}
 +
}//End for
 +
barraSofisticadaDialogo.dismiss();
 +
Log.d("BARRASOFISTICADA","terminado el  bucle");
 +
 +
}
 +
}).start();
 +
Log.d("BARRASOFISTICADA","terminado el  Runnable");
 +
 +
</source>

Revisión de 10:16 21 oct 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" />

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
  1. creo un objeto para las propiedades de la caja de diálogo AlerDialog.Builder
  2. creo la caja de diálogo AlertDialog a partir de objeto anterior
  3. Muestro la caja de diálogo
 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 setCancelable(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 ella el usuario debe checkear distintas opciones (seleccionar idiomas)
  • En este caso debemos invocar al método setMultiChoiceItems
  • Este método le pasamos el vector de opciones, un vector de boolenos que nos dice cada opción si está o no seleccionada y un listener.
  • Igualmente podemos añadir botones de aceptar o cancelar.
  <Button
        android:id="@+id/Dialog4"
        android:text="Idiomas"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickOpcionMultiple" />
public void clickOpcionMultiple(View v){
 
 
AlertDialog.Builder caja = new AlertDialog.Builder(this);
 
caja.setTitle("Tu OS móvil preferido?")
     .setMultiChoiceItems(idiomas,idiomasSeleccionados,
                           new DialogInterface.OnMultiChoiceClickListener() {
		                   @Override
			                 public void onClick(DialogInterface dialog, int which, boolean isChecked) {
				// TODO Auto-generated method stub
		                	       Context contesto = getBaseContext();
		                	       int duracion=Toast.LENGTH_SHORT;
		                	       Toast.makeText(contesto,idiomas[which]+(isChecked ? "seleccionado":"NOOOOOO seleccionado"),duracion).show();
                              }
		                   });
 
			AlertDialog alert = caja.create();
			alert.show();
}
}

ratioButton

  • Tenemos diferentes opciones y queremos seleccionar solo una
  • En este caso usaremos el método setSingleChoiceItems(charSequence[] lista,int item_seleccionado,listener)
<Button
        android:id="@+id/Dialog3"
        android:text="Sexo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickSingle" />
public void clickSingle(View v){
 
 
AlertDialog.Builder caja = new AlertDialog.Builder(this);
caja.setTitle("Tu OS móvil preferido?")
    .setSingleChoiceItems(sexo, -1, new DialogInterface.OnClickListener() {
     public void onClick(DialogInterface dialog, int item) {
        Toast toast = Toast.makeText(getApplicationContext(), "Haz elegido la opcion: " + sexo[item] , Toast.LENGTH_SHORT);
        toast.show();
        dialog.cancel();
     }
    });
AlertDialog alert = caja.create();
alert.show();
}

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" />
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();
}

Barra de progreso circular

  • En este caso la barra de progreso puede ser circular u horizontal
  • Este tipo de barra de progreso se ha de actualizar
  • Si queremos que se ejecute de forma independiente del proceso debemo crear un hilo de ejecución
  • En este caso creamos un objeto de la clase ProgressDialog
    <Button
        android:id="@+id/ProgressDialog"
        android:text="Progress Circulo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickProgressCirculo" />
  • En este caso simplemente
  1. creamos el objeto ProgressDialog
  2. Lo visualizamos
  3. Creamos un thread que espere 5 segundos
  4. cerramos la barra de diálogo con dismiss()

<sourece lang=java> public void clickProgressCirculo(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>

Barra de progreso horizontal

  • Ahora le diremos que el objeto que tiene la forma horizontal de línea
  • En este caso tenemos una barra que se va rellenando
  • Esto implica que el progreso tendrá un valor inicial e irá modificando hasta llegar a estar totalmente rellena
  • Vamos a añadir un botón para cancelar
 <Button
        android:id="@+id/ProgressDialog2"
        android:text="Progress Dialog 2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickProgressHorizontal" />
 public void clickProgressHorizontal(View v){
 
	Toast t=Toast.makeText(getApplicationContext(),"hola",Toast.LENGTH_LONG);
	final ProgressDialog barraSofisticadaDialogo = new ProgressDialog(this);
	t.show();
	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();						}
			   }
	);
	barraSofisticadaDialogo.setProgress(0);
	barraSofisticadaDialogo.show();
	Log.d("BARRASOFISTICADA","Antes del Runnable");
	new Thread(new Runnable(){
		public void run(){
			for (int i=1;i<=15;i++){
				try{
					Log.d("BARRASOFISTICADA","dentro del Runnable");
					Thread.sleep(100);
					barraSofisticadaDialogo.incrementProgressBy((int)(100/15));
 
				}catch (InterruptedException e){
					e.printStackTrace();
				}
			}//End for
			barraSofisticadaDialogo.dismiss();
			Log.d("BARRASOFISTICADA","terminado el  bucle");
 
		}
	}).start();
	Log.d("BARRASOFISTICADA","terminado el  Runnable");