「这是我参与11月更文挑战的第17天，活动详情查看：2021最后一次更文挑战」
背景
昨天我们简单介绍了一下styled_widget的功能,今天我们来详细的看看有该框架有哪些Widget,另外是如何实现的 ,Widget列表传送门
widget介绍
borderRadius
功能: 设置圆角
选填参数:double all、double topLeft、double topRight、double bottomLeft、double bottomRight、
默认参数:bool animate = false
当animate为true时会有个动画效果,其他选填参数就是正常的设置上下左右圆角
borderRadiusDirectional
功能: 设置不规则圆角
选填参数:double all、double topStart、double topEnd、double bottomStart、double bottomEnd、
默认参数:bool animate = false
当animate为true时会有个动画效果,其他选填参数就是正常的设置上下左右圆角,
clipRRect
功能: 裁剪不规则圆角
选填参数:double all、double topLeft、double topRight、double bottomLeft、double bottomRight、CustomClipper<RRect>? clipper
默认参数:bool animate = false、Clip clipBehavior = Clip.antiAlias
当animate为true时会有个动画效果,使用_AnimatedClipRRect实现,其他选填参数就是正常的设置上下左右圆角,clipper对象如果为空,则剪裁区域为child指定大小,clipBehavior剪裁的方式,不能为null或者Clip.none,还有抗锯齿模式等
ClipRect与ClipOval
这两个widget都是原方法封装,ClipRect裁剪指定矩形大小,ClipOval裁剪椭圆,这两个方法做过多的介绍了, 看下原始方法使用就好了
border
功能: 设置圆角
选填参数:double all、double top、double left、double bottom、double right、
默认参数:bool animate = false、Color color = const Color(0xFF000000),BorderStyle style = BorderStyle.solid
当animate为true时会有个动画效果,其他选填参数就是正常的设置上下左右边框,color设置边框颜色,style设置边框风格,实线虚线等样式
decorated
功能: 可装饰widget
选填参数:color、image、border、borderRadius、boxShadow、gradient、backgroundBlendMode
默认参数:bool animate = false、BoxShape shape = BoxShape.rectangle,DecorationPosition position = DecorationPosition.background
当animate为true时会有个动画效果,其实该方法就是将上述几个方法都放在了一起跟简单的对BoxDecoration包装了一下,看下BoxDecoration使用方法就可以了
结语
希望大家把一些好的三方分享出来,打在评论区,共同学习,共同进步
作为Flutter届的一个小学生,希望大家多多指教