I am relatively new to Kotlin. Currently I am making a demo for an app, in the demo I have a CenterAlignedTopBar with a title and a navigationIcon. Eventually I want to use the navigationIcon to show a LazyColumn with links to different pages of the app, but I don't know where to start.
I have tried to use parts of an tutorial I followed to learn, tried to put an image in the topbar and searched online for an answer. I couldn't find an answer that was helpful.
Below you can find the code where I want to implement it.
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun PresentAppAppBar(
modifier: Modifier = Modifier,
) {
CenterAlignedTopAppBar(
title = { Text(stringResource(R.string.app_name)) },
navigationIcon = {
Icon(
imageVector = Icons.Filled.Menu,
modifier = Modifier
.clickable { /* TODO */ }
.padding(8.dp)
.size(32.dp),
contentDescription = null
)
},
modifier = modifier
)
}
I believe this will solve your problem (That is assuming i understand your issue)
`@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun AppBar(
) {
var showDropDownMenu by remember { mutableStateOf(false) }
TopAppBar(
{
Text(
text = "Top Bar Title",
)
}, actions = {
IconButton(
onClick = { showDropDownMenu = true }) {
Icon(Icons.Filled.MoreVert, null)
}
DropdownMenu(
showDropDown, { showDropDown = false }
// offset = DpOffset((-102).dp, (-64).dp),
) {
DropdownMenuItem(text = { Text(text = "Drop down item") }, leadingIcon = {
Icon(
Icons.Filled.Home
)
}, onClick = {
showDropDown = false
})
}
}
)
}
`