Ajouter Jetpack Compose à votre application

Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.

Si vous souhaitez utiliser Jetpack Compose dans un projet existant, vous devez configurer votre projet avec les dépendances et les paramètres requis.

Configurer l'environnement de développement

Installer la bonne version d'Android Studio

Pour bénéficier d'une expérience de développement optimale avec Jetpack Compose, vous devez télécharger Android Studio et configurer le plug-in Android Gradle correspondant à la version d'Android Studio :

buildscript {
    ...
    dependencies {
        classpath "com.android.tools.build:gradle:7.3.1"
        ...
    }
}

Configurer le langage Kotlin

Assurez-vous d'utiliser la version 1.7.20 du langage Kotlin dans votre projet :

plugins {
    id 'kotlin-android'
}

Configurer Gradle

Vous devez définir le niveau d'API minimal de votre application sur 21 ou plus, activer Jetpack Compose dans le fichier build.gradle de votre application et ajouter les dépendances de la bibliothèque, comme indiqué dans le Guide de démarrage rapide.

Réutiliser vos thèmes View dans Compose

Si vous venez d'ajouter Compose à votre projet, notez qu'il est possible de migrer les thèmes disponibles dans le système de vues, ce qui évite de réécrire votre propre thème Material dans Compose.

Si vous utilisez la bibliothèque MDC dans votre application Android, l'adaptateur de thème MDC pour Compose vous permet de réutiliser facilement les couleurs, la typographie et la thématisation de forme de vos thèmes basés sur les vues dans vos composables. Pour ce faire, utilisez l'API MdcTheme.

Si vous utilisez des thèmes XML AppCompat, utilisez l'adaptateur de thème AppCompat Compose qui contient l'API AppCompatTheme.

Incluez la dépendance dont vous avez besoin dans le fichier build.gradle de votre application, comme indiqué ci-dessous :

dependencies {
    // When using a MDC theme
    implementation "com.google.android.material:compose-theme-adapter:1.1.16"

    // When using a AppCompat theme
    implementation "com.google.accompanist:accompanist-appcompat-theme:0.25.1"
}

Commencer la migration vers Compose

Consultez la section Stratégie de migration pour découvrir comment commencer votre migration vers Compose. Vous y verrez comment intégrer Compose de manière sécurisée et incrémentielle dans votre codebase.

Pour plus d'informations sur ComposeView et d'autres API d'interopérabilité, consultez le guide sur les API d'interopérabilité. Pour en savoir plus sur les autres API de ressources dans Compose, consultez le guide Ressources dans Compose​LINK 2.

Tester votre interface utilisateur mixte Compose/Vues

Après avoir migré certaines parties de votre application vers Compose, vous devez effectuer des tests pour vous assurer que vous n'avez rien endommagé.

Lorsqu'une activité ou un fragment utilise Compose, au lieu de ActivityScenarioRule, vous devez utiliser createAndroidComposeRule qui intègre ActivityScenarioRule avec une ComposeTestRule qui vous permet de tester Compose et d'afficher le code dans le même temps.

class MyActivityTest {
    @Rule
    @JvmField
    val composeTestRule = createAndroidComposeRule<MyActivity>()

    @Test
    fun testGreeting() {
        val greeting = InstrumentationRegistry.getInstrumentation()
            .targetContext.resources.getString(R.string.greeting)

        composeTestRule.onNodeWithText(greeting).assertIsDisplayed()
    }
}

Consultez le guide Tester votre mise en page Compose pour en savoir plus sur les tests et l'interopérabilité avec Espresso.

Si vous utilisez le composant Navigation dans votre application, consultez la section Interopérabilité du guide de navigation avec Compose.

Étapes suivantes

Pour en savoir plus sur Compose, consultez l'index de la documentation. Il existe différentes approches pour adopter Compose dans votre application. Pour en savoir plus à ce sujet, consultez le guide d'adoption de Compose dans votre application, qui contient des liens vers d'autres guides tels que Intégrer Compose dans une architecture d'application existante et Intégrer Compose dans une UI existante.