Android Jetpack Compose - Floating Action Button of custom image

Viewed 1031

I write this code.

    Image (
        painter = painterResource(id = R.drawable.image),
        contentDescription = "fab",
        modifier = Modifier
            .size(80.dp)
            .clickable(
                interactionSource = remember { MutableInteractionSource() },
                indication = rememberRipple(true),
                onClick = { /* TODO */ }
            )
    )

But, I use Scaffold. So I want to use floating action button or extended floating action button. How can I use floating action button and custom image. I have a circular photo to use for the button.

    Scaffold(
        topBar = {},
        content = {},
        floatingActionButton = {
            Image {
                /* How can I wrire */
            }
        }
    )
1 Answers

You can use something like:

Scaffold(
    topBar = {},
    content = {},
    floatingActionButton = {
        FloatingActionButton(onClick = { /*TODO*/ }) {
            Image (
                painter = painterResource(id = R.drawable.xxxx),
                contentDescription = "fab",
                contentScale = ContentScale.FillBounds
            )
        }
    }
)

enter image description here

Related