Navigation Component Kotlin : guide complet avec exemples

Qu'est-ce que le Navigation Component et pourquoi l'utiliser ?

Le Navigation Component est une bibliothèque Android développée par Google pour simplifier la navigation entre les écrans (fragments, Activity, dialogues) dans les applications Kotlin et Java. Intégrée à Android Jetpack, elle offre une méthode unifiée et prévisible pour gérer les transitions, traiter les arguments et gérer le bouton "Retour".

Pourquoi l'utiliser ? Sans le Navigation Component, les développeurs devaient écrire beaucoup de code répétitif : créer un FragmentManager, gérer la BackStack, transmettre des données via Bundle et surveiller l'état des transitions. Cette bibliothèque résout ces problèmes en proposant :

• Un éditeur de navigation visuel — un graphe de navigation en XML.
• Une transmission sécurisée des arguments grâce à Safe Args (plugin Gradle).
• Une gestion automatique de la BackStack — le bouton "Retour" fonctionne correctement.
• Les liens profonds (Deep Links) — transitions depuis des notifications ou des liens externes.
• Les animations de transition — configurations simples en XML.

Installation du Navigation Component

Le Navigation Component étant une bibliothèque Android, son installation passe par le système de build Gradle (et non pip ou npm). Ajoutez les dépendances dans le fichier build.gradle (niveau module, généralement app/build.gradle) :

// build.gradle (Module: app)
plugins {
    id 'com.android.application'
    id 'org.jetbrains.kotlin.android'
    id 'androidx.navigation.safeargs.kotlin' // pour Safe Args
}

android {
    // ... configurations standard
}

dependencies {
    implementation 'androidx.navigation:navigation-fragment-ktx:2.7.7'
    implementation 'androidx.navigation:navigation-ui-ktx:2.7.7'
    // Pour les Feature Modules (fonctionnalités dynamiques)
    implementation 'androidx.navigation:navigation-dynamic-features-fragment:2.7.7'
}

Assurez-vous également d'ajouter le plugin Safe Args dans le build.gradle racine :

// build.gradle (Project level)
plugins {
    id 'androidx.navigation.safeargs.kotlin' version '2.7.7' apply false
}

Après synchronisation de Gradle, la bibliothèque est prête à être utilisée.

Démarrage rapide avec un exemple de code

Créons une application simple avec deux écrans : HomeFragment et DetailFragment. L'utilisateur clique sur un bouton sur le premier écran et passe au second en transmettant une chaîne de caractères.

Étape 1 : Créez le fichier de navigation

Dans le dossier res/navigation, créez le fichier nav_graph.xml :

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/nav_graph"
    app:startDestination="@id/homeFragment">

    <fragment
        android:id="@+id/homeFragment"
        android:name="com.example.app.HomeFragment"
        android:label="Accueil"
        tools:layout="@layout/fragment_home">
        <action
            android:id="@+id/action_homeFragment_to_detailFragment"
            app:destination="@id/detailFragment" />
    </fragment>

    <fragment
        android:id="@+id/detailFragment"
        android:name="com.example.app.DetailFragment"
        android:label="Détail"
        tools:layout="@layout/fragment_detail">
        <argument
            android:name="message"
            app:argType="string" />
    </fragment>
</navigation>

Étape 2 : Configurez l'Activity

Dans activity_main.xml, ajoutez le NavHostFragment :

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