自定义类上不显示颜色

Question

 Expanded(
               //flex: 2,
               child: Row(
             children: <Widget>[
               Expanded(child: Reuseable(colour: Color(0xBAD681))),
               Expanded(
                   child: Reuseable(colour: Color(0xBAD681)),
                   )
             ],
           )),

   class Reuseable extends StatelessWidget {
   Reuseable({@required this.colour, this.cardChild});

   final Color colour;
   final Widget cardChild;

   @override
   Widget build(BuildContext context) {
     return Container(
       child: cardChild,
       margin: EdgeInsets.all(15.0),
       decoration: BoxDecoration(
         border: Border.all(
           color: Colors.grey,
         ),
           color: colour,
           borderRadius: BorderRadius.circular(10.0)),.
     );
  }
 }

如果没有边框，可重复使用的类就看不见了，有什么办法可以解决这个问题吗？

截图。

Answer 1

你不能同时提供一个颜色和一个装饰颜色参数只是一个简写。"decoration: new BoxDecoration(color: color)".

移除 color 中的参数。Container 而把那个留在 BoxDecoration:

然后在 decoration

color: (this.colour != null)? this.colour: Colors.grey),

编辑变化 color:colour 到 color:this.colour

Answer 2

我通过创建一个常量变量来解决这个问题，这个常量变量保存了自定义类widgets的颜色。

const activeCardColour = Color(0xFF1D1E33);


 Expanded(
           //flex: 2,
           child: Row(
         children: <Widget>[
           Expanded(child: Reuseable(colour: activeCardColour)),
           Expanded(
               child: Reuseable(colour: activeCardColour),
               )
         ],
       )),