Hacer una Lista en Android Studio

¿Como se implementa una Lista (ListView)? Esta  fue una pregunta que me costo un poco responder, por lo cual a continuación les comparto la manera mas sencilla en que logre responderla.

Para comenzar vamos a definir que es un ListView, en pocas palabras es una lista deslizable. Utilizarlo puede llegar a ser compleja pero es muy potente.

Definir un ListView.

Para hacer nuestra lista necesitamos:

Vista (Layout)
Esta vista contiene el ListView simple.

Activity (.class)
Es la clase java que realizara el funcionamiento, haciendo uso del Modelo y Adaptador

Modelo
En este archivo definimos los campos que contiene cada item que se mostraran en la lista .

Adaptador
El adaptador es como un puente entre la vista(Layout) y los datos que queremos mostrar, su trabajo es convertir los datos de un arreglo , Base de datos , archivo JSON o cualquier fuente a un formato que entienda nuestro ListView.

Vista Modficada
Este Layout lo vamos a utilizar como una vista especifica con nuestros colores y etiquetas personalizadas.

Crear Layout y Class

Lo primero que vamos hacer es crear un Activity ->Empty Activity

Vamos a ir al Layout que yo llame lista1 y vamos a agregar un ListView.

 <ListView
        android:layout_width="344dp"
        android:layout_height="495dp"
        tools:layout_editor_absoluteX="8dp"
        tools:layout_editor_absoluteY="8dp" />
</android.support.constraint.ConstraintLayout>

Por el momento eso esto lo que haremos con estos archivos. Mas adelante haremos cambios en el lista1.class (El archivo Java que se genera con el Activity).

Vista Modificada

Esta vista nos ayuda a personalizar la forma en que vemos la información de nuestra lista. Para esto crearemos un layout new->Layout resource file

En mi caso es una lista con datos como nombre, edad  y la opción ver mas.

Modelo

El modelo nos servira para definir los datos que se mostraran en la lista y definir los métodos get y set de cada uno de ellos.

Vamos a crear un nuevo archivo con new->Java Class y le asignamos un nombre en el ejemplo se llama Mlista1.

Lo primero que vamos a hacer es definir los datos o campos que necesitamos.

public class Mlista1 {
    private String nombre;
    private Integer edad;
}

Para generar los métodos get y set podemos seleccionar las variables y después Alt+ins.

 

 Adapter

Tenemos dos opciones crear nuestros propios Adaptadores para una lista sencilla podemos utilizar una base proporcionada por Android. En este ejemplo usaremos esta base que incluye Android, para hacerlo vamos a new->Java class  vamos a seleccionar en superclass android.widget.BaseAdapter

Al crearse la clase nos marcara un error, basta con permitir  la opción Implementar Métodos para resolverlo.

Lo primero que vamos hacer es declarar una activity y el modelo que vamos a usar.

protected Activity activity;
protected List<MCOmentarios> item;

Vamos a crear un método para la vista y los datos del Modelo. También agregue una función para limpiar la lista y otra para contar la cantidad de los items.

public AdapterComentarios(Activity activity, List<MCOmentarios> item){
    this.activity = activity;
    this.item=item;
}

public void clear(){item.clear();}
@Override
public int getCount() {
    return item.size();
}

Antes de continuar vamos a cambiar los int i de los métodos por int position y en el método getCount vamos a cambiar lo que retorna  por  item.size().

Lo segundo importante es los cambios en la función View, lo primero que vamos a hacer es indicar cual es la vista que vamos a usar para mostrar los items de la lista. En el ejemplo se llama custom_list1 (Es nuestra vista modificada).

public View getView(int position, View convertView, ViewGroup parent) {
    View v =  convertView;
 if (convertView == null) {
LayoutInflater inf = (LayoutInflater) activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        v = inf.inflate(R.layout.custom_list1, null);

Ahora vamos autilizar el modelo para obtener la posición de cada item, asi tambien verifico que cada item no traiga consigo vcio el campo nombre, de no ser asi entonces asigno el nombre de las etiquetas para poder asignarles los datos que vienen del Modelo, para lo cual utilizo el metodo get que corresponda al dato.

nombre=(TextView) v.findViewById(R.id.txtnombrel);
nombre.setText(dir.getNombre());

Por lo cual queda de la siguiente forma.

MLista1 dir=item.get(position);
if(!dir.getNombre().isEmpty()){

    TextView nombre,edad;
    nombre=(TextView) v.findViewById(R.id.txtnombrel);
    edad=(TextView) v.findViewById(R.id.txtedadl);

    nombre.setText(dir.getNombre());
    edad.setText(dir.getEdad());

Class Activity (Archivo Java)

En este archivo es el .class que se crea con la actividad. Vamos usar este archivo para pasar los datos al Adapter para llenar los items de la lista.

Dentro de la función onCreate vamos a verificar que el layout llamados es activity_list1 la cual solo contiene el ListView.

Después declaramos la lista  con la sentencia ListVIew list; el siguiente paso es decirle que la Lista  usara el modelo Mlista1 (List<Mlista1> mAdapter = new ArrayList<Mlista1>();) por ultimo creamos un objeto con el modelo Mlista1  Mlista1 match;

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_lista1);

    ListView list;
    List<Mlista1> mAdapter = new ArrayList<Mlista1>();
    Mlista1 match;

En este ejemplo vamos a pasar los datos desde este archivo (podemos hacerlo desde una BD o un archivo JSON), podemos repetir esta misma estructura según la cantidad de item que vamos a mostrar.

match = new Mlista1();
match.setNombre("Luis");
match.setEdad(18);
mAdapter.add(match);

El ultimo paso es mandarle los datos a nuestro adapter Adapterlista1 adapter2 = new Adapterlista1(this, mAdapter); y usando este adapter con datos le pasamos los datos al ListView list.setAdapter(adapter2);

Adapterlista1 adapter2 = new Adapterlista1(this, mAdapter);
list = (ListView) findViewById(R.id.lista1);
list.setAdapter(adapter2);

Resultado

Con estos pasos obtendremos la siguiente salida.

Espero que esta información les se ha de utilidad, si tienen alguna duda o quieren dejar información adicional sobre el tutorial por favor dejen sus comentarios.

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.