Flutter中Container无法设置bottomRight圆角问题求助
解决Flutter Container右下角圆角+部分边框的报错问题
你遇到的报错是因为Flutter的BorderRadius要求对应的边框是统一完整的(四个边都存在,不管颜色、宽度),而你只给了右侧和底部边框,属于非统一边框,两者冲突导致报错。
下面提供两种可行的解决方案:
方案1:用ClipRRect单独处理圆角
把Container用ClipRRect包裹,让ClipRRect负责裁剪出右下角的圆角,Container只负责显示右侧和底部边框,两者互不冲突:
ClipRRect( borderRadius: BorderRadius.only(bottomRight: Radius.circular(6)), child: Container( padding: EdgeInsets.all(8), decoration: BoxDecoration( border: Border( right: BorderSide(color: Colors.red, width: 1), bottom: BorderSide(color: Colors.red, width: 1), ), ), child: Text( blockName, textAlign: TextAlign.left, ), ), )
方案2:给所有边设置边框(透明边模拟)
给四个边都设置边框,把不需要显示的顶部和左边框设为透明,这样满足BorderRadius对统一边框的要求,同时只显示右侧和底部的红色边框:
Container( padding: EdgeInsets.all(8), decoration: BoxDecoration( borderRadius: BorderRadius.only(bottomRight: Radius.circular(6)), border: Border( top: BorderSide(color: Colors.transparent, width: 1), left: BorderSide(color: Colors.transparent, width: 1), right: BorderSide(color: Colors.red, width: 1), bottom: BorderSide(color: Colors.red, width: 1), ), ), child: Text( blockName, textAlign: TextAlign.left, ), )
内容的提问来源于stack exchange,提问作者Mahendra
相关产品推荐
相关产品推荐

