Improve top bar

Change-Id: I7b3ef8fb15990773b6aee9c6c2efc10fccb7be19
feature/interests-list-detail
Miłosz Moczkowski 1 year ago
parent f94c4018e3
commit ea34249aa5

@ -145,7 +145,7 @@ fun NiaApp(
destinations = appState.topLevelDestinations, destinations = appState.topLevelDestinations,
destinationsWithUnreadResources = unreadDestinations, destinationsWithUnreadResources = unreadDestinations,
onNavigateToDestination = appState::navigateToTopLevelDestination, onNavigateToDestination = appState::navigateToTopLevelDestination,
currentDestination = appState.currentBackStackEntry?.destination, currentDestination = appState.currentDestination,
modifier = Modifier.testTag("NiaBottomBar"), modifier = Modifier.testTag("NiaBottomBar"),
) )
} }
@ -167,7 +167,7 @@ fun NiaApp(
destinations = appState.topLevelDestinations, destinations = appState.topLevelDestinations,
destinationsWithUnreadResources = unreadDestinations, destinationsWithUnreadResources = unreadDestinations,
onNavigateToDestination = appState::navigateToTopLevelDestination, onNavigateToDestination = appState::navigateToTopLevelDestination,
currentDestination = appState.currentBackStackEntry?.destination, currentDestination = appState.currentDestination,
modifier = Modifier modifier = Modifier
.testTag("NiaNavRail") .testTag("NiaNavRail")
.safeDrawingPadding(), .safeDrawingPadding(),
@ -176,10 +176,10 @@ fun NiaApp(
Column(Modifier.fillMaxSize()) { Column(Modifier.fillMaxSize()) {
// Show the top app bar on top level destinations. // Show the top app bar on top level destinations.
val destination = appState.currentTopLevelDestination val destination = appState.topBarTitle
if (destination != null) { if (destination != null) {
NiaTopAppBar( NiaTopAppBar(
titleRes = destination.titleTextId, titleRes = destination,
navigationIcon = NiaIcons.Search, navigationIcon = NiaIcons.Search,
navigationIconContentDescription = stringResource( navigationIconContentDescription = stringResource(
id = settingsR.string.top_app_bar_navigation_icon_description, id = settingsR.string.top_app_bar_navigation_icon_description,

@ -21,10 +21,12 @@ import androidx.compose.material3.windowsizeclass.WindowSizeClass
import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable import androidx.compose.runtime.Stable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.runtime.rememberCoroutineScope
import androidx.navigation.NavBackStackEntry import androidx.navigation.NavBackStackEntry
import androidx.navigation.NavController import androidx.navigation.NavController
import androidx.navigation.NavDestination
import androidx.navigation.NavGraph.Companion.findStartDestination import androidx.navigation.NavGraph.Companion.findStartDestination
import androidx.navigation.NavHostController import androidx.navigation.NavHostController
import androidx.navigation.compose.currentBackStackEntryAsState import androidx.navigation.compose.currentBackStackEntryAsState
@ -86,24 +88,34 @@ class NiaAppState(
networkMonitor: NetworkMonitor, networkMonitor: NetworkMonitor,
userNewsResourceRepository: UserNewsResourceRepository, userNewsResourceRepository: UserNewsResourceRepository,
) { ) {
val currentBackStackEntry: NavBackStackEntry? val currentDestination: NavDestination?
@Composable get() = navController @Composable get() = navController
.currentBackStackEntryAsState().value .currentBackStackEntryAsState().value?.destination
val currentTopLevelDestination: TopLevelDestination? val topBarTitle: Int?
@Composable get() { @Composable get() {
val route: String? = currentBackStackEntry?.destination?.route val backStackEntry: NavBackStackEntry? by navController.currentBackStackEntryAsState()
val arguments: Bundle? = currentBackStackEntry?.arguments val route: String? = backStackEntry?.destination?.route
val arguments: Bundle? = backStackEntry?.arguments
return when { return when {
route == forYouNavigationRoute -> FOR_YOU route == forYouNavigationRoute -> FOR_YOU.titleTextId
route == bookmarksRoute -> BOOKMARKS route == bookmarksRoute -> BOOKMARKS.titleTextId
route == interestsRoute && route == interestsRoute &&
(arguments?.getString(topicIdArg) == null || shouldShowTwoPane) -> INTERESTS (arguments?.getString(topicIdArg) == null || shouldShowTwoPane) -> INTERESTS.titleTextId
else -> null else -> null
} }
} }
val currentTopLevelDestination: TopLevelDestination?
@Composable get() = when (currentDestination?.route) {
forYouNavigationRoute -> FOR_YOU
bookmarksRoute -> BOOKMARKS
interestsRoute -> INTERESTS
else -> null
}
val shouldShowGradientBackground: Boolean val shouldShowGradientBackground: Boolean
@Composable get() = currentBackStackEntry?.destination?.route == forYouNavigationRoute @Composable get() = currentTopLevelDestination == FOR_YOU
val shouldShowBottomBar: Boolean val shouldShowBottomBar: Boolean
get() = windowSizeClass.widthSizeClass == WindowWidthSizeClass.Compact get() = windowSizeClass.widthSizeClass == WindowWidthSizeClass.Compact

@ -30,6 +30,7 @@ import androidx.compose.foundation.layout.windowInsetsBottomHeight
import androidx.compose.foundation.lazy.grid.GridCells import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.GridItemSpan import androidx.compose.foundation.lazy.grid.GridItemSpan
import androidx.compose.foundation.lazy.grid.LazyGridScope import androidx.compose.foundation.lazy.grid.LazyGridScope
import androidx.compose.foundation.lazy.grid.LazyGridState
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.rememberLazyGridState import androidx.compose.foundation.lazy.grid.rememberLazyGridState
import androidx.compose.foundation.selection.selectableGroup import androidx.compose.foundation.selection.selectableGroup
@ -59,9 +60,6 @@ import com.google.samples.apps.nowinandroid.core.ui.TrackScrollJank
import com.google.samples.apps.nowinandroid.core.ui.UserNewsResourcePreviewParameterProvider import com.google.samples.apps.nowinandroid.core.ui.UserNewsResourcePreviewParameterProvider
import com.google.samples.apps.nowinandroid.core.ui.newsFeed import com.google.samples.apps.nowinandroid.core.ui.newsFeed
import com.google.samples.apps.nowinandroid.feature.interests.R.string import com.google.samples.apps.nowinandroid.feature.interests.R.string
import com.google.samples.apps.nowinandroid.feature.interests.TopicUiState.Error
import com.google.samples.apps.nowinandroid.feature.interests.TopicUiState.Loading
import com.google.samples.apps.nowinandroid.feature.interests.TopicUiState.Success
@Composable @Composable
internal fun TopicScreen( internal fun TopicScreen(
@ -72,13 +70,13 @@ internal fun TopicScreen(
onBookmarkChanged: (String, Boolean) -> Unit, onBookmarkChanged: (String, Boolean) -> Unit,
onNewsResourceViewed: (String) -> Unit, onNewsResourceViewed: (String) -> Unit,
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
gridState: LazyGridState = rememberLazyGridState(),
) { ) {
val state = rememberLazyGridState() TrackScrollJank(scrollableState = gridState, stateName = "topic:screen")
TrackScrollJank(scrollableState = state, stateName = "topic:screen")
LazyVerticalGrid( LazyVerticalGrid(
columns = GridCells.Adaptive(300.dp), columns = GridCells.Adaptive(300.dp),
state = state, state = gridState,
verticalArrangement = Arrangement.spacedBy(16.dp), verticalArrangement = Arrangement.spacedBy(16.dp),
modifier = modifier modifier = modifier
.selectableGroup() .selectableGroup()
@ -93,13 +91,13 @@ internal fun TopicScreen(
) )
} }
Error -> { TopicUiState.Error -> {
item { item {
Text(text = stringResource(id = string.topic_error)) Text(text = stringResource(id = string.topic_error))
} }
} }
is Success -> { is TopicUiState.Success -> {
item(span = { GridItemSpan(maxLineSpan) }) { item(span = { GridItemSpan(maxLineSpan) }) {
TopicToolbar( TopicToolbar(
onBackClick = onBackClick, onBackClick = onBackClick,
@ -238,7 +236,7 @@ fun TopicScreenPopulated(
NiaTheme { NiaTheme {
NiaBackground { NiaBackground {
TopicScreen( TopicScreen(
topicUiState = Success( topicUiState = TopicUiState.Success(
followableTopic = userNewsResources[0].followableTopics[0], followableTopic = userNewsResources[0].followableTopics[0],
newsResources = userNewsResources, newsResources = userNewsResources,
), ),
@ -258,7 +256,7 @@ fun TopicScreenLoading() {
NiaTheme { NiaTheme {
NiaBackground { NiaBackground {
TopicScreen( TopicScreen(
topicUiState = Loading, topicUiState = TopicUiState.Loading,
onBackClick = {}, onBackClick = {},
onFollowClick = { _, _ -> }, onFollowClick = { _, _ -> },
onBookmarkChanged = { _, _ -> }, onBookmarkChanged = { _, _ -> },

Loading…
Cancel
Save