Hello all. I am trying to figure out how to verti...

# compose

[Billy Newman]

Hello all. I am trying to figure out how to vertically center a child in compose. And then position its sibling directly above it.

[Stylianos Gakis]

Do you care if the container is not big enough to host those two that the container itself grows in size too?

[Stylianos Gakis]

If yes, a custom layout for this should be quite straightforward to make. Measure them both.
Place the one you want in the center at the center, and place the other one right above it.
Make sure the container size is at least as big as the center item + 2 times the outer item since you need space at the bottom too for it to be centered still

[Billy Newman]

I am coming from a non compose xml layout where I used a relative view, centered a child and then aligned the other child to the top of the first. I do apologize, I am having trouble wrapping my head around this in compose.

I have tried to put both components in a Box layout, However I don’t believe that you can align a sibling to another sibling.

[Stylianos Gakis]

I just remembered some months/year ago we had some UI which was I think was close to what you want.
I pulled this from some old app version from git, give it a look https://github.com/HedvigInsurance/android/blob/release%2F10.2.0/app%2Fsrc%2Fmain%2Fkotlin%2Fcom%2Fhedvig%2Fapp%2Fui%2Fcompose%2Fcomposables%2FCenteredContentWithTopBadge.kt

[Stylianos Gakis]

Not guaranteed that it’s bug free, copy the code and play around with it, make changes etc
LMK If it does work though 😊

[Billy Newman]

TY