Hi guys, in compose is there anyway that we could detect content from the child is bigger than its p...

# compose

[stevie]

Hi guys, in compose is there anyway that we could detect content from the child is bigger than its parent?
I used onSizeChanged for the child but it max height is same as the parent only

Box(
    modifier = Modifier.onSizeChanged {
        val height = destiny.run { limit.toPx().toDp() }
        isLarger = limit < height
    },
)

[Alex Styl]

what are you trying to achieve? (as in why do you need this)

[stevie]

I want to achieve something like this

[Alex Styl]

how does your question relate to what you are trying to achieve? im confused abt which part of your design you are struggling with

[stevie]

If the content is bigger than its parent, show the blur and 3 dots,
otherwise, just show the child and it's parent based on the child height

[Zach Klippenstein (he/him) [MOD]]

You could make a layout that composes the three dots and then measures the text element and only places the dots if the text element is too big (and decide whether to draw the gradient) You can use TextMeasurer or onTextLayoutResult to check if text will overflow if you want specific information about how much text will be cut off.

[stevie]

@Zach Klippenstein (he/him) [MOD] I haven't try this, but look like your solution is only works for Text, right?
I expect to work with all kind of childs

[Zach Klippenstein (he/him) [MOD]]

No it will work for anything. Just not the text measuring part, but I only mentioned those in case you cared where the text was truncated.