mirror of
https://github.com/msfjarvis/compose-lobsters
synced 2025-08-18 04:27:02 +05:30
LobstersApp: replace with a BackgroundScaffold
Signed-off-by: Harsh Shandilya <me@msfjarvis.dev>
This commit is contained in:
parent
d82228483d
commit
be58017cac
1 changed files with 49 additions and 88 deletions
|
@ -1,114 +1,75 @@
|
||||||
package dev.msfjarvis.lobsters.ui.main
|
package dev.msfjarvis.lobsters.ui.main
|
||||||
|
|
||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.Spacer
|
||||||
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
|
import androidx.compose.foundation.layout.height
|
||||||
import androidx.compose.foundation.lazy.rememberLazyListState
|
import androidx.compose.foundation.lazy.rememberLazyListState
|
||||||
import androidx.compose.material.BottomNavigation
|
import androidx.compose.material.BackdropScaffold
|
||||||
import androidx.compose.material.BottomNavigationItem
|
import androidx.compose.material.BackdropScaffoldDefaults
|
||||||
import androidx.compose.material.Scaffold
|
import androidx.compose.material.BackdropValue
|
||||||
import androidx.compose.material.Text
|
import androidx.compose.material.Text
|
||||||
|
import androidx.compose.material.rememberBackdropScaffoldState
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.runtime.collectAsState
|
import androidx.compose.runtime.collectAsState
|
||||||
import androidx.compose.runtime.getValue
|
import androidx.compose.runtime.getValue
|
||||||
import androidx.compose.runtime.rememberCoroutineScope
|
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.platform.testTag
|
|
||||||
import androidx.compose.ui.res.stringResource
|
import androidx.compose.ui.res.stringResource
|
||||||
|
import androidx.compose.ui.text.font.FontWeight
|
||||||
|
import androidx.compose.ui.text.style.TextAlign
|
||||||
|
import androidx.compose.ui.unit.sp
|
||||||
import androidx.lifecycle.viewmodel.compose.viewModel
|
import androidx.lifecycle.viewmodel.compose.viewModel
|
||||||
import androidx.navigation.compose.KEY_ROUTE
|
|
||||||
import androidx.navigation.compose.NavHost
|
|
||||||
import androidx.navigation.compose.composable
|
|
||||||
import androidx.navigation.compose.currentBackStackEntryAsState
|
|
||||||
import androidx.navigation.compose.navigate
|
|
||||||
import androidx.navigation.compose.rememberNavController
|
|
||||||
import androidx.paging.compose.collectAsLazyPagingItems
|
import androidx.paging.compose.collectAsLazyPagingItems
|
||||||
import dev.msfjarvis.lobsters.ui.navigation.Destination
|
import dev.msfjarvis.lobsters.R
|
||||||
import dev.msfjarvis.lobsters.ui.posts.HottestPosts
|
import dev.msfjarvis.lobsters.ui.posts.HottestPosts
|
||||||
import dev.msfjarvis.lobsters.ui.posts.SavedPosts
|
import dev.msfjarvis.lobsters.ui.posts.SavedPosts
|
||||||
import dev.msfjarvis.lobsters.ui.viewmodel.LobstersViewModel
|
import dev.msfjarvis.lobsters.ui.viewmodel.LobstersViewModel
|
||||||
import dev.msfjarvis.lobsters.util.IconResource
|
|
||||||
import kotlinx.coroutines.launch
|
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
fun LobstersApp() {
|
fun LobstersApp() {
|
||||||
val viewModel: LobstersViewModel = viewModel()
|
val viewModel: LobstersViewModel = viewModel()
|
||||||
val coroutineScope = rememberCoroutineScope()
|
val scaffoldState = rememberBackdropScaffoldState(initialValue = BackdropValue.Concealed)
|
||||||
val navController = rememberNavController()
|
BackdropScaffold(
|
||||||
|
scaffoldState = scaffoldState,
|
||||||
|
gesturesEnabled = false,
|
||||||
|
appBar = {
|
||||||
|
Spacer(modifier = Modifier.height(BackdropScaffoldDefaults.PeekHeight.times(0.3f)))
|
||||||
|
Text(
|
||||||
|
text = stringResource(id = R.string.app_name),
|
||||||
|
textAlign = TextAlign.Center,
|
||||||
|
fontSize = 18.sp,
|
||||||
|
fontWeight = FontWeight.Bold,
|
||||||
|
modifier = Modifier.fillMaxWidth(),
|
||||||
|
)
|
||||||
|
Spacer(modifier = Modifier.height(BackdropScaffoldDefaults.PeekHeight.times(0.3f)))
|
||||||
|
},
|
||||||
|
backLayerContent = { BackgroundLayerContent(viewModel) },
|
||||||
|
) {
|
||||||
|
ForegroundLayerContent(viewModel)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Composable
|
||||||
|
fun ForegroundLayerContent(
|
||||||
|
viewModel: LobstersViewModel,
|
||||||
|
) {
|
||||||
val hottestPosts = viewModel.posts.collectAsLazyPagingItems()
|
val hottestPosts = viewModel.posts.collectAsLazyPagingItems()
|
||||||
val savedPosts by viewModel.savedPosts.collectAsState()
|
|
||||||
val hottestPostsListState = rememberLazyListState()
|
val hottestPostsListState = rememberLazyListState()
|
||||||
|
|
||||||
val navBackStackEntry by navController.currentBackStackEntryAsState()
|
HottestPosts(
|
||||||
val currentRoute =
|
posts = hottestPosts,
|
||||||
navBackStackEntry?.arguments?.getString(KEY_ROUTE) ?: Destination.startDestination.route
|
listState = hottestPostsListState,
|
||||||
val currentDestination = Destination.getDestinationFromRoute(currentRoute)
|
isPostSaved = viewModel::isPostSaved,
|
||||||
val navigateToDestination: (destination: Destination) -> Unit = { destination ->
|
saveAction = viewModel::toggleSave,
|
||||||
navController.navigate(destination.route) {
|
)
|
||||||
launchSingleTop = true
|
|
||||||
popUpTo(navController.graph.startDestination) { inclusive = false }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
val jumpToIndex: (Int) -> Unit = {
|
|
||||||
coroutineScope.launch {
|
|
||||||
hottestPostsListState.snapToItemIndex(it)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Scaffold(
|
|
||||||
bottomBar = {
|
|
||||||
LobstersBottomNav(
|
|
||||||
currentDestination,
|
|
||||||
navigateToDestination,
|
|
||||||
jumpToIndex,
|
|
||||||
)
|
|
||||||
},
|
|
||||||
) { innerPadding ->
|
|
||||||
NavHost(navController, startDestination = Destination.startDestination.route) {
|
|
||||||
composable(Destination.Hottest.route) {
|
|
||||||
HottestPosts(
|
|
||||||
posts = hottestPosts,
|
|
||||||
listState = hottestPostsListState,
|
|
||||||
isPostSaved = viewModel::isPostSaved,
|
|
||||||
saveAction = viewModel::toggleSave,
|
|
||||||
modifier = Modifier.padding(bottom = innerPadding.calculateBottomPadding()),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
composable(Destination.Saved.route) {
|
|
||||||
SavedPosts(
|
|
||||||
posts = savedPosts,
|
|
||||||
saveAction = viewModel::toggleSave,
|
|
||||||
modifier = Modifier.padding(bottom = innerPadding.calculateBottomPadding()),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
fun LobstersBottomNav(
|
fun BackgroundLayerContent(
|
||||||
currentDestination: Destination,
|
viewModel: LobstersViewModel,
|
||||||
navigateToDestination: (destination: Destination) -> Unit,
|
|
||||||
jumpToIndex: (index: Int) -> Unit,
|
|
||||||
) {
|
) {
|
||||||
BottomNavigation(modifier = Modifier.testTag("LobstersBottomNav")) {
|
val savedPosts by viewModel.savedPosts.collectAsState()
|
||||||
Destination.values().forEach { screen ->
|
SavedPosts(
|
||||||
BottomNavigationItem(
|
posts = savedPosts,
|
||||||
icon = {
|
saveAction = viewModel::toggleSave,
|
||||||
IconResource(
|
)
|
||||||
resourceId = screen.badgeRes,
|
|
||||||
contentDescription = stringResource(screen.labelRes),
|
|
||||||
)
|
|
||||||
},
|
|
||||||
label = { Text(stringResource(id = screen.labelRes)) },
|
|
||||||
selected = currentDestination == screen,
|
|
||||||
alwaysShowLabels = false,
|
|
||||||
onClick = {
|
|
||||||
if (screen != currentDestination) {
|
|
||||||
navigateToDestination(screen)
|
|
||||||
} else if (screen.route == Destination.Hottest.route) {
|
|
||||||
jumpToIndex(0)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue