异常火热的跨平台开发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<T> extends ModalRoute<T> {
/// Initializes the [PopupRoute].
PopupRoute({
RouteSettings settings,
}) : super(settings: settings);
@override
bool get opaque => false;//转换完成是否覆盖以前的路由
@override
bool get maintainState => true;//处于非活动状态时是否应保留在内存中
}
当然在实现Popup的时候肯定不止这两个属性可以设置,在他的父类或者爷爷类里面会有太多了请移步 PopupRoute<T> 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<double> animation,
Animation<double> secondaryAnimation) {
return child;
}
@override
Duration get transitionDuration => Duration(milliseconds: 200);
}
onLongPress: () => Navigator.push(
context,
//调用
CustomRoute(
child: _buildContainer(context),
),
),