Flutter Widget篇

异常火热的跨平台开发Flutter，不知道吸引了多少人，Flutter中各式各样的Widget既让人欢喜，也让开发者忧愁，太特么多了，了解不过来，不过作为21世纪杰出程序员，必须学会借鉴别人的成果，事实上很多Widget在百度Google里面都能查到，我这里只是补充开发中遇到，但是网上还没有解释翻译的Wiget。

Visibility 控件的显示或者隐藏

Visibility({
Key key,
@required this.child, 
this.replacement = const SizedBox.shrink(), //用于替换的Widget，如果不复写那么就是默认空的SizedBox
this.visible = true, //控制child 是否可见，当为false的时候显示replacement
this.maintainState = false,  //是否在不可见的情况下维护Widgetstate
this.maintainAnimation = false, //是否在widget不可见时保持动画
this.maintainSize = false,// 是否预留位置
this.maintainSemantics = false,// 可访问性
this.maintainInteractivity = false, // 是否在隐藏时维持交互
}

1、实现Android中的 invisible

Visibility(
child: Text("Invisible"),
maintainSize: true, 
maintainAnimation: true,
maintainState: true,
visible: false, 
),

2、实现gone

Visibility(
child: Text("Gone"),
visible: false,
),

Vibility部分源码实现

@override
Widget build(BuildContext context) {
if (maintainSize) {
  Widget result = child;
  if (!maintainInteractivity) {
    result = IgnorePointer(
      child: child,
      ignoring: !visible,
      ignoringSemantics: !visible && !maintainSemantics,
    );
  }
  return Opacity(
    opacity: visible ? 1.0 : 0.0,
    alwaysIncludeSemantics: maintainSemantics,
    child: result,
  );
}
assert(!maintainInteractivity);
assert(!maintainSemantics);
assert(!maintainSize);
if (maintainState) {
  Widget result = child;
  if (!maintainAnimation)
    result = TickerMode(child: child, enabled: visible);
  return Offstage(
    child: result,
    offstage: !visible,
  );
}
assert(!maintainAnimation);
assert(!maintainState);
return visible ? child : replacement;
}

这样看起来其实就很清楚了，实在弄不明白请参考 https://www.cnblogs.com/pjl43/p/9615685.html

---

抽象类PopupRoute

最近在实现类似于Android的PopupWindow效果即可固定位置的弹窗过程中，发现了PopupRoute抽象类。
这个类可以实现将弹出一个透明的页面页面（其实也不全是 颜色由barierColor控制 如果为null 那么就是透明的 ）

abstract class PopupRoute extends ModalRoute {
/// Initializes the [PopupRoute].
PopupRoute({
RouteSettings settings,
}) : super(settings: settings);

@override
bool get opaque => false;//转换完成是否覆盖以前的路由

@override
bool get maintainState => true;//处于非活动状态时是否应保留在内存中

}

当然在实现Popup的时候肯定不止这两个属性可以设置，在他的父类或者爷爷类里面会有太多了请移步 PopupRoute class参考

具体使用

class CustomRoute extends PopupRoute {
Widget child;

CustomRoute({@required this.child});

@override
Color get barrierColor => null;

@override
bool get barrierDismissible => true;

@override
String get barrierLabel => null;

@override
Widget buildPage(BuildContext context, Animation animation,
  Animation secondaryAnimation) {
return child;
}

@override
Duration get transitionDuration => Duration(milliseconds: 200);
}

---

onLongPress: () => Navigator.push(
        context,
        //调用
        CustomRoute(
          child: _buildContainer(context),
        ),
      ),