Flutter功能 组件描边,圆角
2023-09-14 09:04:26 时间
通常用Container组件的decoration来做
Container(
padding: EdgeInsets.symmetric(horizontal: 4.0, vertical: 2.0),
decoration: BoxDecoration(
border: Border.all(color: Colors.grey, width: 1.0),
borderRadius: BorderRadius.circular(3.0)),
child: Text(_products[index]['description'])),
padding内边距属性,如果不添加描边会紧贴文字image加上边距之后image
EdgeInsets支持多种自定义方法
EdgeInsets.all() 全方向
EdgeInsets.only(left,top,right,bottom) 自定义各方向的边距
EdgeInsets.symmetric(vertical, horizontal)自定义垂直,水平对称边距
EdgeInsets.fromWindowPadding(ui.WindowPadding padding, double devicePixelRatio) 根据机型屏幕尺寸定义
decoration这里用到BoxDecoration组件 常用属性
color颜色
border 描边宽度
borderRadius 圆角值
boxShadow 阴影 支持gradient 梯度,混合模式backgroundBlendMode shape自定义形状 Border BorderRadius同样支持多种自定方法.
相关文章
- Flutter WillPopScope 拦截路由返回
- Flutter笔记 - 事件分发
- flutter常用组件总结
- Flutter笔记-基础组件
- flutter常用组件总结
- Flutter入门(五)--表单+单选/多选+日期+轮播+对话框
- Flutter入门(一)--组件
- flutter:设置当前的channel并更新版本(从master切换到stable)
- Flutter 深度学习 — Cookbook(Flutter菜谱)
- flutter 滑动组件CustomScrollView
- flutter 书写json解析类
- flutter Uint8List格式的图片和File格式图片的互相转换
- Flutter 实现下拉刷新和上拉加载
- flutter显示图片
- Flutter之Pigeon插件与Android通信使用指南
- Flutter跨组件共享状态的利器Provider原理解析
- Nested组件,解决Flutter布局嵌套过深的利器
- Flutter之跨组件共享状态Provider原理剖析
- Flutter之ParentDataWidget和RenderObjectWidget详解
- Facebook的React Native之所以能打败谷歌的原因有7个(ReactNative vs Flutter)
- flutter null safety
- Flutter 官方自带日期组件 和第三方 日期组件、轮播图 flutter_swiper
- Flutter 中的常见的按钮组件 以及自 定义按钮组件、FloatingActionButton 实现类似 闲鱼 App 底部导航凸起按钮
- Flutter Container 组件、Text 组件、图片组件详解
- Flutter组件学习之自定义画板绘制圆形——筑梦之路
- Flutter组件学习之ClipOval圆形裁剪——筑梦之路