miércoles, 29 de febrero de 2012

6.5.2.Programación en Android - Actividad Menu (III) Editando el ListView


6.5.2.- Programación en Android – Actividad Menu (III) – Editando el ListView.

Vamos a continuar en este capítulo dándole unos retoques al diseño de nuestra ActividadMenu, personalizando un poco nuestro ListView, aquí se darán unas pautas y se recomienda que vosotros hagáis vuestras propias pruebas para ver los resultados.




Como se puede observar, se han añadido unos separadores, además de cambiar el selector que por defecto es una banda naranja, también se han alterado algunos colores, pero eso es algo que se deja a la elección personal de cada uno.



Aunque el ListView permite poner una cabecera y un pie, esta vez se ha optado por ponerlos en el layout principal, y poner el listview debajo del primer separador. A estos separadores, el superior y el inferior, se les ha fijado la altura a 10 pixels, para ello se ha puesto el valor 10px en los campos Max height y Min height de los imageviews correspondientes. También podríamos haber añadido un recurso dimensión para esto, pero esta vez lo ponemos directamente. Además vamos a fijar los campos Layout align parent left / right a true, con la finalidad de que estire la imagen para alinearla con los dos extremos. Entre otras cosas, debemos cambiar también el campo Layout below para que ponga esta imagen debajo del textview de "Menú".
Por cierto, se ha utilizado una imagen con un ancho de 480 pixels y una altura de 5 pixels.
No me estoy parando mucho describiendo los pasos, ya que si no son los mismos son muy parecidos a los que realizamos en anteriores capítulos y además es recomendable que experimentéis vosotros un poco para observar los cambios que podéis realizar en los widgets.
A veces, puede darse el caso de que el IDE nos de un error de que no se encuentra algún recurso, esto puede ser debido a que se pone @id/imageview3 en vez de @+id/imageview3 en la referencia a algún recurso. Y aunque ambos son correctos, la diferencia está en que con el + se añade el identificador del recurso en caso de no existir, y el primero (sin el +) referencia un recurso que se supone que ya ha sido añadido.

Ahora vamos a retocar un poco el ListView, y alteramos las siguientes propiedades:

Propiedad
Valor
Descripción
Divider
@drawable/lineas480x5_cobre
El recurso drawable que utilizaremos para dividir los items del ListView.
Divider height
2px
Altura de la linea divisoria.
Fading Edge
horizontal | vertical
Desvanecimiento de los bordes cuando se hace scroll de la lista. En este caso de los verticales y los horizontales.
Fading Edge Lenght
10px
Tamaño del desvanecimiento de los bordes.
List Selector
@drawable/simbolo_correcto
Imagen que pondrá sobre el item que se va a seleccionar. Por defecto es una banda naranja, nosotros ponemos una imagen.


Con esto ya deberíamos tener nuestra ActividadMenu un poquito más vistosa.
Por cierto no os fijéis mucho en las combinaciones de colores y gráficos que estoy realizando, que parecen de Ágata Ruiz de la Prada, porque son solo para poner ejemplos, evidentemente si fuéramos a publicar la aplicación en el market cuidaríamos un poco más el aspecto visual.





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

No hay comentarios:

Publicar un comentario