Status Update
Comments
ju...@gmail.com <ju...@gmail.com> #2
Running Compose 1.2.0 and hit this regularly with a few views. The 1.dp of padding trick works, but shouldn't be necessary. In an app with a lot of rounded corners with strokes, I've resorted to wrapping background, border, and the extra padding into a single modifier used everywhere.
al...@gmail.com <al...@gmail.com> #3
Just ran into this issue as well, wondering if there is a better fix?
lv...@gmail.com <lv...@gmail.com> #4
it...@gmail.com <it...@gmail.com> #5
[Deleted User] <[Deleted User]> #6
Can easily be reproducible with a Box.
Use a Modifier to have a background with a shape and have a border too and you will have this glitch
co...@google.com <co...@google.com>
so...@gmail.com <so...@gmail.com> #7
za...@gmail.com <za...@gmail.com> #8
al...@gmail.com <al...@gmail.com> #9
Transparent color unfortunately does not work if your surface has elevation.
ra...@gmail.com <ra...@gmail.com> #10
This is really crap, any way you make a clip you can see its background, you can't even put padding to hide it because I don't want padding.
Compose 1.7 and this crap is still the same
nj...@google.com <nj...@google.com>
la...@gmail.com <la...@gmail.com> #11
Experienced the same issue right now with Compose UI 1.8.0-beta01
Box(modifier = Modifier.clip(CircleShape)
.border(6.dp, White, CircleShape)
.background(PrimaryGreen)
) {
Text(
it.toString(),
modifier = Modifier
.padding(14.dp),
color = White,
style =
TextStyle(
fontFamily = openSansFont,
fontWeight = FontWeight.SemiBold,
),
fontSize = 16.sp
)
}
Please check attachment
la...@gmail.com <la...@gmail.com> #12
Sorry, attached the wrong attachment. Here's the correct one.
Description
Jetpack Compose version: 1.1.1
Jetpack Compose component used: Surface or Modifier.background() + Modifier.border()
Android Studio Build: Android Studio Bumblebee | 2021.1.1 Patch 3
Kotlin version: 1.6.10
If I create Surface with corners, background color and border, than few pixels with background color is visible outside border. You can see this in "2.png" attached image. Same behavior if I'll use Box() with Modifier.border() + Modifier.background(), or even if I'll also add Modifier.clip().
If I'll do Modifier.border(strokeWidth = 2.dp).padding(1.dp).background() this "background pixels out of border" will disappear but this solution doesn't look very well
Steps to Reproduce or Code Sample to Reproduce:
I attached screenshot of whole component "1.png", and screenshot of this visible background at corner "2.png".