Flutter BoxDecoration 的背景色会覆盖 Container 的背景色，为什么？

Question

我有一个 Flutter Container 小部件，我为它定义了一种颜色（粉红色），但由于某种原因，BoxDecoration 中的颜色覆盖了它（绿色）。为什么？

new Container(
  color: Colors.pink,
  decoration: new BoxDecoration(
    borderRadius: new BorderRadius.circular(16.0),
    color: Colors.green,
  ),
);

Answer 1

Container 的 color 对于 BoxDecoration 的 color 是 shorthand，因此 BoxDecoration 的 color 在 Container 的 decoration 属性中覆盖其 Container 的 color.

Answer 2

问题：

您不能同时使用 color 和 decoration。来自 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).

解决方案：

仅使用color:
```
Container(
  color: Colors.red
)
```

仅使用 decoration 并在此处提供 color：

Container(
  decoration: BoxDecoration(color: Colors.red)
)

Answer 3

Flutter 团队表示 BoxDecoration() 中的颜色属性在将背景颜色应用于 Container 小部件时非常常用。因此，他们在 Container 小部件中为颜色属性放置了一个单独的 shorthand。因此，当我们在同一个 Container 小部件中同时使用 color 属性和 BoxDecoration() color 属性时，将抛出如下断言：

Cannot provide both a color and a decoration
The color argument is just a shorthand for "decoration: new BoxDecoration(color: color)".

Answer 4

不能同时提供color and decoration参数，因为这可能会导致装饰图覆盖背景色。要为装饰提供颜色，您可以使用以下代码。

decoration: BoxDecoration(color: Colors.red).

Flutter BoxDecoration 的背景色会覆盖 Container 的背景色，为什么？

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

background-color

dart

flutter

flutter-layout

flutter-container

问题：

解决方案：