您当前的位置: 首页 >  flutter

大前端之旅

暂无认证

  • 4浏览

    0关注

    403博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

flutter中分割线效果实现(三种方法)

大前端之旅 发布时间:2021-07-28 08:18:38 ,浏览量:4

第一种:Divider(Double:height,Double:indent,color:color) 1.height:分割线Widget的高,不是分割线本身效果的高,可以达到两个Widget 之间margin的效果 2.indent:分割线左边缩进长度 3.color:分割线的颜色 4.代码示例:

[
	Container( height: 65.0,),
    Divider(height: 1.0,indent: 60.0,color: Colors.red,),
    Container( height: 65.0, ),
],

第二种:DecoratedBox(decoration:BoxDecoration(Border:border)) 1.新建一个不带child Widget 的装饰容盒子,只使用边框参数,相当于一个没有高度的空白盒子 2.代码示例

DecoratedBox(
	decoration:BoxDecoration(
    	border:Border.all(color: Colors.grey[200],width: 1.0)
    ),
),

第三种:用Widget 阴影达到分割线的效果,一个Widget 效果不明显,当两个都有阴影的Widget 相邻的时候就达到的分割线的效果

Container(
	decoration: BoxDecoration(color: Colors.white, boxShadow: [
    	 BoxShadow(
         	color: Colors.grey[300],
         ),
	]
),
关注
打赏
1660524863
查看更多评论
立即登录/注册

微信扫码登录

0.1042s