animation - flutter rotate only one character of my text

Question

I am using WavyAnimatedTextKit() from the animated_text_kit package to write the word "BROKEN" on my app's welcome screen.

                Container(
                  margin: EdgeInsets.only(bottom: 60, top: 30),
                  height: 40,
                  child: WavyAnimatedTextKit(
                    isRepeatingAnimation: false,
                    text: ["BROKEN"],
                    textStyle: TextStyle(
                      fontSize: 35.0,
                      fontWeight: FontWeight.w700,
                      color: Colors.white,
                    ),
                  ),
                ),

After it's written on the screen, I would like to rotate animate the "K" by 180 degrees to the right.

I couldn't find a solution so far to rotate only a single character. Most solutions I found would only rotate the entire widget / Text.

Any ideas / solutions to animate a rotating character after the word is written on screen?

Thanks

question from:https://stackoverflow.com/questions/65884063/flutter-rotate-only-one-character-of-my-text

Answer 1

Try to split the text into 3 part side by side:

Row(children:[
WavyAnimatedTextKit(
                    isRepeatingAnimation: false,
                    text: ["BRO"],
                    textStyle: TextStyle(
                      fontSize: 35.0,
                      fontWeight: FontWeight.w700,
                      color: Colors.white,
                    ),
                  ),
RotatedBox(
  quarterTurns: 2,
  child:
WavyAnimatedTextKit(
                    isRepeatingAnimation: false,
                    text: ["K"],
                    textStyle: TextStyle(
                      fontSize: 35.0,
                      fontWeight: FontWeight.w700,
                      color: Colors.white,
                    ),
                  ),
),
WavyAnimatedTextKit(
                    isRepeatingAnimation: false,
                    text: ["EN"],
                    textStyle: TextStyle(
                      fontSize: 35.0,
                      fontWeight: FontWeight.w700,
                      color: Colors.white,
                    ),
                  ),
],),