Move navigation state to a ViewModel with SavedStateHandler to survive process death.

Author: objcode

JetNews/app/build.gradle

@@ -75,6 +75,10 @@ dependencies {
     implementation 'androidx.activity:activity-ktx:1.1.0'
     implementation 'androidx.core:core-ktx:1.5.0-alpha01'
 
+    implementation "androidx.ui:ui-livedata:$compose_version"
+
+    implementation "androidx.lifecycle:lifecycle-viewmodel-savedstate:2.3.0-alpha04"
+
     androidTestImplementation 'junit:junit:4.13'
     androidTestImplementation 'androidx.test:rules:1.2.0'
     androidTestImplementation 'androidx.test:runner:1.2.0'

JetNews/app/src/androidTest/java/com/example/jetnews/TestHelper.kt

@@ -18,6 +18,8 @@ package com.example.jetnews
 
 import android.content.Context
 import androidx.compose.Composable
+import androidx.compose.remember
+import androidx.lifecycle.SavedStateHandle
 import androidx.ui.material.MaterialTheme
 import androidx.ui.material.Surface
 import androidx.ui.test.ComposeTestRule
@@ -26,23 +28,25 @@ import androidx.ui.test.findAll
 import androidx.ui.test.hasSubstring
 import com.example.jetnews.ui.JetnewsApp
 import com.example.jetnews.ui.JetnewsStatus
-import com.example.jetnews.ui.Screen
+import com.example.jetnews.ui.NavigationViewModel
 
 /**
  * Launches the app from a test context
  */
 fun ComposeTestRule.launchJetNewsApp(context: Context) {
     setContent {
         JetnewsStatus.resetState()
-        JetnewsApp(TestAppContainer(context))
+        JetnewsApp(
+            TestAppContainer(context),
+            remember { NavigationViewModel(SavedStateHandle()) }
+        )
     }
 }
 
 /**
  * Resets the state of the app. Needs to be executed in Compose code (within a frame)
  */
 fun JetnewsStatus.resetState() {
-    currentScreen = Screen.Home
     favorites.clear()
     selectedTopics.clear()
 }

JetNews/app/src/main/java/com/example/jetnews/ui/JetnewsApp.kt

@@ -1,5 +1,5 @@
 /*
- * Copyright 2020 The Android Open Source Project
+ * Copyright (C) 2020 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.
@@ -53,9 +53,13 @@ import com.example.jetnews.ui.interests.InterestsScreen
 import com.example.jetnews.ui.theme.JetnewsTheme
 
 @Composable
-fun JetnewsApp(appContainer: AppContainer) {
+fun JetnewsApp(
+    appContainer: AppContainer,
+    navigationViewModel: NavigationViewModel
+) {
     JetnewsTheme {
         AppContent(
+            navigationViewModel = navigationViewModel,
             interestsRepository = appContainer.interestsRepository,
             postsRepository = appContainer.postsRepository
         )
@@ -64,17 +68,25 @@ fun JetnewsApp(appContainer: AppContainer) {
 
 @Composable
 private fun AppContent(
+    navigationViewModel: NavigationViewModel,
     postsRepository: PostsRepository,
     interestsRepository: InterestsRepository
 ) {
-    Crossfade(JetnewsStatus.currentScreen) { screen ->
+    Crossfade(navigationViewModel.currentScreen) { screen ->
         Surface(color = MaterialTheme.colors.background) {
             when (screen) {
-                is Screen.Home -> HomeScreen(postsRepository = postsRepository)
-                is Screen.Interests -> InterestsScreen(interestsRepository = interestsRepository)
+                is Screen.Home -> HomeScreen(
+                    navigateTo = navigationViewModel::navigateTo,
+                    postsRepository = postsRepository
+                )
+                is Screen.Interests -> InterestsScreen(
+                    navigateTo = navigationViewModel::navigateTo,
+                    interestsRepository = interestsRepository
+                )
                 is Screen.Article -> ArticleScreen(
                     postId = screen.postId,
-                    postsRepository = postsRepository
+                    postsRepository = postsRepository,
+                    onBack = { navigationViewModel.onBack() }
                 )
             }
         }
@@ -83,6 +95,7 @@ private fun AppContent(
 
 @Composable
 fun AppDrawer(
+    navigateTo: (Screen) -> Unit,
     currentScreen: Screen,
     closeDrawer: () -> Unit
 ) {
@@ -191,7 +204,8 @@ private fun DrawerButton(
 fun PreviewJetnewsApp() {
     ThemedPreview {
         AppDrawer(
-            currentScreen = JetnewsStatus.currentScreen,
+            navigateTo = { },
+            currentScreen = Screen.Home,
             closeDrawer = { }
         )
     }
@@ -202,7 +216,8 @@ fun PreviewJetnewsApp() {
 fun PreviewJetnewsAppDark() {
     ThemedPreview(darkTheme = true) {
         AppDrawer(
-            currentScreen = JetnewsStatus.currentScreen,
+            navigateTo = { },
+            currentScreen = Screen.Home,
             closeDrawer = { }
         )
     }

JetNews/app/src/main/java/com/example/jetnews/ui/Status.kt renamed to JetNews/app/src/main/java/com/example/jetnews/ui/JetnewsStatus.kt

@@ -17,28 +17,8 @@
 package com.example.jetnews.ui
 
 import androidx.compose.frames.ModelList
-import androidx.compose.getValue
-import androidx.compose.mutableStateOf
-import androidx.compose.setValue
-
-/**
- * Class defining the screens we have in the app: home, article details and interests
- */
-sealed class Screen {
-    object Home : Screen()
-    data class Article(val postId: String) : Screen()
-    object Interests : Screen()
-}
 
 object JetnewsStatus {
-    var currentScreen by mutableStateOf<Screen>(Screen.Home)
     val favorites = ModelList<String>()
     val selectedTopics = ModelList<String>()
 }
-
-/**
- * Temporary solution pending navigation support.
- */
-fun navigateTo(destination: Screen) {
-    JetnewsStatus.currentScreen = destination
-}

JetNews/app/src/main/java/com/example/jetnews/ui/MainActivity.kt

@@ -17,18 +17,27 @@
 package com.example.jetnews.ui
 
 import android.os.Bundle
+import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
 import androidx.ui.core.setContent
 import com.example.jetnews.JetnewsApplication
 
 class MainActivity : AppCompatActivity() {
 
+    val navigationViewModel by viewModels<NavigationViewModel>()
+
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
 
         val appContainer = (application as JetnewsApplication).container
         setContent {
-            JetnewsApp(appContainer = appContainer)
+            JetnewsApp(appContainer, navigationViewModel)
+        }
+    }
+
+    override fun onBackPressed() {
+        if (!navigationViewModel.onBack()) {
+            super.onBackPressed()
         }
     }
 }

