flutter:styled_widget组件源码查看07

3,095 阅读2分钟

「这是我参与11月更文挑战的第21天,活动详情查看:2021最后一次更文挑战

背景

昨天我们简单介绍了一下styled_widget的功能,今天我们来详细的看看有该框架有哪些Widget,另外是如何实现的 ,Widget列表传送门

widget介绍

expanded

功能: 填满剩余空间

默认参数:

int flex = 1:控制占比

该控件对Expanded简单封装,不多说了,看实现好了

Widget expanded({
  Key? key,
  int flex = 1,
}) =>
    Expanded(
      key: key,
      child: this,
      flex: flex,
    )

flexible

功能: 控制子控件占比

默认参数:

int flex = 1:控制占比

FlexFit fit = FlexFit.loose: tight:必须(强制)填满剩余空间。loose:尽可能大的填满剩余空间,但是可以不填满。

该控件对Flexible简单封装,不多说了,看实现好了

Widget flexible({
  Key? key,
  int flex = 1,
  FlexFit fit = FlexFit.loose,
}) =>
    Flexible(
      key: key,
      child: this,
      flex: flex,
      fit: fit,
    )

positioned

功能: 绝对布局

选填参数:

double? left, double? top, double? right, double? bottom, double? width, double? height,

默认参数:

bool animate = false: 为true时使用动画扩展

该widget也是拥有动画效果,对Positioned进行封装实现

Positioned(
    key: key,
    child: this,
    left: left,
    top: top,
    right: right,
    bottom: bottom,
    width: width,
    height: height,
  )

positionedDirectional

功能: 绝对布局,跟上面的positioned差不多,只不过left right变成了start end

选填参数:

double? start, double? end, double? top, double? bottom, double? width, double? height,

默认参数:

bool animate = false: 为true时使用动画扩展

该widget也是拥有动画效果,对positionedDirectional进行封装实现

PositionedDirectional(
    key: key,
    child: this,
    start: start,
    end: end,
    top: top,
    bottom: bottom,
    width: width,
    height: height,
  )

safeArea

功能: 控制安全区域,例如刘海屏的刘海部分

默认参数:

bool top = true, bool bottom = true, bool left = true, bool right = true,

对safeArea进行封装实现

SafeArea(
  key: key,
  top: top,
  bottom: bottom,
  left: left,
  right: right,
  child: this,
)

semanticsLabel

功能: 屏幕阅读器,主要是为视觉障碍的人准备的,比较复杂,感兴趣的人可以自行了解一下,semanticsLabel

必填参数:

String label

对Semantics.fromProperties进行封装实现

Widget semanticsLabel(
  String label, {
  Key? key,
}) =>
    Semantics.fromProperties(
      key: key,
      properties: SemanticsProperties(label: label),
      child: this,
    )

结语

希望大家把一些好的三方分享出来,打在评论区,共同学习,共同进步

作为Flutter届的一个小学生,希望大家多多指教