I have an Image inside a Box filling its whole size, when setting a background brush to the box modi...

# compose

[AmrJyniat]

I have an Image inside a Box filling its whole size, when setting a background brush to the box modifier I get nothing because of the the image's fillMaxSize().
Code in 🧵

[AmrJyniat]

I removed the fillMaxSize() from the Image modifier and the gradient works fine, it seems that the image hides the box background behind it?

[Oleksandr Balan]

I would say it is an expected behavior, because an image is a child of the box, so it renders "above" the parent. I think you want to place another Box or Spacer inside your box between an image and text, and apply backgroud brush on that one. This inner Spacer / Box should also have .fillMaxSize() or .matchParentSize() modifier to fill the parent's size.

[AmrJyniat]

Thanks, just for more clarification, I consider that the Box is equal to FrameLayout in traditional views, so If we set a background for FrameLayout it will be applied and its children will not be "above" it, right?

[Oleksandr Balan]

If I am not mistaken FrameLayout will behave the same as Box in this case, thus it's background will be also covered by the children if they have some non-transparent background 🤔

[AmrJyniat]

Oh, yup you're right I tried on a transparent background, Thank you again!