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

Chris Fillmore

02/14/2022, 8:13 PM
Is a non-zero
blurRadius
required for
Shadow
to be visible? I am just trying to use shadow in a TextStyle. If I don’t specify a non-zero blur radius, there is no shadow. This seems unexpected. I’d expect to be able to use shadow without blur. I’m on compose
1.2.0-alpha02
c

Chris Sinco [G]

02/14/2022, 11:01 PM
cc @Siyamed @Sean McQuillan [G]
s

Siyamed

02/14/2022, 11:03 PM
can you please create a ticket?
c

Chris Fillmore

02/14/2022, 11:06 PM
Sure, will do tomorrow morning
this seems to be a very old behavior in android. Therefore I am not sure if it would be possible to change. it.
“If radius is 0, then the shadow layer is removed.”
possibly we need to change the default blur value maybe
CSS does support 0blur radius
I wonder what @Nader Jawad thinks
c

Chris Fillmore

02/15/2022, 3:37 PM
n

Nader Jawad

02/15/2022, 7:45 PM
I think this is WAI. You are specifying the radius of the shadow in this case. If you pass 0 then no shadow will be rendered
What would the expected behavior be for a bout radius of 0? It wouldn't be different than specifying a composable with 0 width/height and having it not draw at all
c

Chris Fillmore

02/15/2022, 7:47 PM
Correct me if I’m wrong but doesn’t the radius only apply to the blur?
A radius of 0 just means no blur, not no shadow. At least that’s how I would interpret that
n

Nader Jawad

02/15/2022, 7:48 PM
That indicates the size, so zero would be zero here
That is nothing would be rendered
c

Chris Fillmore

02/15/2022, 7:51 PM
Ok thanks for responding. Feel free to close the ticket. I suppose as a workaround one could just create two
Text
nodes, one of them with an offset. If no-blur shadow was desired.
n

Nader Jawad

02/15/2022, 7:55 PM
That would work if you just wanted to offset the content
c

Chris Fillmore

02/15/2022, 7:57 PM
I’m not sure I follow what you mean. What is the content you’re referring to, just the text?
n

Nader Jawad

02/15/2022, 7:58 PM
Yes the text in this case
c

Chris Fillmore

02/15/2022, 8:00 PM
Ok. Yeah to be clear all I mean is:
Copy code
val text = "my text"
Text(
  text = text,
  modifier = Modifier.offset(-4f, 4f),
)
Text(
  text = text,
)
I think this should produce a basic shadow with no blur
n

Nader Jawad

02/15/2022, 8:00 PM
Yup that seems reasonable
s

Siyamed

02/15/2022, 8:30 PM
Or provide a very small blur?
Would it work?
Nader what does blur mean for graphics? Css defines it the bluering of the shadow it seems
n

Nader Jawad

02/15/2022, 8:31 PM
I don't think that was what the API was intended for to be honest. It looks more like the OP was looking to render the same exact content just rendered offset slightly which is different from a shadow
CSS can generate shadows that are not consistent from a physical standpoint. Android + compose have a single light source for shadows which keeps them consistent and updates in real time based on where the UI element is relative to the light source itself
s

Siyamed

02/15/2022, 8:35 PM
With my zero knowledge of graphics, distance is the offset in this use case
Would android render shadow with i.e. 0.1f blur?
n

Nader Jawad

02/15/2022, 8:38 PM
So to be clear here the shadows that I was referring to are the RenderNode based shadows as part of
Modifier.graphicsLayer
the shadow API that is used on text is part of Paint.setShadowLayer which behaves differently. The latter actually existed before the former however has had different levels of support as Android evolved from being software rendered to hardware rendered and moving away from and back to Skia as the underlying graphics framework
🤔 1
s

Siyamed

02/15/2022, 9:06 PM
thanks
c

Chris Fillmore

02/15/2022, 9:06 PM
Yeah thanks for the context!
c

Chris Sinco [G]

02/15/2022, 10:00 PM
CSS can generate shadows that are not consistent from a physical standpoint
While this is true, the reality is many designer tools and other UI toolkits on other platforms handle shadows this way (not the Android single-light source way), so it’s reasonable to have this confusion with Android development when the mockup says “build this shadow but make it hard and not blurry” and the APIs + rendered results look different.