dart - 使子小部件对其父背景透明

Question

我尝试使用不透明的深色背景进行相机预览，并在具有透明背景的中间部分设置卡片区域。它看起来像是在深色背景的移动设备中显示对话框，但对话框在深色背景下具有透明背景。

我已经使用列和行小部件完成了，例如:

Column(
  children : <Widget>[
    Expanded(
      child: Container(
        color: Colors.Black54
      )
    ),

    Row(
      children : <Widget>[
        Expanded(
          child: Container(
            color: Colors.Black54
          )
        ),

        CardWidget(
          width: cardWidth,
          height: cardHeight,
          Color: Colors.Transparent
        ),

        Expanded(
          child: Container(
             color: Colors.Black54
          )
        ),
      ]
    ),

    Expanded(
      child: Container(
        color: Colors.Black54
      )
    ),

  ]
)

但我想知道是否有一种简单的方法，例如:

 Container(
  color: Colors.Black54,
  child: center(
    child: CardWidget(
      width: cardWidth,
      height: cardHeight,
      background: Colors.Transparent
    )
  )
)

请让我知道是否有另一种方法可以使它像上面的代码一样简单。谢谢

Answer 1

你想做这样的事情吗？

如果是，代码如下:

new Container(
      decoration: new BoxDecoration(
          border: Border(
            top: BorderSide(width: 300, color: Colors.grey[700]),
            left: BorderSide(width: 100, color: Colors.grey[700]),
            right: BorderSide(width: 100, color: Colors.grey[700]),
            bottom: BorderSide(width: 300, color: Colors.grey[700]),
          ),
          color: Colors.transparent),
    )