Provider with AnimatedSwitcher Flutter

Question

I have a parent consumer with child animated switcher, I was expect that when the value of provider changes there will be some crossfade animation, but no animations happening! What went wrong here? Here is my code:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: _buildContent(context),
    );
  }

 Widget _buildContent(BuildContext context) {
    return Consumer<HomeProvider>(
        builder: (context, homeProvider, child) {
        return AnimatedSwitcher(duration: Duration(milliseconds: 300),
          child: _getAnimatedWidget(homeProvider, context),
        );
        },
      );
  }

And this is _getAnimatedWidget method:

Widget _getAnimatedWidget(HomeProvider homeProvider, BuildContext context){
    switch (homeProvider.homeResponse.status) {
      case Status.COMPLETED:
        return _buildHomeScreen(context, homeProvider);
      case Status.ERROR:
        return _parseError(context, homeProvider);
      case Status.LOADING:
        return _parseLoading(context);
      default:
        return Container();
    }
  }

Please, help me! I still don't know how to correctly update my UI with animations. I could provide an additional code, if needed.

Answer 1

You need to provide keys to the potential children of the AnimatedSwitcher as the docs specify. If the animation works sometimes, it's likely because the exact widget type that is returned is different. If the widget type is the same flutter needs the keys to detect the change in the child widgets.