flutterflutter-animationflutter-design

Flutter - Fade animate Text widget when its content changes

I want to animate my Text widget when it's content changes. Is there a way to do it without having two seperate Text widgets?

To make it clear, I have an authentication screen where I change a Text widget from Login to Register or vice versa. This should be animated smoothly in a fade transition.

Text('${_mode == AuthMode.Register ? 'Register' : 'Login'}', 
     style: Theme.of(context).textTheme.title),

Of course I could just simply make two Text widgets and fade the one in and the other one out. But is there a simpler way?

Kind Regards, pichlerAT

Solution

  • For fade in/out between two widgets, check this

    https://api.flutter.dev/flutter/widgets/AnimatedCrossFade-class.html