```Box { One() Two() }``` I have 2 composables...
# compose
j
Copy code
Box {
  One()
  Two()
}
I have 2 composables inside a
Box()
. I’d like the Box to set its size to the size of
One()
and I’d also like that
Two()
adapts its size to the size of
One()
. Is this possible?
p
Could you give us a graphic example?
j
Not really but I can explain with different words:
Two()
is the actual Box content (a bunch of Text composables neatly arranged in a few Rows and Columns).
One()
is the background image which should fill the the size occupied by
Two()
. Right now if I set `One()`’s modifier to
fillMaxSize()
it will expand and take up the whole screen, but I’d just like for it to expand to the same size as
Two()
.
d
I think there's a wrapcontent modifier.
j
I’ve tried it but it doesn’t make things any better
d
Why not use the background modifier?
🙌 1
j
Yupp! Just randomly tried that too and it works!
p
In order to do that, I would have used ConstrainLayout
🙌 1
a
you can possibly work around this by either: 1. Creating your own Composable:
Layout(...)
2. or
Copy code
var oneSize by remember { mutableStateOf(IntSize(0, 0)) }
val dpWidth = with(density) { dropDownSize.width.toDp() }
val dpHeight = with(density) { dropDownSize.height.toDp() }

Box{ 
   One(modifier = Modifier.onSizeChanged { oneSize = it })
   Two(modifier = Modifier.size(width = dpWidth, height = dpHeight)
}