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

Posted 2023-02-21

【中文标题】Flutter Container：不能同时提供颜色和装饰

【英文标题】：Flutter Container: cannot provide both a color and a decoration

【发布时间】：2019-05-09 18:13:14

【问题描述】：

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

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

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

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

这是怎么解决的？

【参考方案1】：

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

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

如果你检查Container source code你可以看到color参数只是用来设置BoxDecoration的颜色，如果装饰是空的。

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

你得到的错误只是一个有用的提醒。否则你会得到一个奇怪的覆盖 (as was apparently the case in the past) 或者你甚至可能没有注意到这个错误。

【参考方案2】：

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

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

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

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