Compose und andere Bibliotheken

Sie können Ihre bevorzugten Bibliotheken in Compose verwenden. In diesem Abschnitt wird beschrieben, wie Sie einige der nützlichsten Bibliotheken einbinden.

Aktivität

Wenn Sie Compose in einer Aktivität verwenden möchten, müssen Sie ComponentActivity verwenden, eine Unterklasse von Activity, die die entsprechenden LifecycleOwner und Komponenten für Compose bereitstellt. Außerdem werden zusätzliche APIs bereitgestellt, mit denen Sie Ihren Code von überschreibenden Methoden in Ihrer Aktivitätsklasse entkoppeln können. Mit Activity Compose werden diese APIs für Composables verfügbar gemacht, sodass das Überschreiben von Methoden außerhalb Ihrer Composables oder das Abrufen einer expliziten Activity-Instanz nicht mehr erforderlich ist. Außerdem sorgen diese APIs dafür, dass sie nur einmal initialisiert werden, die Neuzusammenstellung überstehen und ordnungsgemäß bereinigt werden, wenn die Composable aus der Komposition entfernt wird.

Aktivitätsergebnis

Mit der rememberLauncherForActivityResult()-API können Sie ein Ergebnis aus einer Aktivität abrufen:

@Composable
fun GetContentExample() {
    var imageUri by remember { mutableStateOf<Uri?>(null) }
    val launcher = rememberLauncherForActivityResult(ActivityResultContracts.GetContent()) { uri: Uri? ->
        imageUri = uri
    }
    Column {
        Button(onClick = { launcher.launch("image/*") }) {
            Text(text = "Load Image")
        }
        Image(
            painter = rememberAsyncImagePainter(imageUri),
            contentDescription = "My Image"
        )
    }
}
ComposeWithOtherLibraries.kt

Dieses Beispiel zeigt einen einfachen GetContent()-Vertrag. Durch Tippen auf die Schaltfläche wird die Anfrage gesendet. Das nachgestellte Lambda für rememberLauncherForActivityResult() wird aufgerufen, sobald der Nutzer ein Bild auswählt und zur Startaktivität zurückkehrt. Dadurch wird das ausgewählte Bild mit der rememberImagePainter()-Funktion von Coil geladen.

Jede Unterklasse von ActivityResultContract kann als erstes Argument für rememberLauncherForActivityResult() verwendet werden. Das bedeutet, dass Sie diese Technik verwenden können, um Inhalte vom Framework und in anderen gängigen Mustern anzufordern. Sie können auch eigene benutzerdefinierte Verträge erstellen und mit dieser Methode verwenden.

Laufzeitberechtigungen anfordern

Dieselbe Activity Result API und rememberLauncherForActivityResult(), die oben beschrieben wurden, können verwendet werden, um Laufzeitberechtigungen anzufordern. Dazu wird der Vertrag RequestPermission für eine einzelne Berechtigung oder der Vertrag RequestMultiplePermissions für mehrere Berechtigungen verwendet.

Die Accompanist Permissions-Bibliothek kann auch als Ebene über diesen APIs verwendet werden, um den aktuellen gewährten Status für Berechtigungen in einen Status zu übertragen, den Ihre Compose-UI verwenden kann.

Zurück-Taste des Systems

Wenn Sie eine benutzerdefinierte Zurück-Navigation bereitstellen und das Standardverhalten der System-Zurück-Schaltfläche in Ihrem Composable überschreiben möchten, kann Ihr Composable ein BackHandler verwenden, um dieses Ereignis abzufangen:

var backHandlingEnabled by remember { mutableStateOf(true) }
BackHandler(backHandlingEnabled) {
    // Handle back press
}
ComposeWithOtherLibraries.kt

Mit dem ersten Argument wird gesteuert, ob BackHandler derzeit aktiviert ist. Sie können dieses Argument verwenden, um Ihren Handler basierend auf dem Status Ihrer Komponente vorübergehend zu deaktivieren. Das nachgestellte Lambda wird aufgerufen, wenn der Nutzer ein Systemereignis zum Zurückgehen auslöst und BackHandler derzeit aktiviert ist.

ViewModel

Wenn Sie die Architecture Components-Bibliothek „ViewModel“ verwenden, können Sie über den Aufruf der Funktion viewModel() von jedem Composable aus auf ein ViewModel zugreifen. Fügen Sie Ihrer Gradle-Datei die folgende Abhängigkeit hinzu:

dependencies {
    implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5'
}

dependencies {
    implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5")
}

Anschließend können Sie die Funktion viewModel() in Ihrem Code verwenden.

class MyViewModel : ViewModel() { /*...*/ }

// import androidx.lifecycle.viewmodel.compose.viewModel
@Composable
fun MyScreen(
    viewModel: MyViewModel = viewModel()
) {
    // use viewModel here
}
ComposeWithOtherLibraries.kt

