Fix long messages not being clickable (#6356)

* Fix long messages not being clickable

As @bmarty found out, `clip = true` causes the click event to be ignored in some cases. Since we have the shape we want to draw and we're using a custom `onDraw` modifier anyway to cut-out part of the path, we can just draw everything using the modifier and avoid using `clip = true`.

This seems to fix the issue.

* Fix clipping of images or other items that cover the bubble

* Fix borders being displayed for contents

* Extract the layer drawing logic into `drawInLayer` to simplify the inlined code. Remove redundant code, those changes are now in the `drawInLayer` block

* Workaround for lint issue: it seems like detekt can't properly detect usages in content receivers

* Update screenshots

---------

Co-authored-by: ElementBot <android@element.io>
This commit is contained in:
Jorge Martin Espinosa
2026-03-23 18:11:55 +01:00
committed by GitHub
parent 13bbd24df1
commit a2d9f241dd
2 changed files with 70 additions and 23 deletions

View File

@@ -0,0 +1,35 @@
/*
* Copyright (c) 2026 Element Creations Ltd.
*
* SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial.
* Please see LICENSE files in the repository root for full details.
*/
package io.element.android.libraries.ui.utils.graphics
import androidx.compose.ui.draw.CacheDrawScope
import androidx.compose.ui.graphics.Outline
import androidx.compose.ui.graphics.drawscope.ContentDrawScope
import androidx.compose.ui.graphics.layer.CompositingStrategy
import androidx.compose.ui.graphics.layer.drawLayer
import androidx.compose.ui.graphics.layer.setOutline
/**
* Draws the content of [recordBlock] in a separate layer, which can be customized using [composingStrategy], [outline] and [clip].
*/
context(scope: androidx.compose.ui.graphics.drawscope.DrawScope)
fun CacheDrawScope.drawInLayer(
composingStrategy: CompositingStrategy = CompositingStrategy.Auto,
outline: Outline? = null,
clip: Boolean = false,
recordBlock: ContentDrawScope.() -> Unit,
) {
val layer = obtainGraphicsLayer().apply {
this.compositingStrategy = composingStrategy
this.clip = clip
outline?.let { this.setOutline(it) }
record(block = recordBlock)
}
scope.drawLayer(layer)
}