首页 > 解决方案 > 具有透明背景的颤动角半径

问题描述

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

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

              ),

然而,这就是它呈现的内容,它呈现一个具有圆角半径的白色容器(预期为透明)。有什么帮助吗?

截屏

标签: dartflutter

解决方案


如果你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"),
           )
         ),
        ),

推荐阅读