viewModel() gibt eine vorhandene ViewModel zurück oder erstellt eine neue. Standardmäßig ist der zurückgegebene ViewModel auf die umschließende Aktivität, das Fragment oder das Navigationsziel beschränkt und wird beibehalten, solange der Bereich aktiv ist.

Wenn das Composable beispielsweise in einer Aktivität verwendet wird, gibt viewModel() dieselbe Instanz zurück, bis die Aktivität abgeschlossen oder der Prozess beendet wird.

class MyViewModel : ViewModel() { /*...*/ }
// import androidx.lifecycle.viewmodel.compose.viewModel
@Composable
fun MyScreen(
    // Returns the same instance as long as the activity is alive,
    // just as if you grabbed the instance from an Activity or Fragment
    viewModel: MyViewModel = viewModel()
) { /* ... */ }

@Composable
fun MyScreen2(
    viewModel: MyViewModel = viewModel() // Same instance as in MyScreen
) { /* ... */ }
ComposeWithOtherLibraries.kt

Nutzungsrichtlinien

Normalerweise greifen Sie auf ViewModel-Instanzen in Composables auf Bildschirmebene zu, d. h. in der Nähe eines Stamm-Composable, das von einer Aktivität, einem Fragment oder einem Ziel eines Navigationsdiagramms aufgerufen wird. Das liegt daran, dass ViewModels standardmäßig auf diese Objekte auf Bildschirmebene beschränkt sind. Weitere Informationen zum Lebenszyklus und Umfang von ViewModel

Vermeiden Sie es, ViewModel-Instanzen an andere Composables zu übergeben, da dies das Testen dieser Composables erschweren und Vorschaubilder beschädigen kann. Übergeben Sie stattdessen nur die Daten und Funktionen, die sie als Parameter benötigen.

Sie können ViewModel-Instanzen verwenden, um den Status für Composables auf Unterbildschirmebene zu verwalten. Beachten Sie jedoch den Lebenszyklus und Gültigkeitsbereich von ViewModel. Wenn das Composable in sich geschlossen ist, sollten Sie Hilt verwenden, um ViewModel einzufügen. So müssen Sie keine Abhängigkeiten von übergeordneten Composables übergeben.

Wenn Ihr ViewModel Abhängigkeiten hat, akzeptiert viewModel() optional ViewModelProvider.Factory als Parameter.

Weitere Informationen zu ViewModel in Compose und zur Verwendung von Instanzen mit der Navigation Compose-Bibliothek oder mit Aktivitäten und Fragmenten finden Sie in der Interoperabilitäts-Dokumentation.

Datenstreams

Compose bietet Erweiterungen für die beliebtesten stream-basierten Lösungen von Android. Jede dieser Erweiterungen wird von einem anderen Artefakt bereitgestellt:

• LiveData.observeAsState() ist im androidx.compose.runtime:runtime-livedata:$composeVersion-Artefakt enthalten.
• Für Flow.collectAsState() sind keine zusätzlichen Abhängigkeiten erforderlich.
• Observable.subscribeAsState() im androidx.compose.runtime:runtime-rxjava2:$composeVersion- oder androidx.compose.runtime:runtime-rxjava3:$composeVersion-Artefakt enthalten.

Diese Artefakte werden als Listener registriert und stellen die Werte als State dar. Immer wenn ein neuer Wert ausgegeben wird, werden die Teile der Benutzeroberfläche neu zusammengesetzt, in denen state.value verwendet wird. In diesem Code wird ShowData beispielsweise jedes Mal neu zusammengesetzt, wenn exampleLiveData einen neuen Wert ausgibt.

// import androidx.lifecycle.viewmodel.compose.viewModel
@Composable
fun MyScreen(
    viewModel: MyViewModel = viewModel()
) {
    val dataExample = viewModel.exampleLiveData.observeAsState()

    // Because the state is read here,
    // MyScreen recomposes whenever dataExample changes.
    dataExample.value?.let {
        ShowData(dataExample)
    }
}
ComposeWithOtherLibraries.kt

Asynchrone Vorgänge in Compose

Mit Jetpack Compose können Sie asynchrone Vorgänge mithilfe von Coroutinen in Ihren Composables ausführen.

Weitere Informationen finden Sie in der Dokumentation zu Nebeneffekten für die APIs LaunchedEffect, produceState und rememberCoroutineScope.

Navigation

Die Navigationskomponente bietet Unterstützung für Jetpack Compose-Anwendungen. Weitere Informationen finden Sie unter Navigation mit Compose und Jetpack Navigation zu Navigation Compose migrieren.

Hilt

Hilt ist die empfohlene Lösung für die Abhängigkeitsinjektion in Android-Apps und funktioniert nahtlos mit Compose.

