goyourfly/DailyBread

Flutter StatefulBuilder 使用

Opened this issue · 0 comments

在 Flutter 中构建有状态的 Widget 时总是要创建 StatefulWidget + State 两个类,如果只是想写一个很简单的 StatefulWidget 时就很操蛋,可能模板代码比逻辑代码都多,今天在看源码的时候看到一个官方封装的库 StatefulBuilder
封装很简单,但是确实能省很多代码:

typedef StatefulWidgetBuilder = Widget Function(BuildContext context, StateSetter setState);

class StatefulBuilder extends StatefulWidget {
  const StatefulBuilder({
    Key key,
    @required this.builder,
  }) : assert(builder != null),
       super(key: key);
  final StatefulWidgetBuilder builder;
  @override
  _StatefulBuilderState createState() => _StatefulBuilderState();
}

class _StatefulBuilderState extends State<StatefulBuilder> {
  @override
  Widget build(BuildContext context) => widget.builder(context, setState);
}

使用的时候就不需要创建两个类了,可以直接在 build 方法中创建匿名内部类:

Container(child: StatefulBuilder(
  builder: (context, StateSetter setter) {
    setter(() {
      // 等同于 setState
    });
    // 这里就相当于 State.build 方法
    return Container();
  },
)),

比如 Flutter 提供的 showDialog 无法在外部无法直接刷新 Dialog 的内容,此前如果要刷新内容,只能创建一个
StatefulWidget + State 的方式在内部调用 setState 刷新,此处就可以用 StatefulBuilder 代替