如何在父状态更改后重建子项（和重放动画）

Posted 2021-03-28

我的父小部件包含isLiked bool字段。

最初构建子窗口小部件时，它们会播放动画。请注意以下代码段：

@override
void initState() {
    ...
    _animationController.forward();
}

我使用InheritedWidget访问父母的州。我尝试将_animationController.reset()添加到initState()，但这也不起作用。

我认为在父状态更新时不会重建此子组件。我正在使用以下（可重用）代码将状态传递给小部件树，如此flutter reactive state article.中所述

import 'package:flutter/widgets.dart';

class Provider extends StatefulWidget {
  const Provider({this.data, this.child});

  static of(BuildContext context) {
    _InheritedProvider p =
        context.inheritFromWidgetOfExactType(_InheritedProvider);
    return p.data;
  }

  final data;
  final child;

  @override
  State<StatefulWidget> createState() => new _ProviderState();
}

class _ProviderState extends State<Provider> {
  @override
  initState() {
    super.initState();
    widget.data.addListener(didValueChange);
  }

  didValueChange() => setState(() {});

  @override
  Widget build(BuildContext context) {
    return new _InheritedProvider(
      data: widget.data,
      child: widget.child,
    );
  }

  @override
  dispose() {
    widget.data.removeListener(didValueChange);
    super.dispose();
  }
}

class _InheritedProvider extends InheritedWidget {
  _InheritedProvider({this.data, this.child})
      : _dataValue = data.value,
        super(child: child);
  final data;
  final child;
  final _dataValue;

  @override
  bool updateShouldNotify(_InheritedProvider oldWidget) {
    return _dataValue != oldWidget._dataValue;
  }
}

答案

你的孩子小部件正在重建，但他们相应的State对象不是。 initState只被调用一次，因为框架试图在可能的情况下重用它们。要在发生这种情况时收到通知，您可以使用didUpdateWidget生命周期方法。例如，每次配置更改时重新启动控制器：

class MyState extends State<MyWidget> {
  @override
  void initState() {
    super.initState();
    // do initial setup.
  }

  @override
  void didUpdateWidget(MyWidget oldWidget) {
     super.didUpdateWidget(oldWidget);
    // do subsequent updates.
  }

  ...
}

您甚至可以比较widget和oldWidget上的成员，并有条件地重启或停止动画。