How to Align the Icon to the End in TopAppBar jetpack compose

Question

Now the icon always in the start, what should I do to align the icon to the end? I tried to use modifier but doesn't work. Thank you in advance.

Answer 1

If you want an Icon aligned at the end in the TopAppBar use the actions parameter instead of the navigationIcon.

Something like:

TopAppBar(
    title = { Text("Simple TopAppBar") },
    backgroundColor = Red,
    actions = {
        // RowScope here, so these icons will be placed horizontally
        IconButton(onClick = { /* doSomething() */ }) {
            Icon(Icons.Filled.Close, contentDescription = null)
        }
    }
)