How can I draw a dividers between

Column

children?

Invoke the

Divider()

composable between each child.

Ah right. In my case i let callers of a custom composable specify the children of its internal

Column

. Then I want my custom composable to be able to add dividers in between each child. Maybe I need a custom Layout for this though

Are you not using

LazyColumnFor

?

Nah, just the regular one

It may be possible to do what you're describing, but I don't know enough about the more advanced APIs.

You’d probably need to do something like the old Table composable did for borders. Use a custom layout to measure and save where the spaces in between items are, then use something like the

drawContent

modifier to draw over/under the children in those spaces. If all your items are the same size, you can use the

spacedBy

arrangement with Column and just calculate where the dividers go without doing a custom layout.

Thanks Zach, I’ll give that a try. Any idea where I could find that Table composable by any chance? (I’m assuming it doesn’t exist anymore.)

Unfortunately it doesn’t exist, you’re right. Here’s something similar though: https://github.com/zach-klippenstein/compose-richtext/blob/f47c128a0d49597a7d8606f0edd3330070bc7e7c/richtext-ui/src/main/java/com/zachklipp/richtext/ui/Table.kt#L139-L158

thanks, this should help a lot 🙏

The main issue with that approach is that the first frame is rendered without the dividers unfortunately (i think this is one of the reasons why they removed the old Table composable)

maybe i need to re-think my component 🤔

If the measurements change on every frame (e.g. during animation), then yea the dividers will lag by a frame unfortunately.

Yes,

SubcomposeLayout

is designed exactly for these sort of use cases - you can avoid the 1f lag this way by measuring the content first, and then composing the dividers afterwards.

Neat, TIL. It's well past my ability to write code tonight, but i'll read up on

SubcomposeLayout

tomorrow. Thanks both!

@Louis Pullen-Freilich [G] Any docs on how to understand and use

SubcomposeLayout

?

both

LazyList

and

WithConstraints

use it, which are pretty different use cases so looking at their implementations is helpful.

You can take a look at the sample in the documentation, otherwise yes

LazyList

and

WithConstraints

can be useful. Or for a more high level 'component' point of view, you can see the

TabRow

implementation, or the upcoming Scaffold change that moves to using

SubcomposeLayout

cool,

TabRow

is doing dividers too, so this makes things pretty easy for me 🙂

Possible to add a screenshot of the final result to the gist?

Sure!