Stutter on flutter animations package

Viewed 206

I am trying to implement shared_axis_transition on my flutter application's bottom navigation. The setup consists of A root page with bottom navigation bar and 4 other pages which changes according to the index of bottom navigation. The problem is, each of the widgets are stateful and have their own initstate. When I try to apply animation, after animation completes, the widget rebuilds itself and sort of flickering effect is seen. How do I solve the issue? My code pattern is as follow:

RootWidget{
   body: PageTransitionSwitcher(
                duration: const Duration(milliseconds: 300),
                transitionBuilder: (
                  Widget child,
                  Animation<double> animation,
                  Animation<double> secondaryAnimation,
                ) {
                  return SharedAxisTransition(
                    child: child,
                    animation: animation,
                    secondaryAnimation: secondaryAnimation,
                    transitionType: _transitionType,
                  );
                },
                child: [First(),Second(),Third(),Fourth()].elementAt[index],
              ),
            ),

   bottomNavigationBar(),
}

Each of the widget have their own initstate which I believe is causing this. p.s For the first time since I started flutter, animations in debug environment looks smoother than animation in release...

0 Answers
Related