Die im ViewModel-Abschnitt erwähnte viewModel()-Funktion verwendet automatisch das ViewModel, das Hilt mit der Annotation @HiltViewModel erstellt. Wir haben eine Dokumentation mit Informationen zur ViewModel-Integration von Hilt bereitgestellt.

@HiltViewModel
class MyViewModel @Inject constructor(
    private val savedStateHandle: SavedStateHandle,
    private val repository: ExampleRepository
) : ViewModel() { /* ... */ }

// import androidx.lifecycle.viewmodel.compose.viewModel
@Composable
fun MyScreen(
    viewModel: MyViewModel = viewModel()
) { /* ... */ }
ComposeWithOtherLibraries.kt

Hilt und Navigation

Hilt lässt sich auch in die Navigation Compose-Bibliothek einbinden. Fügen Sie Ihrer Gradle-Datei die folgenden zusätzlichen Abhängigkeiten hinzu:

dependencies {
    implementation 'androidx.hilt:hilt-navigation-compose:1.2.0'
}

dependencies {
    implementation("androidx.hilt:hilt-navigation-compose:1.2.0")
}

Verwenden Sie bei Navigation Compose immer die hiltViewModel-Composable-Funktion, um eine Instanz Ihrer mit @HiltViewModel annotierten ViewModel abzurufen. Das funktioniert mit Fragmenten oder Aktivitäten, die mit @AndroidEntryPoint annotiert sind.

Wenn ExampleScreen beispielsweise ein Ziel in einem Navigationsdiagramm ist, rufen Sie hiltViewModel() auf, um eine Instanz von ExampleViewModel zu erhalten, die auf das Ziel beschränkt ist, wie im folgenden Code-Snippet gezeigt:

// import androidx.hilt.navigation.compose.hiltViewModel

@Composable
fun MyApp() {
    val navController = rememberNavController()
    val startRoute = "example"
    NavHost(navController, startDestination = startRoute) {
        composable("example") { backStackEntry ->
            // Creates a ViewModel from the current BackStackEntry
            // Available in the androidx.hilt:hilt-navigation-compose artifact
            val viewModel = hiltViewModel<MyViewModel>()
            MyScreen(viewModel)
        }
        /* ... */
    }
}
ComposeWithOtherLibraries.kt

Wenn Sie stattdessen die Instanz eines ViewModel abrufen müssen, die auf Navigationsrouten oder den Navigationsgraphen beschränkt ist, verwenden Sie die zusammensetzbare Funktion hiltViewModel und übergeben Sie das entsprechende backStackEntry als Parameter:

// import androidx.hilt.navigation.compose.hiltViewModel
// import androidx.navigation.compose.getBackStackEntry

@Composable
fun MyApp() {
    val navController = rememberNavController()
    val startRoute = "example"
    val innerStartRoute = "exampleWithRoute"
    NavHost(navController, startDestination = startRoute) {
        navigation(startDestination = innerStartRoute, route = "Parent") {
            // ...
            composable("exampleWithRoute") { backStackEntry ->
                val parentEntry = remember(backStackEntry) {
                    navController.getBackStackEntry("Parent")
                }
                val parentViewModel = hiltViewModel<ParentViewModel>(parentEntry)
                ExampleWithRouteScreen(parentViewModel)
            }
        }
    }
}
ComposeWithOtherLibraries.kt

Paging

Mit der Paging-Bibliothek können Sie Daten schrittweise laden. Sie wird in Compose unterstützt. Die Seite zum Paging-Release enthält Informationen zur zusätzlichen paging-compose-Abhängigkeit, die dem Projekt hinzugefügt werden muss, sowie deren Version.

Hier ist ein Beispiel für die Compose-APIs der Paging-Bibliothek:

@Composable
fun MyScreen(flow: Flow<PagingData<String>>) {
    val lazyPagingItems = flow.collectAsLazyPagingItems()
    LazyColumn {
        items(
            lazyPagingItems.itemCount,
            key = lazyPagingItems.itemKey { it }
        ) { index ->
            val item = lazyPagingItems[index]
            Text("Item is $item")
        }
    }
}
ComposeWithOtherLibraries.kt

Weitere Informationen zur Verwendung von Paging in Compose finden Sie in der Dokumentation zu Listen und Grids.

Maps

Mit der Maps Compose-Bibliothek können Sie Google Maps in Ihrer App bereitstellen. Hier ist ein Beispiel für die Verwendung:

@Composable
fun MapsExample() {
    val singapore = LatLng(1.35, 103.87)
    val cameraPositionState = rememberCameraPositionState {
        position = CameraPosition.fromLatLngZoom(singapore, 10f)
    }
    GoogleMap(
        modifier = Modifier.fillMaxSize(),
        cameraPositionState = cameraPositionState
    ) {
        Marker(
            state = remember { MarkerState(position = singapore) },
            title = "Singapore",
            snippet = "Marker in Singapore"
        )
    }
}
ComposeWithOtherLibraries.kt