我有一个Flutter Container小部件,并为它定义了一种颜色(粉色),但由于某种原因,BoxDecoration中的颜色将其覆盖(变为绿色)。为什么会这样?
new Container(
color: Colors.pink,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.circular(16.0),
color: Colors.green,
),
);
我有一个Flutter Container小部件,并为它定义了一种颜色(粉色),但由于某种原因,BoxDecoration中的颜色将其覆盖(变为绿色)。为什么会这样?
new Container(
color: Colors.pink,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.circular(16.0),
color: Colors.green,
),
);
Container的 color
是BoxDecoration的 color
的简写形式,因此Container中的 decoration
属性中的BoxDecoration的 color
会覆盖其Container的 color
。
不能同时使用color
和decoration
。从 文档中可知:
由于装饰可能会覆盖背景颜色,因此无法同时提供
color
和decoration
参数。要使用带有颜色的装饰,请使用decoration: BoxDecoration(color: color)
。
只使用color
:
Container(
color: Colors.red
)
仅使用 decoration
,并在此处提供color
:
Container(
decoration: BoxDecoration(color: Colors.red)
)
只使用以下代码设置背景颜色
new Container(
color: Colors.pink,
);
如果使用半径或形状设置背景颜色,则使用装饰内部的颜色。
Container(
decoration: BoxDecoration(
color: Colors.red,
borderRadius: BorderRadius.circular(17)),
child:SizeBox());
Cannot provide both a color and a decoration
The color argument is just a shorthand for "decoration: new BoxDecoration(color: color)".
decoration: BoxDecoration( color: Colors.yellow, border: Border.all(color: Theme.of(context).accentColor,) ),
@Kamlesh - Vinoth Vino