¿Os acordáis de la aplicación con la que
trabajamos los ListView? Bien, pues vamos a mejorarla para que en cada opción
que nos dé aparezca un icono además del texto. La idea a conseguir,
aproximadamente, es algo como el siguiente ejemplo:
Esto conseguiremos hacerlo mediante un
layout de ítem propio.
Crearemos un RelativeLayout para el ítem, donde el alto se establece a partir de
un parámetro de configuración del sistema para alturas de ítems en ListView: ?android:attr/listPrefferedItemHeight.
El primer elemento que contiene es un ImageView alineado a la izquierda. Su
alto y su ancho también pueden ser el mismo parámetro indicado.
En el código Java de la actividad debe
crearse el adaptador indicando el nombre del layout que debe utilizarse y el
nombre del elemento donde se visualizará el valor de cada ítem.
Sabiendo esto, vayamos por pasos.
Nuestro activity_listas presentaba el siguiente aspecto:
El XML por si se quiere generar de nuevo es
el siguiente:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".Listas"
android:background="#FF5722">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Ejemplo de listado"
android:id="@+id/lblTitulo"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:textColor="#FFFFFF"
android:textSize="@dimen/abc_action_button_min_width_overflow_material"
android:textStyle="bold"
android:gravity="center_horizontal" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@android:id/list"
android:layout_below="@+id/lblTitulo"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="40dp"
android:touchscreenBlocksFocus="false"
android:textAlignment="center"
android:gravity="center" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Resultado"
android:id="@+id/lblResultado"
android:layout_below="@+id/lblTitulo"
android:layout_centerHorizontal="true"
android:textSize="@dimen/abc_dialog_padding_material"
android:textColor="#FFFFFF"
android:gravity="center_horizontal" />
</RelativeLayout>
El siguiente paso será alojar en el
directorio drawable el icono que
usaremos para colocarlo en los ítems de nuestra lista. En mi caso este:
Y generamos un nuevo layout, ítem_layout por ejemplo, en el que
dentro del Relative_layout
insertaremos un ImageView y un TextView, este último con el texto
vacío, y la imagen haciendo referencia a la que querremos usar de icono.
Y para las propiedades de altura y anchura
de los elementos colocaremos la siguiente medida:
?android:attr/listPreferredItemHeight
Dejo el XML completo para poder hacernos
idea:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<ImageView
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="?android:attr/listPreferredItemHeight"
android:id="@+id/icono"
android:src="@drawable/android"
android:layout_alignParentLeft="true" />
<TextView
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="?android:attr/listPreferredItemHeight"
android:id="@+id/titulo"
android:layout_marginLeft="70dp" />
</RelativeLayout>
Y por último, en la clase Listas.java escribiremos lo siguiente:
private TextView resultado;
private ListView lista;
private String[] cursos;
private String[] asignaturas;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_listas);
resultado =
(TextView)findViewById(R.id.lblResultado);
lista =
(ListView)findViewById(android.R.id.list);
asignaturas =
getResources().getStringArray(R.array.opcion);
ListAdapter adapter =
new ArrayAdapter<String>(this, R.layout.item_layout, R.id.titulo,
asignaturas);
lista.setAdapter(adapter);
}
@Override
protected void onListItemClick(ListView l, View v, int position,
long id){
super.onListItemClick(l,
v, position, id);
cursos =
getResources().getStringArray(R.array.curso);
resultado.setText(l.getItemAtPosition(position)
+ " es de " + cursos[position]);
}
Es decir, ahora haremos la referencia con
la nueva activity también para cargar los iconos.
Si ejecutas la aplicación, aparecerá algo
así:
0 comentarios:
Publicar un comentario