Comment intégrer Jetpack Compose dans un projet existant utilisant la mise en page XML?

Pour intégrer Jetpack Compose dans un projet Android existant avec une mise en page XML, vous pouvez utiliser Compose à l’intérieur de composants ou d’écrans individuels, sans réécrire toute l’interface utilisateur immédiatement.

Étapes principales:

1. Ajoutez les dépendances Compose dans build.gradle:

implementation "androidx.compose.ui:ui:<version>"
implementation "androidx.compose.material:material:<version>"
implementation "androidx.compose.ui:ui-tooling-preview:<version>"
implementation "androidx.activity:activity-compose:<version>"

2. Dans l’Activity ou le Fragment existant, créez un ComposeView et ajoutez-le à la hiérarchie ou utilisez setContent dans l’Activity:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MyComposeContent()
        }
    }
}

3. Pour mélanger avec XML, vous pouvez insérer ComposeView dans le XML:

<androidx.compose.ui.platform.ComposeView
    android:id="@+id/compose_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

Et dans le code:

val composeView = findViewById<ComposeView>(R.id.compose_view)
composeView.setContent {
    MyComposeContent()
}

Ainsi, vous pouvez migrer progressivement l’UI, en utilisant Compose pour de nouveaux écrans ou composants, tout en conservant la mise en page XML existante.