https://kotlinlang.org logo
#compose
Title
# compose
p

Peter

12/14/2023, 7:50 PM
Is there maybe a way, to measure height of composable and react to it's current height? Like for example show text, that display the height
Text(text = heightPx.toString())
.
p

Pablichjenkov

12/14/2023, 7:55 PM
Layout {}
s

Shahzad Ansari

12/14/2023, 7:56 PM
You could also user
onSizeChanged()
and
onGloballyPositioned{}
modifier extensions.
p

Peter

12/14/2023, 8:21 PM
Hm, I think I want to use the height during the current frame (not previous). I guess
SubcomposeLayout
maybe?
p

Pablichjenkov

12/14/2023, 8:38 PM
Layout Composable gives you the constraints, you can also use BoxWithConstraint which internally uses SubcomposeLatout. The performance of Layout is way better over SubcomposeLatout. Unless you need to measure the children composable twice, Layout should do the job.
p

Peter

12/14/2023, 8:53 PM
Let me know if I understand correctly. If I use
Layout
, I would need some sort of state for height.
var height by remember { MutableStateOf(0f)}
So when I measure the height of my element, I would update value of the height, which will in turn recompose and display height value to
Text
?
p

Pablichjenkov

12/14/2023, 9:18 PM
Not necessarily, you can have a scope to pass the constraints to your Composable, which will be a child of the Layout
p

Peter

12/14/2023, 9:35 PM
do you mind showing/writing a simple a simple example of this?
You can actually be more generic and pass the @Composable content from the parent Composable.
The key here is defining a Scope interface to be able to communicate between layout and its children composables. The Scope between parent and children composables is a standard pattern in compose I guess
You can Google for more examples of Layout {}. The easy way would be using BoxWithConstraint but you will lose rendering speed
z

Zach Klippenstein (he/him) [MOD]

12/14/2023, 9:51 PM
If you want to show it in the current frame, you have to use a SubcomposeLayout. But beware that is expensive and currently disables intrinsics.
2
👆 1
👆🏾 1
p

Pablichjenkov

12/14/2023, 9:52 PM
Yeah, notice Layout {} will pass twice
z

Zach Klippenstein (he/him) [MOD]

12/14/2023, 9:53 PM
The one exception is that if you don’t need to be picky about the rendering of the size, you can draw the text yourself and do it in the same frame without subcomposition, but then you need to estimate the size required to draw that text without actually measuring it.
If you’re working on a debug tool or something, that might be good enough.
p

Peter

12/14/2023, 10:02 PM
since
Layout
will pass twice, I was wondering if it might be same performant as
SubcomposeLayout
z

Zach Klippenstein (he/him) [MOD]

12/14/2023, 11:56 PM
They each have their own performance characteristics. but before performance is correctness: the non-subcompose approach can only render the size a frame late. It may also cause infinite recomposition loops (e.g. if measuring the text rendering the size causes the thing being measured to re-measure). Performance-wise, the
Layout
approach may cause an extra frame than would otherwise be necessary, but it would only do it when the size changes.
SubcomposeLayout
has an ongoing cost for the bookkeeping required to manage a whole separate composition.
p

Peter

12/15/2023, 9:07 AM
understood, thanks for answers guys
👍 1
2 Views