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

Colton Idle

11/04/2021, 11:09 PM
I'm using a Card, and have a composable inside the card that I'm offsetting on the y-axis (basically trying to draw outside of the card), but the card seems to clip it's children. Is it possible to opt out of that behavior for a card? Edit: I converted the Card to a Box and I still get the same clipped output. 🤔
Code
Copy code
Box(
        modifier = modifier.background(Color(0x4DFFFFFF)).clip(RoundedCornerShape(16.dp)).graphicsLayer(clip = false)
    ) {
        Column {
            Row(modifier = Modifier.offset(y = (-8).dp), verticalAlignment = Alignment.CenterVertically) {
                Text(text = "TESTING")
            }
        }
    }
g

George Mount

11/04/2021, 11:27 PM
You have a
clip(RoundedCornerShape(16.dp))
which will clip your contents. The extra
graphicsLayer(clip=false)
doesn't modify the clip that you added, it is just adding a new (unnecessary) graphicsLayer.
If you don't want the clip, you'll have to remove the
clip(RoundedCornerShape)
-- if you want the outline or background, you should be able to shape both of those.
c

Colton Idle

11/04/2021, 11:29 PM
I'm basically at the very beginning of the bottom card in this design, and I'm trying to offset the soccer ball (or text in my example) How do I that if I want rounded corners and I don't want to clip the children?
So more specifically, I'm creating this yellow card right now.
g

George Mount

11/04/2021, 11:33 PM
Something like this?
Copy code
Box(Modifier
  .border(1.dp, darkYellow, RoundedShape)
  .background(yellow, RoundedShape)) {
  soccerBalls()
}
-- sorry, I only included the parts about the border and background
You could directly use a
Column
instead of a
Box
if you're certain that the contents are in a column.
c

Colton Idle

11/04/2021, 11:34 PM
Ohhh. Create a rounded shape as a background. Good idea. Didn't know that was possible. Let me give that a whirl.
@George Mount that worked! No idea you could set a shape there. Awesome!!!
👍 1