Scaffold in Android using Jetpack Compose

Scaffold in Android using Jetpack Compose

 

The “Scaffold” is a layout template that contains a basic implementation of the material design app structure with the following components:

  • TopBar
  • BottomBar
  • FloatingActionButton
  • Drawer
  • Sample demo using Scaffold in Android
@Composable
fun ScaffoldDemo() {
    val materialBlue700= Color(0xFF1976D2)
        val scaffoldState = rememberScaffoldState(rememberDrawerState(DrawerValue.Open))
        Scaffold(
                scaffoldState = scaffoldState,
                topBar = { TopAppBar(title = {Text("TopAppBar")},backgroundColor = materialBlue700)  },
                floatingActionButtonPosition = FabPosition.End,
                floatingActionButton = { FloatingActionButton(onClick = {}){
                    Text("X")
                } },
                drawerContent = { Text(text = "drawerContent") },
                content = { Text("BodyContent") },
                bottomBar = { BottomAppBar(backgroundColor = materialBlue700) { Text("BottomAppBar") } }
        )
}