由于是两个别的颜色的纯色背景,导致中间有一条白色的细线,在真机上看着还是挺明显的,
代码就是两个普通的container:
Container(
width: 300.0,
height: 100.0,
color: Color(0XFF302F4F),
child: Text("上面的container"),
),
Container(
width: 300.0,
height: 100.0,
color: Color(0XFF302F4F),
child: Text("下面的container"),
)
如何去掉这条尴尬的白线呢?其实很简单,container默认是有边界的,只要将边界用decoration包裹,设置
BorderSide 的值为0 即可:
Container(
width: 300.0,
height: 100.0,
// color: Color(0XFF302F4F),
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: Color(0XFF302F4F),width: 0.0)),
gradient: LinearGradient(
colors: [Color(0XFF302F4F), Color(0XFF302F4F)])),
child: Text("上面的container",),
),
Container(
width: 300.0,
height: 100.0,
// color: Color(0XFF302F4F),
decoration: BoxDecoration(
border: Border(top: BorderSide(color: Color(0XFF302F4F),width: 0.0)),
gradient: LinearGradient(
colors: [Color(0XFF302F4F), Color(0XFF302F4F)])),
child: Text("下面的container"),
)