JetNews/app/src/main/java/com/example/jetnews/ui/Navigation.kt

@@ -0,0 +1,147 @@
+/*
+ * Copyright (C) 2020 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.jetnews.ui
+
+import android.os.Bundle
+import androidx.annotation.MainThread
+import androidx.compose.frames.ModelList
+import androidx.compose.getValue
+import androidx.compose.setValue
+import androidx.core.os.bundleOf
+import androidx.lifecycle.SavedStateHandle
+import androidx.lifecycle.ViewModel
+import com.example.jetnews.ui.Screen.Article
+import com.example.jetnews.ui.Screen.Home
+import com.example.jetnews.ui.Screen.Interests
+import com.example.jetnews.ui.ScreenName.ARTICLE
+import com.example.jetnews.ui.ScreenName.HOME
+import com.example.jetnews.ui.ScreenName.INTERESTS
+import com.example.jetnews.utils.getMutableStateOf
+
+/**
+ * Screen names (used for serialization)
+ */
+enum class ScreenName { HOME, INTERESTS, ARTICLE }
+
+/**
+ * Class defining the screens we have in the app: home, article details and interests
+ */
+sealed class Screen(val id: ScreenName) {
+    object Home : Screen(HOME)
+    object Interests : Screen(INTERESTS)
+    data class Article(val postId: String) : Screen(ARTICLE)
+}
+
+/**
+ * Helpers for saving and loading a [Screen] object to a [Bundle].
+ *
+ * This allows us to persist navigation across process death, for example caused by a long video
+ * call.
+ */
+private const val SIS_SCREEN = "sis_screen"
+private const val SIS_NAME = "screen_name"
+private const val SIS_POST = "post"
+
+/**
+ * Convert a screen to a bundle that can be stored in [SavedStateHandle]
+ */
+private fun Screen.toBundle(): Bundle {
+    return bundleOf(SIS_NAME to id.name).also {
+        // add extra keys for various types here
+        if (this is Article) {
+            it.putString(SIS_POST, postId)
+        }
+    }
+}
+
+/**
+ * Read a bundle stored by [Screen.toBundle] and return desired screen.
+ *
+ * @return the parsed [Screen]
+ * @throws IllegalArgumentException if the bundle could not be parsed
+ */
+private fun Bundle.toScreen(): Screen {
+    val screenName = ScreenName.valueOf(getStringOrThrow(SIS_NAME))
+    return when (screenName) {
+        HOME -> Home
+        INTERESTS -> Interests
+        ARTICLE -> {
+            val postId = getStringOrThrow(SIS_POST)
+            Article(postId)
+        }
+    }
+}
+
+/**
+ * Throw [IllegalArgumentException] if key is not in bundle.
+ *
+ * @see Bundle.getString
+ */
+private fun Bundle.getStringOrThrow(key: String) =
+    requireNotNull(getString(key)) { "Missing key '$key' in $this" }
+
+/**
+ * This is expected to be replaced by the navigation component, but for now handle navigation
+ * manually.
+ *
+ * Instantiate this ViewModel at the scope that is fully-responsible for navigation, which in this
+ * application is [MainActivity].
+ *
+ * This app has simplified navigation; the back stack is always [Home] or [Home, dest] and more
+ * levels are not allowed. To use a similar pattern with a longer back stack, use a [ModelList] to
+ * hold the back stack state.
+ */
+class NavigationViewModel(private val savedStateHandle: SavedStateHandle) : ViewModel() {
+    /**
+     * Hold the current screen in an observable, restored from savedStateHandle after process
+     * death.
+     *
+     * mutableStateOf is an observable similar to LiveData that's designed to be read by compose. It
+     * supports observability via property delegate syntax as shown here.
+     */
+    var currentScreen: Screen by savedStateHandle.getMutableStateOf<Screen>(
+        key = SIS_SCREEN,
+        default = Home,
+        save = { it.toBundle() },
+        restore = { it.toScreen() }
+    )
+        private set // limit the writes to only inside this class.
+
+    /**
+     * Go back (always to [Home]).
+     *
+     * Returns true if this call caused user-visible navigation. Will always return false
+     * when [currentScreen] is [Home].
+     */
+    @MainThread
+    fun onBack(): Boolean {
+        val wasHandled = currentScreen != Home
+        currentScreen = Home
+        return wasHandled
+    }
+
+    /**
+     * Navigate to requested [Screen].
+     *
+     * If the requested screen is not [Home], it will always create a back stack with one element:
+     * ([Home] -> [screen]). More back entries are not supported in this app.
+     */
+    @MainThread
+    fun navigateTo(screen: Screen) {
+        currentScreen = screen
+    }
+}

