Voici une grille Android basique utilisant RecyclerView avec GridLayoutManager
Le composant "RecyclerView" est utilisé pour créer les interfaces des applications Android. Il est apparu avec la version 7 de la bibliothèque de support et remplace les anciens composants "ListView" et "GridView". Il est plus customisable que ses prédécesseurs car il peut aussi bien gérer des dispositions horizontales que verticales dans une application. Pour utiliser le composant "RecyclerView", il est nécessaire de vérifier les dépendances du projet et ensuite de créer plusieurs fichiers (autre astuce à consulter : ProgressDialog dépréciée : quelle alternative ?).
La première étape consiste à vérifier les dépendances de votre projet. Pour cela, ouvrez le fichier "build.gradle" et assurez-vous d'importer au minimum les librairies suivantes. Si vous utilisez Gradle dans une version antérieure à la version 3, le mot-clé "compile" remplace le mot-clé "implementation".
implementation 'com.android.support:appcompat-v7:27.1.1' implementation 'com.android.support:recyclerview-v7:27.1.1'
Bien entendu, les versions ultérieures des librairies fonctionnent également.
Le premier fichier à implémenter est le layout principal de l'activité. C'est dans ce fichier XML que l'on déclare l'utilisation de la "RecyclerView". On a pour cela recours à des balises spécifiques au SDK d'Android. Les largeurs et hauteurs sont fixées à la même valeur que celle du parent, l'application en elle-même.
<?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="match_parent">
<android.support.v7.widget.RecyclerView android:id="@+id/rvNumbers" android:layout_width="match_parent" android:layout_height="match_parent"/>
</RelativeLayout>
On crée également un autre fichier XML. Celui-ci va correspondre au contenu d'une cellule. La grille utilisée dans cette application contiendra plusieurs cellules. Dans une cellule, on indique un composant "TextView", il permet de contenir du texte et peut être paramétré facilement selon vos besoins.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:padding="5dp" android:layout_width="50dp" android:layout_height="50dp">
<TextView android:id="@+id/info_text" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:background="@color/colorAccent"/>
</LinearLayout>
L'étape suivante est la création de l'adaptateur lié à votre vue. C'est ce fichier Java qui va remplir les "TextView" avec comme texte leur position dans la grille. Cet adaptateur intègre également la gestion des clics sur les éléments de la grille. Il ne vous reste plus qu'à le modifier selon vos propres idées.
public class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.ViewHolder> {
private String[] tabDonnee;
private LayoutInflater mInflater;
private ItemClickListener mClickListener;
//Les données de la grille sont passées en paramètre au constructeur de la classe
MyRecyclerViewAdapter(Context contexte, String[] tabDonnee) {
this.mInflater = LayoutInflater.from(contexte);
this.tabDonnee = tabDonnee;
}
// Met en place l'affichage de la vue à partir des éléments des fichiers XML
@Override
@NonNull
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = mInflater.inflate(R.layout.recyclerview_item, parent, false);
return new ViewHolder(view);
}
// Méthode qui remplit la "Textview" avec la donnée
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
holder.myTextView.setText(tabDonnee[position]);
}
//Méthode comptant le nombre total de cellules
@Override
public int getItemCount() {
return tabDonnee.length;
}
// Méthode qui stocke et réutilise les cellules au fur et à mesure du défilement de l'écran
public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
TextView maVue;
ViewHolder(View objet) {
super(objet);
maVue = objet.findViewById(R.id.info_text);
objet.setOnClickListener(this);
}
@Override
public void onClick(View objet) {
if (mClickListener != null) mClickListener.onItemClick(objet, getAdapterPosition());
}
}
// Méthode pour détecter quel objet a été cliqué
String getItem(int id) {
return tabDonnee[id];
}
// Méthode liant la fonction de gestion du clic à l'évènement de clic
void setClickListener(ItemClickListener itemClickListener) {
this.mClickListener = itemClickListener;
}
// Les activités parentes devront implémenter cette méthode pour répondre au clic sur la vue
public interface ItemClickListener {
void onItemClick(View vue, int position);
}
}
La dernière étape consiste à modifier l'activité principale pour initialiser la vue. Ouvrez le fichier Java de votre activité pour y insérer le code ci-dessous. Si vous souhaitez gérer le clic sur votre grille, vous devez implémenter l'interface "ItemClickListener".
public class MainActivity extends AppCompatActivity implements MyRecyclerViewAdapter.ItemClickListener {
MyRecyclerViewAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Données qui seront affichées dans la grille
String[] tabDonnee = {"1-1", "1-2", "1-3", "1-4", "2-1", "2-2", "2-3", "2-4", "3-1", "3-2", "3-3", "3-4", "4-1", "4-2", "4-3", "4-4"};
// set up the RecyclerView
RecyclerView vue = findViewById(R.id.rvNumbers);
int numberOfColumns = 4;
recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
adapter = new MyRecyclerViewAdapter(this, tabDonnee);
adapter.setClickListener(this);
vue.setAdapter(adapter);
}
//Méthode appelée lors du clic sur un élément de la vue
@Override
public void onItemClick(View vue, int position) {
Log.i("TAG", "Vous avez cliqué sur la cellule " + adapter.getItem(position) + ", qui est à la position" + position);
}
}