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

Question

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

我已经使用诸如

的列和行小部件完成了操作

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),
    )