Styling regression: ButtonBundle background color

[eidloi]

Bevy version

v0.14.0-rc.3

What you did

I have styled ButtonBundle background colors.

What went wrong

The BackgroundColor component has been removed from the ButtonBundle. However, even if one were to add it back in,
the color is overriden by the UiImage's color, unless explicitly set to transparent.

Additional context

This was changed in #11165

[rparrett]

I also found this super awkward. The official "migration" is to use UiImage::color(BG_COLOR) instead of BackgroundColor if you want a button with a solid color.

But why can't we... use BackgroundColor? We can, but we need to change the image to UiImage::color(Color::NONE). But UiImage::color is supposed to be a tint for an image, and there's not even an image to tint!

It's a very confusing setup.

[eidloi]

There is also the issue that Text still uses BackgroundColor, so managing an icon setup that could be either an image or a font-codepoint is difficult.

[benfrankel]

UiImage::color is tinting the "default image" which is a plain white rectangle. The change was made because BackgroundColor was originally in the bundle to be the tint for UiImage, and now it no longer does that but UiImage::color does that instead. So technically it's not a styling regression, bevy is just being more honest about what you've actually been doing and that turns out to be a UX regression.

Ideally bevy wouldn't be opinionated about how your button is rendered. Some buttons might want to use UiImage + color tint, some might want a solid background color, etc., so neither component should be in the bundle. The same argument can be made for BackgroundColor and BorderColor being present in other UI bundles, so any change should keep the other UI bundles in mind for consistency.

[rparrett]

turns out to be a UX regression

Agreed

so neither component should be in the bundle

I suppose, though maybe an alternative is UiImage having Option<Handle<Image>> instead. I'm sure this has been discussed extensively in the past, and is a ux / perf tradeoff. Probably important to think about how this would play out in a world without bundles, which I believe is "the plan."

Either way, unless this is a serious roadblock for sickle, I'm not sure that it needs to be dealt with for 0.14.

[eidloi]

seeing the discussion unfold, I believe it is best to just properly highlight the gotchas in the migration guide and get back to this later.

It is something that must be revisited if or when bevy UI would want to support things like masks (stencils) on Nodes along with GUI picking to support world space UI. At that stage the UI rendering would need some face-lifting and would be an ideal time to sort this out.