Flutter（三十一）InheritedWidget

InheritedWidget是一个无界面的功能widget，主要作用是widget树中数据共享。
流程：

• 自定义一个类MyInheritedWidget，继承InheritedWidget ，定义待共享的数据data
• 构建widget树时，让MyInheritedWidget成为父类。
• 自定义UI组件widget，内部使用MyInheritedWidget的字段data。
• 当MyInheritedWidget的data发生变化时，会调用updateShouldNotify方法，通知其他依赖了MyInheritedWidget的widget，其他的widget会调用其didChangeDependencies做出响应。
• 依赖者要成为MyInheritedWidget的子孙widget，否则无法共享数据。

image.png

示例：
自定义MyInheritedWidget 定义共享数据

class MyInheritedWidget extends InheritedWidget {
  final int data;
  MyInheritedWidget({
    @required this.data, //待共享的数据
    Widget child,
  }) : super(child: child);

  //获取当前MyInheritedWidget的实例
  static MyInheritedWidget of(BuildContext context) {
    return context.inheritFromWidgetOfExactType(MyInheritedWidget);
  }

  @override
  bool updateShouldNotify(MyInheritedWidget oldWidget) {
    // 新旧数据不一致时，返回true，通知依赖本widget的子widget，此时子widget中的didChangeDependencies方法会被调用
    return oldWidget.data != data;
  }
}

依赖MyInheritedWidget中的数据

class DependWidget extends StatefulWidget {
  @override
  DependWidgetState createState() {
    return new DependWidgetState();
  }
}

class DependWidgetState extends State<DependWidget> {
  @override
  Widget build(BuildContext context) {
    // 使用依赖的InheritedWidget中的数据
    return Text(MyInheritedWidget.of(context).data.toString());
  }

  // 当依赖的InheritedWidget中的数据发生变化时，调用此方法
  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    print('change.....');
  }
}

当共享数据变化时，依赖发生变化。

class _MyHomePageState extends State<MyHomePage> {
  int count = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: MyInheritedWidget(
          data: count,// setState后  共享数据变化
          child: Center(
            child: DependWidget(),// 共享数据变化，影响该widget
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
          onPressed: () {
              setState(() {
                ++count;// 数据变化
              },
            );
          },
        child: Icon(Icons.add),
      ),
    );
  }
}