如何解决如何在材质小部件上插入边框
我是扑扑的新手,我无法在Material Widget上插入四舍五入的边框。我插入了适当的borderRadius: new BorderRadius.circular(6.0),
,但看不到我做错了:
我的代码:
Widget _buildCategoryItem(index) {
return new GestureDetector(
onTap: () {
onTabCategory(index);
},child: new Center(
child: new Container(
margin: new EdgeInsets.only(left: 10.0),child: new Material(
elevation: 2.0,borderRadius: new BorderRadius.circular(6.0),child: new Container(
padding: new EdgeInsets.only(
left: 12.0,top: 7.0,bottom: 7.0,right: 12.0),color: _category_selected == index
? Colors.orange[800]
: Colors.orange[500],child: new Text(
_categorys[index],style: new TextStyle(color: Colors.white),),);
}
类别标签的格式为正方形,但我想使用四舍五入的边框:
解决方法
我找到了解决方案。我可以使用ClipRRect
小部件来包装“材质”小部件并使角变圆。
我的代码已修复:
Widget _buildCategoryItem(index) {
return new GestureDetector(
onTap: () {
onTabCategory(index);
},child: new Center(
child: new Container(
margin: new EdgeInsets.only(left: 10.0),child: new ClipRRect(
borderRadius: BorderRadius.circular(6.0),child: new Material(
elevation: 2.0,child: new Container(
padding: new EdgeInsets.only(
left: 12.0,top: 7.0,bottom: 7.0,right: 12.0),color: _category_selected == index
? Colors.orange[800]
: Colors.orange[500],child: new Text(
_categorys[index],style: new TextStyle(color: Colors.white),),);
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。