מתכון ל-ViewModel משותף
במתכון הזה מוסבר איך לשתף ViewModel בין מסכים שונים (רשומות) ב-Navigation 3 באמצעות NavEntryDecorator בהתאמה אישית.
איך זה עובד
בדוגמה הזו מוגדרים שלושה מסכים:
-
ParentScreen: מוצג כפתור שמגדיל מונה, ומצב המונה נשמר ב-CounterViewModel. -
ChildScreen: מסך משנה שיכול לעדכן את מצב המונה שלParentScreenוגם את המצב המבודד שלו. -
StandaloneScreen: מסך עצמאי עם מצב מבודד משלו.
SharedViewModelStoreNavEntryDecorator
המרכיב העיקרי במתכון הזה הוא SharedViewModelStoreNavEntryDecorator. ה-decorator הזה מנהל ViewModelStores עבור רשומות ניווט. הוא מאפשר לציין רשומה אופציונלית של 'הורה' שאיתה צריך לשתף את ViewModelStore.
ב-SharedViewModelActivity.kt, ה-NavDisplay מוגדר עם המאפיין הזה:
entryDecorators = listOf(
rememberSaveableStateHolderNavEntryDecorator(),
rememberSharedViewModelStoreNavEntryDecorator(),
)
שיתוף ה-ViewModel
כדי להפעיל שיתוף, הרשומה ChildScreen מגדירה במפורש את ההורה שלה באמצעות מטא-נתונים:
entry<ChildScreen>(
metadata = SharedViewModelStoreNavEntryDecorator.parent(
ParentScreen.toContentKey()
)
) {
// ...
}
פונקציית התוסף toContentKey() משמשת לתקנון האופן שבו מצוין contentKey של רכיב האב NavEntry, גם בהגדרת רכיב האב וגם כשמתבצעת הפניה אליו במטא-נתונים על ידי רכיב הבן.
כשChildScreen מבקש אישור מההורים CounterViewModel:
val parentViewModel = viewModel<CounterViewModel>(
viewModelStoreOwner = LocalSharedViewModelStoreOwner.current
)
ה-decorator מוודא שהוא מקבל את אותו מופע שבו נעשה שימוש ב-ParentScreen, כי הוא משתמש ב-ViewModelStore של ParentScreen.
ChildScreen עדיין יכול/ה לבקש CounterViewModel משלו/ה מLocalViewModelStoreOwner שמוגדר כברירת מחדל:
val standaloneViewModel = viewModel<CounterViewModel>()
לעומת זאת, StandaloneScreen לא מגדיר הורה, ולכן הוא מקבל רק ViewModelStore חדש משלו ומופע חדש של CounterViewModel.
מייבאים את פונקציית האופרטור get כדי לקרוא ממטא-נתונים באמצעות NavMetadataKey
import androidx.navigation3.runtime.get
/* * Copyright 2025 The Android Open Source Project * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ package com.example.nav3recipes.sharedviewmodel import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.runtime.ProvidedValue import androidx.compose.runtime.remember import androidx.compose.runtime.staticCompositionLocalOf import androidx.lifecycle.ViewModel import androidx.lifecycle.ViewModelStore import androidx.lifecycle.ViewModelStoreOwner import androidx.lifecycle.viewmodel.ViewModelStoreProvider import androidx.lifecycle.viewmodel.compose.LocalViewModelStoreOwner import androidx.lifecycle.viewmodel.compose.rememberViewModelStoreOwner import androidx.lifecycle.viewmodel.compose.rememberViewModelStoreProvider import androidx.navigation3.runtime.NavEntry import androidx.navigation3.runtime.NavEntryDecorator import androidx.navigation3.runtime.NavMetadataKey import androidx.navigation3.runtime.SaveableStateHolderNavEntryDecorator import androidx.navigation3.runtime.get import androidx.navigation3.runtime.metadata import androidx.savedstate.compose.LocalSavedStateRegistryOwner /** * Returns a [SharedViewModelStoreNavEntryDecorator] that is remembered across recompositions. * * @param [viewModelStoreOwner] The [ViewModelStoreOwner] that provides the [ViewModelStore] to * NavEntries */ @Composable fun <T : Any> rememberSharedViewModelStoreNavEntryDecorator( viewModelStoreOwner: ViewModelStoreOwner = checkNotNull(LocalViewModelStoreOwner.current) { "No ViewModelStoreOwner was provided via LocalViewModelStoreOwner" }, ): SharedViewModelStoreNavEntryDecorator<T> { val viewModelStoreProvider = rememberViewModelStoreProvider(viewModelStoreOwner) return remember(viewModelStoreOwner) { SharedViewModelStoreNavEntryDecorator( viewModelStoreProvider, ) } } /** * Provides the content of a [NavEntry] with a new [ViewModelStoreOwner] and provides that * [ViewModelStoreOwner] as a [LocalViewModelStoreOwner] so that it is available within the content. * * If the [NavEntry] specifies that it has a parent in its metadata, the parent's * [ViewModelStoreOwner] will also be supplied along with the new one. This allows the * entry to access both its own [ViewModel] and its parent's [ViewModel]s. * * This requires the usage of [SaveableStateHolderNavEntryDecorator] to ensure that the [NavEntry] * scoped [ViewModel]s can properly provide access to [androidx.lifecycle.SavedStateHandle]s. * * @see [SharedViewModelStoreNavEntryDecorator.parent] * * @param [viewModelStoreProvider] The [ViewModelStoreProvider] scoped to * the parent [ViewModelStoreOwner] */ class SharedViewModelStoreNavEntryDecorator<T : Any>( viewModelStoreProvider: ViewModelStoreProvider ) : NavEntryDecorator<T>( onPop = { key -> viewModelStoreProvider.clearKey(key) }, decorate = { entry -> val localContentKey = entry.contentKey val localOwner = rememberViewModelStoreOwner( localContentKey, viewModelStoreProvider, savedStateRegistryOwner = LocalSavedStateRegistryOwner.current, ) val localValues: MutableList<ProvidedValue<*>> = mutableListOf(LocalViewModelStoreOwner provides localOwner) // If the entry indicates it has a parent, also provide its parent's ViewModelStore val parentContentKey = entry.metadata[ParentKey] if (parentContentKey != null) { val parentOwner = rememberViewModelStoreOwner( parentContentKey, viewModelStoreProvider, savedStateRegistryOwner = LocalSavedStateRegistryOwner.current, ) localValues.add(LocalSharedViewModelStoreOwner provides parentOwner) } CompositionLocalProvider( values = localValues.toTypedArray() ) { entry.Content() } }, ) { companion object { /** * Use this function to specify a `NavEntry`'s parent. The parent's * `ViewModelStoreOwner` will be supplied via `LocalSharedViewModelStoreOwner` */ fun parent(key: Any) = metadata { put(ParentKey, key) } object ParentKey : NavMetadataKey<Any> } } val LocalSharedViewModelStoreOwner = staticCompositionLocalOf<ViewModelStoreOwner> { error("No LocalSharedViewModelStoreOwner provided!") }
/* * Copyright 2025 The Android Open Source Project * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ package com.example.nav3recipes.sharedviewmodel import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.material3.Button import androidx.compose.material3.Text import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableIntStateOf import androidx.compose.runtime.setValue import androidx.lifecycle.ViewModel import androidx.lifecycle.compose.dropUnlessResumed import androidx.lifecycle.viewmodel.compose.viewModel import androidx.navigation3.runtime.NavKey import androidx.navigation3.runtime.entryProvider import androidx.navigation3.runtime.rememberNavBackStack import androidx.navigation3.runtime.rememberSaveableStateHolderNavEntryDecorator import androidx.navigation3.ui.NavDisplay import com.example.nav3recipes.content.ContentBlue import com.example.nav3recipes.content.ContentGreen import com.example.nav3recipes.content.ContentRed import com.example.nav3recipes.ui.setEdgeToEdgeConfig import kotlinx.serialization.Serializable @Serializable private data object ParentScreen : NavKey @Serializable private data object ChildScreen : NavKey @Serializable private data object StandaloneScreen : NavKey class SharedViewModelActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { setEdgeToEdgeConfig() super.onCreate(savedInstanceState) setContent { val backStack = rememberNavBackStack(ParentScreen) NavDisplay( backStack = backStack, onBack = { backStack.removeLastOrNull() }, entryDecorators = listOf( rememberSaveableStateHolderNavEntryDecorator(), rememberSharedViewModelStoreNavEntryDecorator(), ), entryProvider = entryProvider { entry<ParentScreen>( clazzContentKey = { key -> key.toContentKey() }, ) { val viewModel = viewModel<CounterViewModel>() ContentRed("Parent screen") { Button(onClick = { viewModel.count++ }) { Text("Count: ${viewModel.count}") } Button(onClick = dropUnlessResumed { backStack.add(ChildScreen) }) { Text("View child screen") } } } entry<ChildScreen>( metadata = SharedViewModelStoreNavEntryDecorator.parent( ParentScreen.toContentKey() ) ) { val parentViewModel = viewModel<CounterViewModel>( viewModelStoreOwner = LocalSharedViewModelStoreOwner.current ) val standaloneViewModel = viewModel<CounterViewModel>() ContentBlue("Child screen") { Button(onClick = { parentViewModel.count++ }) { Text("Parent count: ${parentViewModel.count}") } Button(onClick = { standaloneViewModel.count++ }) { Text("Standalone Count: ${standaloneViewModel.count}") } Button(onClick = dropUnlessResumed { backStack.add(StandaloneScreen) }) { Text("View standalone screen") } } } entry<StandaloneScreen> { val viewModel = viewModel<CounterViewModel>() ContentGreen("Standalone screen") { Button(onClick = { viewModel.count++ }) { Text("Count: ${viewModel.count}") } } } } ) } } } fun NavKey.toContentKey() = this.toString() class CounterViewModel : ViewModel() { var count by mutableIntStateOf(0) }