首页 > 建站教程 > APP开发,混合APP >  Flutter报错:A borderRadius can only be given for uniform borde正文

Flutter报错:A borderRadius can only be given for uniform borde

我爱模板网在做Flutter项目时,需要给Container设置底边框以及四个圆角,于是代码如下:
Container(
  width: double.infinity,
  height: ScreenUtil().setHeight(192.0),
  decoration: BoxDecoration(
    color: Colors.white,
    border: Border(
        bottom: BorderSide(width:.5, color: Colors.red)
    ),
    borderRadius: BorderRadius.only(
      topLeft: Radius.circular(10.0),
      topRight: Radius.circular(10.0),
    )
  ),
),
此时运行页面空白,还会报下面的错:

A borderRadius can only be given for a uniform Border.



从字面意思来看,是因为边界和borderRadius不统一,就是只有底边框,却设置了左上和右上的圆角,解决办法:
    1、将边框去了,用margin或再写个Container作为边框
    2、将圆角去了,用ClipRRect等方法实现圆角
    3、将四条边都加上,四条边必须边框粗细,颜色一致,否则还是会报上面的错:
        下面写法仍会报错:
border: Border(
    bottom: BorderSide(width:.5, color: Colors.red),
    left: BorderSide(width:.5, color: Colors.white),
    right: BorderSide(width:.5, color: Colors.white),
    top: BorderSide(width:.5, color: Colors.white)
),
        下面写法不会报错:
border: Border(
    bottom: BorderSide(width:.5, color: Colors.red),
    left: BorderSide(width:.5, color: Colors.red),
    right: BorderSide(width:.5, color: Colors.red),
    top: BorderSide(width:.5, color: Colors.red)
),
        或:
border: Border.all(width: 1, color: Colors.red)