Capitulo 18 ➜ Componente GridView

Un GridView es un tipo de vista de Android que se utiliza para mostrar elementos en una cuadrícula desplazable bidimensional. Los elementos se insertan en este diseño de cuadrícula desde una base de datos o desde una matriz. El adaptador se utiliza para mostrar estos datos, el método setAdapter() se utiliza para unir el adaptador con GridView.

Pasos para usar un GridView en Android Studio:

1. Crear un nuevo proyecto en Android Studio.

Para crear un nuevo proyecto en Android Studio, siga estos pasos:

1. Abra Android Studio.
2. Seleccione Archivo > Nuevo > Proyecto.
3. Introduzca un nombre para su proyecto y haga clic en Siguiente.
4. Seleccione Actividad vacía y haga clic en Siguiente.
5. Seleccione Finalizar.

2. Agregar las dependencias necesarias.

Para utilizar un GridView, debe agregar la siguiente dependencia a su archivo build.gradle:

dependencies {
    implementation 'androidx.gridlayout:gridlayout:1.0.0'
}

3. Trabajar con los archivos XML.

Debe crear dos archivos XML: uno para el diseño de la actividad y otro para el diseño de los elementos de la cuadrícula.

Diseño de la actividad:

El diseño de la actividad debe contener un GridView. Puede crear el diseño de la actividad utilizando el editor de diseño de Android Studio o definiendo el diseño en XML.

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.gridlayout.widget.GridView
        android:id="@+id/gridview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Diseño del elemento de la cuadrícula:

El diseño del elemento de la cuadrícula debe definir el diseño de los elementos que se mostrarán en la cuadrícula. Puede crear el diseño del elemento de la cuadrícula utilizando el editor de diseño de Android Studio o definiendo el diseño en XML.

XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/image"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:scaleType="centerCrop" />

    <TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="18sp" />

</LinearLayout>

4. Crear un adaptador.

Debe crear un adaptador para mostrar los elementos en la cuadrícula. Puede crear un adaptador personalizado o utilizar un adaptador existente, como ArrayAdapter.

Java

public class MyAdapter extends BaseAdapter {

    private Context context;
    private List<String> items;

    public MyAdapter(Context context, List<String> items) {
        this.context = context;
        this.items = items;
    }

    @Override
    public int getCount() {
        return items.size();
    }

    @Override
    public Object getItem(int position) {
        return items.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            convertView = LayoutInflater.from(context).inflate(R.layout.grid_item, parent, false);
        }

        TextView text = convertView.findViewById(R.id.text);
        text.setText(items.get(position));

        return convertView;
    }
}