Flutter BoxDecoration’s background color overrides the Container's background color, why?

Container’s color is shorthand for BoxDecoration’s color, so BoxDecoration's color in the Container's decoration property overrides its Container's color.

From docs:

The color and decoration arguments cannot both be supplied, since it would potentially result in the decoration drawing over the background color. To supply a decoration with a color, use decoration: BoxDecoration(color: color).

And if you are only using Container to provide color, I'd suggest you using ColoredBox which is more optimised than a regular Container.

ColoredBox(
  color: Colors.red, // color
  child: ...,
)

BoxDecoration is used to actually paint the background color. The BoxDecoration widget covers many cases other than just painting a background color, and is not as efficient as the new ColoredBox widget, which only paints a background color.