Can anyone let me know which library you use for showing skeleton in Compose, and how you handle it?

# compose

[Asad Mukhtar]

Can anyone let me know which library you use for showing skeleton in Compose, and how you handle it?

[sindrenm]

We use https://google.github.io/accompanist/placeholder. Something like this:

@Composable
fun Skeleton() {
  Column {
    Text("Some heading", Modifier.placeholder(true))

    Text("Some body text", Modifier.placeholder(true))

    // In place of an image, for instance:
    Box(Modifier.clip(RoundedCornerShape(16.dp).placeholder(true))
  }
}

[sindrenm]

You may also want to add a shimmer effect, in which case you can add a highlight:

Modifier.placeholder(true, highlight = PlaceholderHighlight.shimmer())

[sindrenm]

Note that the above come from the .placeholder.material package and assumes a MaterialTheme being set. If that's not the case, there are alternatives in the .placeholder package (no .material, which allows setting the colors and shapes and stuff manually.

[sindrenm]

This is all documented on the link above, though.