Status Update
Comments
ma...@google.com <ma...@google.com> #2
Thanks! Over to Nader to take a detailed look!
si...@google.com <si...@google.com> #3
I believe we should dup
nj...@google.com <nj...@google.com> #4
Yes definitely. Thanks Siyamed!
In the meantime there maybe other ways to work around it. The main issue is that surface implicitly creates a seaprate layer which impacts the behavior of the blending modes. Being ale to just set the Brush on the paint directly would work around this in the most straightforward way.
nj...@google.com <nj...@google.com> #5
The issue is that the content depends on transparent pixels existing in the scene before the gradient is applied.
To address this you can do the following in order to force rasterization of the graphicsLayer into a separate buffer using CompositingStrategy.Offscreen
, then only draw the gradient on top of the pixels rendered by the text Composable.
Text("Hello World!", modifier =
// Use offscreen compositing strategy so that there are transparent pixels in the offscreen buffer
// to blend against with the SrcIn blend mode
Modifier.graphicsLayer(compositingStrategy = CompositingStrategy.Offscreen).drawWithCache {
val brush = Brush.horizontalGradient(listOf(Color.Red, Color.Blue, Color.Cyan, Color.Magenta, Color.Green))
onDrawWithContent {
drawContent()
drawRect(brush, blendMode = BlendMode.SrcIn)
}
}
)
Description
Compose Version: 1.0.0-beta06
I tried creating a Gradient Text by using
TextDelegate
and Drawing it onCanvas
, Drawing a Gradient over it with aBlendMode.SrcIn
.Works great when the Text isn't drawn on top of a
Surface
but when on top of a Surface, the Drawn Gradient seems to overlay on the Surface as well.Here is the link to the Repository:https://github.com/qrezet/GradientTextBug/blob/master/app/src/main/java/com/example/gradienttext/MainActivity.kt
Also some screenshots: