jueves, 23 de febrero de 2012

6.5.1-Programación en Android - Actividad Menu (II)


6.5.1.- Programación en Android – Actividad Menu (II)

En este capítulo le añadiremos un poco de funcionalidad a nuestra actividad de menú.
Como recordamos, hemos añadido un control ListView, pero para trabajar con este control, debemos de crear un fichero xml que será la representación (layout) de lo que se indicaría en cada línea o item que contenga el ListView.
Así que procedemos a añadir un nuevo fichero xml llamado "listview_menu.xml" en la carpeta con los layouts.
A este fichero le añadimos un control TextView, el cuál debe contener lo siguiente:



<?xml version="1.0" encoding="utf-8"?>
<!-- NO PUEDE CONTENER NADA MÁS O DA ERROR (Por ejemplo si tiene LinearLayout -->
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="@dimen/dim_Opciones_Menu"
android:shadowDx="10.0"
android:shadowDy="10.0"
android:shadowRadius="3.0"
android:shadowColor="@color/color_Sombra_Opciones_Menu"
android:textColor="@color/color_Opciones_Menu"/>


Y como se indica en el comentario del código fuente, NO puede tener ninguna referencia al tipo de layout o nos dará un error. Estas propiedades las podríamos haber editado creando el TextView sin haber borrado la etiqueta del layout (el linearlayout u otro), y al terminar de editarlo la borraríamos, con lo que podríamos trabajar con él en el editor gráfico.

Ahora crearemos otro fichero xml dentro de la carpeta anim, que serán para hacer la rotación de los iconos inferiores (también se lo podéis aplicar a los superiores...si queréis), le llamaremos "rotacion_simbolos_menu.xml" y contendrá lo siguiente:

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2000"
android:repeatCount="-1"
android:repeatMode="restart"
>
</rotate>

Creo que no es necesario hacer ninguna descripción de los comandos empleados, a excepción de repeatCount que indica el número de vueltas que tiene que dar, y en caso de ser -1 son infinitas, y repeatMode que indica lo como actuar cada vez que se termina un ciclo de la animación, en este caso "restart" quiere indicar que se vuelve a iniciar la animación.

Ahora debemos de dejar de lado los layouts y escribir un poco de código. Abrimos el fichero "ActividadMenu.java", y vamos a crear un nuevo método el cuál será el encargado de aplicar la animación a los iconos.
Para ello en el método onCreate vamos a escribir el nombre de dicho método que será "animacionIconosMenu();", el entorno eclipse nos indicará un error, pero si pinchamos en el icono que aparece indicando el error podemos seleccionar la opción para que cree la implementación de dicho método.
Ahora en la implementación de este método vamos a añadir el código necesario para que aplique la animación a los iconos inferiores, esto ya lo habíamos visto antes, pero si no lo recordáis sería de la siguiente manera:

ImageView iV_01 = (ImageView) findViewById(R.id.ImageView01);
Animation animacion_01 = AnimationUtils.loadAnimation(this,
R.anim.rotacion_simbolos_menu);
ImageView iV_02 = (ImageView) findViewById(R.id.ImageView02);
iV_01.startAnimation(animacion_01);
iV_02.startAnimation(animacion_01);

Una vez completado este método volvemos al método onCreate para crear una llamada a otro método, al que llamaremos "inicializaListaOpciones();". Después de hacer los pasos semejantes al método anterior vamos al cuerpo de dicho método, en el cuál "construiremos" el ListView, con nuestras opciones.

//Obtenemos un objeto para trabajar el ListView
ListView lv_Opciones = (ListView) findViewById(R.id.listView_Opciones_Menu);
//Esto simplifica el no tener que escribir constantemente el getResources()
Resources res = getResources();
String[] items = res.getStringArray(R.array.array_OpcionesMenu);

En el código anterior obtenemos una referencia a nuestro listView y despues cargamos las cadenas que habíamos creado para el listview en el array de strings "items".
Esto lo hacemos así porque tenemos los recursos de texto en un array, en caso de tenerlos en objetos string independientes utilizaríamos el siguiente código:

String[] items =
{ getResources().getString(R.string.menu_it_jugar),
getResources().getString(R.string.menu_it_puntuaciones),
getResources().getString(R.string.menu_it_configuracion),
getResources().getString(R.string.menu_it_ayuda) };


Con dicho código crearíamos el array de strings a partir de recursos de string independientes.

Ahora debemos crear un adaptador para que pueda pasar nuestros objetos string al listView, lo haremos con el siguiente código:

//Creamos el adaptador del array
ArrayAdapter<String> adap = new ArrayAdapter<String>(this,
R.layout.listview_menu, items);
//Aquí indicamos que el objeto listView utilize este adaptador:
lv_Opciones.setAdapter(adap);

Una vez creado esto, deberíamos crear un oyente (Listener) para saber si se ha pulsado sobre algún item, y actuar en consecuencia, como puede ser llamar a la actividad correspondiente. La forma de llamar a las otras actividades será como vimos en el capítulo 6.4.x, y el listener sería para el evento onItemClick:

lv_Opciones.setOnItemClickListener(new AdapterView.OnItemClickListener()
{
@Override
public void onItemClick(AdapterView<?> padre,
View itemPulsado, int posicion, long id)
{
switch (posicion)
{
case 0:
//El primer item es (JUGAR) (o PLAY) pero siempre representa esto.
//Lanzamos la actividad ActividadJuego
startActivity(new Intent(ActividadMenu.this,
ActividadJuego.class)); break;
case 1:
startActivity(new Intent(ActividadMenu.this,
ActividadConfiguracion.class));
break;
case 2:
startActivity(new Intent(ActividadMenu.this,
ActividadPuntuaciones.class));
break;
case 3:
startActivity(new Intent(ActividadMenu.this, ActividadAyuda.class));
break;
case 4:
startActivity(new Intent(ActividadMenu.this, ActividadSalida.class));
break;
}

/*
* Todo esto de abajo sería en caso de querer
* comparar el valor del TEXTO pulsado con alguna
* cadena que nosotros supieramos. Por ejemplo, en
* caso de no utilizar un array y utilizar valores
* individuales para cada item. sustituiríamos
* items[x] por el recurso que tiene el texto:
* res.getString(R.string.menu_it_puntuaciones)
*
*
* TextView tv_ = (TextView) itemPulsado; String
* texto = tv_.getText().toString(); Resources res =
* getResources(); //Para abreviar despues String[]
* items = res
* .getStringArray(R.array.array_OpcionesMenu);
*
* if (texto.equalsIgnoreCase(items[0])) { //El
* primer item es (JUGAR) (o PLAY) pero siempre
* representa esto. //Lanzamos la actividad
* ActividadJuego startActivity(new
* Intent(ActividadMenu.this,
* ActividadJuego.class)); } else if
* (texto.equalsIgnoreCase(items[1])) {
* startActivity(new Intent(ActividadMenu.this,
* ActividadConfiguracion.class)); } else if
* (texto.equalsIgnoreCase(items[2])) {
* startActivity(new Intent(ActividadMenu.this,
* ActividadPuntuaciones.class));
*
* } else if (texto.equalsIgnoreCase(items[3])) {
* startActivity(new Intent(ActividadMenu.this,
* ActividadAyuda.class));
*
* } else if (texto.equalsIgnoreCase(items[4])) {
* startActivity(new Intent(ActividadMenu.this,
* ActividadSalida.class));
*
* }
*/
}
});

Bueno, como podeis comprobar se utiliza la variable posición, que indica cuál es la posición de la lista que ha sido pulsado, aunque también podríamos haber mirado el texto, como se ve en el código que está comentado. Ahora ya podríamos ejecutar nuestra aplicación, y debería llamar a la actividad correspondiente cuando pulsamos sobre el item adecuado.

Si no quieres ver la ActividadSplash cada vez que depures la aplicación, puedes hacer que comienze en la ActividadMenu, para ello debes editar la configuración de depuración para hacer que llame a la ActividadMenu en vez de a la anterior (Donde pone iniciar activity:...), pero además también debemos de editar el fichero AndroidManifest y añadir en la pestaña de Application, unos nodos para la ActividadMenu, uno sería un nodo de acción (action) y otro un nodo de categoría Launcher, debería quedar como el arbol que hay en la ActividadSplash.
Una vez hecho esto vemos que ya no nos aparece la ActividadSplash al iniciar y en su lugar se inicia directamente la ActividadMenu.

Y hasta aquí con el capítulo de hoy, en un anexo a este capítulo le daremos unos retoques "estéticos" al listview, como añadir unos separadores etc...



Ver. 1.0 – Revisión 23/02/2012

No hay comentarios:

Publicar un comentario