dart - 具有透明背景的 flutter 角半径

Question

下面是我的代码，我希望渲染一个具有透明背景的圆角容器。

return new Container(
                //padding: const EdgeInsets.all(32.0),
                height: 800.0,
                //color: const Color(0xffDC1C17),
                //color: const Color(0xffFFAB91),
                decoration: new BoxDecoration(
                  color: Colors.green, //new Color.fromRGBO(255, 0, 0, 0.0),
                  borderRadius: new BorderRadius.only(
                    topLeft:  const  Radius.circular(40.0),
                    topRight: const  Radius.circular(40.0))
                ),
                child:  new Container(
                    decoration: new BoxDecoration(
                        color: Colors.blue,
                        borderRadius: new BorderRadius.only(
                            topLeft:  const  Radius.circular(40.0),
                            topRight: const  Radius.circular(40.0))
                    ),
                  child: new Center(
                    child: new Text("Hi modal sheet"),
                  )

              ),

然而，这就是它渲染的内容，它会渲染一个具有圆角半径的白色容器(预期为透明)。有什么帮助吗？

Answer 1

如果你用圆角包裹你的 Container 并且背景颜色设置为 Colors.transparent 我认为这就是你想要的。如果您使用的是 Scaffold，则默认背景颜色为白色。如果能达到你想要的效果，请将其更改为 Colors.transparent。

        new Container(
          height: 300.0,
          color: Colors.transparent,
          child: new Container(
            decoration: new BoxDecoration(
              color: Colors.green,
              borderRadius: new BorderRadius.only(
                topLeft: const Radius.circular(40.0),
                topRight: const Radius.circular(40.0),
              )
            ),
            child: new Center(
            child: new Text("Hi modal sheet"),
           )
         ),
        ),