「这是我参与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届的一个小学生,期望我们多多指教