Genie logiciel igl241 ionic app
Thème :
Junior
1 vues ·4/9 leçons

4. Les Onglets et les Pages (Tabs)

Le cœur de ce projet repose sur les onglets. Dans le dossier src/app/, vous voyez :

  • Un dossier tabs/
  • Des dossiers tab1/, tab2/, et tab3/

Comment ça marche ?

  1. Le composant “Tabs” (src/app/tabs/) C’est le composant qui sert de conteneur général. Son fichier HTML (tabs.page.html) contient une barre <ion-tab-bar> en bas de l’écran avec trois boutons <ion-tab-button>. Quand vous cliquez sur l’un de ces boutons, l’application charge la page correspondante dans la partie principale de l’écran.

  2. Les Pages “Tab1”, “Tab2”, “Tab3” Chacun de ces dossiers est une “Page” indépendante.

    • Si vous voulez modifier ce qui s’affiche sur la première page de votre application, vous ouvrez src/app/tab1/tab1.page.html.
    • Vous pouvez y ajouter du texte, des listes, des images à l’intérieur de la balise <ion-content>.

Composant réutilisable

Avez-vous remarqué le dossier explore-container ? C’est un petit composant créé automatiquement par Ionic que Tab1, Tab2 et Tab3 utilisent pour afficher le message par défaut. C’est un excellent exemple de la façon dont on peut créer un morceau de code (le container) et l’inclure dans plusieurs pages !

Prêt à passer à la suite ?

Vous avez terminé cette leçon sur 4. Les Onglets et les Pages (Tabs). Continuez votre apprentissage avec la prochaine leçon ou explorez d'autres formations.