Le ViewPager est un composant de l'itnerface utilisateur Android qui permet de naviguer entre différantes pages de contenu par un glissement horizontal (swipe). Pour gérer le cycle de vie et l'affichage de ces pages, il s'appuie sur la classe abstraite PagerAdapter.

Comprendre la classe PagerAdapter

Pour créer un adaptateur personnalisé, il est impératif d'implémenter les quatre méthodes suivantes :

• getCount() : Retourne le nombre total de vues disponibles dans le ViewPager.
• instantiateItem(ViewGroup container, int position) : Cette méthode est responsable de la création de la page pour une position donnée. Elle doit ajouter la vue au conteneur et retourner un objet servant d'identifiant (souvent la vue elle-même).
• isViewFromObject(View view, Object object) : Vérifie si une vue spécifique est associée à l'objet identifiant retourné par instantiateItem. La comparaison standard est return view == object;.
• destroyItem(ViewGroup container, int position, Object object) : Supprime une page du conteneur lorsqu'elle n'est plus affichée, optimisant ainsi la mémoire.

Structure des fichiers de mise en page (Layouts)

Le layout principal doit contenir le widget ViewPager provenant de la bilbiothèque AndroidX.

<!-- activity_main.xml -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical">

   <androidx.viewpager.widget.ViewPager
       android:id="@+id/pager_principal"
       android:layout_width="match_parent"
       android:layout_height="match_parent" />

</LinearLayout>

Voici un exemple de layout réutilisable pour les pages individuelles :

<!-- item_page.xml -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:id="@+id/background_layout"
   android:layout_width="match_parent"
   android:layout_height="match_parent">

   <TextView
       android:id="@+id/page_title"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_centerInParent="true"
       android:textSize="24sp" />

</RelativeLayout>

Développement de l'adaptateur personnalisé

L'adaptateur fait le lien entre les données (une liste de vues) et le composant ViewPager.

public class MonPagerAdapter extends PagerAdapter {
   private List<View> listeVues;

   public MonPagerAdapter(List<View> listeVues) {
       this.listeVues = listeVues;
   }

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

   @Override
   public boolean isViewFromObject(View view, Object object) {
       return view == object;
   }

   @Override
   public Object instantiateItem(ViewGroup container, int position) {
       View vuePage = listeVues.get(position);
       container.addView(vuePage);
       return vuePage;
   }

   @Override
   public void destroyItem(ViewGroup container, int position, Object object) {
       container.removeView((View) object);
   }
}

Initialisation dans l'Activity

L'Activity se charge de gonfler (inflate) les layouts, de les stocker dans une liste et de configurer l'adaptateur.

public class MainActivity extends AppCompatActivity {

   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);

       LayoutInflater gonfleur = LayoutInflater.from(this);
       List<View> mesPages = new ArrayList<>();

       // Création de la première page
       View p1 = gonfleur.inflate(R.layout.item_page, null);
       p1.findViewById(R.id.background_layout).setBackgroundColor(Color.parseColor("#FFEEEE"));
       ((TextView)p1.findViewById(R.id.page_title)).setText("Page Accueil");
       mesPages.add(p1);

       // Création de la deuxième page
       View p2 = gonfleur.inflate(R.layout.item_page, null);
       p2.findViewById(R.id.background_layout).setBackgroundColor(Color.parseColor("#EEFFEE"));
       ((TextView)p2.findViewById(R.id.page_title)).setText("Page Paramètres");
       mesPages.add(p2);

       // Liaison avec le ViewPager
       ViewPager viewPager = findViewById(R.id.pager_principal);
       MonPagerAdapter adaptateur = new MonPagerAdapter(mesPages);
       viewPager.setAdapter(adaptateur);
   }
}