Member-only story
Learning Android Development
Using Jetpack Compose Scaffold as Template
Making Initial Setup of Android App Easier
Published in
5 min readDec 16, 2020
Imagine if you want to build an App that has a customize AppBar, BottomBar, Floating Action Button, Snackbar, and Navigation Drawer, it sure needs lots of setup.
The good news is, in Jetpack Compose, a Scafffold
composable function is provided so that you can have that all in place easily.
Look at the code below…
setContent {
val scaffoldState = rememberScaffoldState(
rememberDrawerState(DrawerValue.Closed)
)
Scaffold(
scaffoldState = scaffoldState,
topBar = { MyTopAppBar(scaffoldState) },
bottomBar = { MyBottomAppBar() },
snackbarHost = { state -> MySnackHost(state) },
isFloatingActionButtonDocked = true,
floatingActionButtonPosition = FabPosition.Center,
floatingActionButton = { MyFloatingButton(scaffoldState) },
drawerContent = { MyDrawerConten(drawers) },
bodyContent = { MyBodyContent(body) }
)
}
By providing it with some customize composable functions, you can have them all as below.