阴影样式中flutter和css对应关系
UI给出的css样式
width: 75px;
height: 75px;
background-color: rgba(255, 255, 255, 1);
border-radius: 4px;
box-shadow: 0px 0.5px 5px 0px rgba(0, 0, 0, 0.08);
flutter样式布局
Container(
constraints: BoxConstraints.tightFor(width: 75, height: 75),
margin: EdgeInsets.only(left: 0.5, right: 0.5, top: 0.5, bottom: 3),
//阴影布局
decoration: BoxDecoration(
color: WBColors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Color.fromRGBO(0, 0, 0, 0.08),
offset: Offset(0, 0.5),
blurRadius: 5,
spreadRadius: 0
)
]
),
alignment: Alignment.center,
child: ...,
)
对应关系
属性 | css(box-shadow) | flutter(boxShadow) |
---|---|---|
offset | 前两个值 |