Hi , How can I give layout margin around the view ? margin means the space outside the view, however...

# compose

[Chethan]

Hi , How can I give layout margin around the view ? margin means the space outside the view, however padding means the space inside the view , why does it so complex to make here in the Compose ? I am not seeing any example of it ?

[Ali Albaali]

You can use Spacer for margins and Modifier.padding for padding

[Se7eN]

Margin and padding mean the same things in compose. What matters is where you add it.
This acts like a margin:

Modifier
    .padding(8.dp)
    .background(Color.Red)

This acts like a padding:

Modifier
    .background(Color.Red)
    .padding(8.dp)

I'm not good at explaining so hopefully someone else can explain better

[Ali Albaali]

I agree. that's another way of doing

[Chethan]

oh.. is that so .. ! I am suppressed

[Chethan]

I was trying to leave space around the card view in order to align with background color of list view . I got mad searching all over place to make this happen

[Se7eN]

I think this was mentioned in a codelab or a video I don't remember which one

[Chethan]

Please have look on this screen shot, this is what happened after adding padding

[Chethan]

Card(
    modifier = Modifier
        .padding(8.dp)
        .background(Color.Red)
) {

[Se7eN]

The Card's backgroundColor is being displayed over the background from your modifier

[Chethan]

Okey, I got it, first put the background color and then have padding to make Margin

[Chethan]

Card(
    modifier = Modifier.background(Color.Red)
        .padding(8.dp)

)

This worked for me

[Chethan]

Thank you

[Se7eN]

Great, so you needed a colored border around the card?

[Se7eN]

If yes, you can also pass a border to the Card

[Chethan]

How can I ? example ?

[Se7eN]

Card(border = BorderStroke(2.dp, Color.Red))

[Chethan]

Thanks