JetNews/app/src/main/java/com/example/jetnews/ui/article/ArticleScreen.kt

@@ -53,25 +53,23 @@ import com.example.jetnews.data.posts.impl.BlockingFakePostsRepository
 import com.example.jetnews.data.posts.impl.post3
 import com.example.jetnews.data.successOr
 import com.example.jetnews.model.Post
-import com.example.jetnews.ui.Screen
 import com.example.jetnews.ui.ThemedPreview
 import com.example.jetnews.ui.effect.fetchPost
 import com.example.jetnews.ui.home.BookmarkButton
 import com.example.jetnews.ui.home.isFavorite
 import com.example.jetnews.ui.home.toggleBookmark
-import com.example.jetnews.ui.navigateTo
 import com.example.jetnews.ui.state.UiState
 
 @Composable
-fun ArticleScreen(postId: String, postsRepository: PostsRepository) {
+fun ArticleScreen(postId: String, postsRepository: PostsRepository, onBack: () -> Unit) {
     val postsState = fetchPost(postId, postsRepository)
     if (postsState is UiState.Success<Post>) {
-        ArticleScreen(postsState.data)
+        ArticleScreen(postsState.data, onBack)
     }
 }
 
 @Composable
-private fun ArticleScreen(post: Post) {
+private fun ArticleScreen(post: Post, onBack: () -> Unit) {
 
     var showDialog by state { false }
     if (showDialog) {
@@ -89,7 +87,7 @@ private fun ArticleScreen(post: Post) {
                     )
                 },
                 navigationIcon = {
-                    IconButton(onClick = { navigateTo(Screen.Home) }) {
+                    IconButton(onClick = onBack) {
                         Icon(Icons.Filled.ArrowBack)
                     }
                 }
@@ -165,7 +163,7 @@ private fun sharePost(post: Post, context: Context) {
 fun PreviewArticle() {
     ThemedPreview {
         val post = loadFakePost(post3.id)
-        ArticleScreen(post)
+        ArticleScreen(post, {})
     }
 }
 
@@ -174,7 +172,7 @@ fun PreviewArticle() {
 fun PreviewArticleDark() {
     ThemedPreview(darkTheme = true) {
         val post = loadFakePost(post3.id)
-        ArticleScreen(post)
+        ArticleScreen(post, {})
     }
 }