Flutter轻拟物效果

轻拟物原理：

轻拟物：看起来像钢印印出来的一样，有种凸出来的效果

1. 按钮或者面板的颜色要和背景色一样
2. 如果按钮或者面板有边框则边框的颜色也要和背景色一样
3. 按钮或面板添加右下角(正x和正y)方向黑色阴影
4. 按钮或面板添加左下角(负x负正y)方向白色阴影

代码示例：

Container(
  height: ScreenUtil().setHeight(150),
  width: ScreenUtil().setWidth(420),
  decoration: BoxDecoration( //重点就是这两个方向的阴影
    boxShadow: [
      BoxShadow(
        color: Colors.black12,
        offset: Offset(3.0, 3.0),//阴影xy轴偏移量
        blurRadius: 5.0,//阴影模糊程度
        spreadRadius: 3//阴影扩散程度
        ),//扩散程度和偏移成都数值要一样
      BoxShadow(
        color: Colors.white,
        offset: Offset(-3.0, -3.0),
        blurRadius: 4.0, 
        spreadRadius: 3.0
        )
    ]),
  child: RaisedButton( //可以不用按钮，用其他widget也行
    highlightColor:Colors.white,
    shape: RoundedRectangleBorder(
      side: BorderSide(color: 底板背景色),
      borderRadius: BorderRadius.circular(6.0),
    ),
    color: 底板背景色,
    elevation:0,//关闭按钮自身阴影，采用Container定义的阴影
    onPressed: (){},
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: <Widget>[
        Icon(Icons.collections),
        Text('相册选取',style: TextStyle(
          fontSize: ScreenUtil().setSp(TextSize.lableText),
        ),)
      ],
    )
  ),
)

效果展示：