flutter - Flutter Container：不能同时提供颜色和装饰

Question

我想在我的容器周围画一个边框并为背景着色。

Widget bodyWidget() {
  return Container(
    color: Colors.yellow,
    decoration: BoxDecoration(
      border: Border.all(color: Colors.black),
    ),
    child: Text("Flutter"),
  );
}

但是当我尝试这个时，我得到了错误

不能同时提供颜色和装饰
color 参数只是“decoration: new BoxDecoration(color: color)”的简写。

这是如何解决的？

Answer 1

从 Container中移除color参数并将其添加到 BoxDecoration：

Widget bodyWidget() {
  return Container(
    decoration: BoxDecoration(
      color: Colors.yellow,
      border: Border.all(color: Colors.black),
    ),
    child: Text("Flutter"),
  );
}

如果查看Container 源代码，您可以看到该color参数仅用于在装饰为 null 时设置 BoxDecoration 颜色。

decoration = decoration ?? (color != null ? BoxDecoration(color: color) : null),

你得到的错误只是一个有用的提醒。否则你会得到一个奇怪的覆盖（就像过去的情况一样）或者你甚至可能没有注意到这个错误。

Answer 2

该属性是使用颜色字段color创建 a 的简写。BoxDecoration如果要添加盒子装饰，只需将颜色放在 BoxDecoration 上即可。

assert(color == null || decoration == null,
  'Cannot provide both a color and a decoration\n'
  'To provide both, use "decoration: BoxDecoration(color: color)".'
),

因此，如果您在 中使用BoxDecoration了Container，那么您必须从 中删除颜色参数Container并将其添加到BoxDecoration

          Container(
              decoration: BoxDecoration(
                color: Colors.yellow,
              ),
           // color: Colors.yellow,
          )