Animated-Text-Kit
Animated-Text-Kit copied to clipboard
Rotate Animation Causes Row to Move
Hello, First, I would like to say amazing work on the package it truly is one of the better free flutter packages out there! But I think there is a small bug with the rotating text animation.
I am working on a flutter web project and wanted to use the package. Though when I copied your sample code for the rotating animation and put it in a Column that is wrapped around a SingleChildScrollView the entire row seems to be moving whenever the animation is occurring. Im not sure if this is a coding mistake on my part or a true bug.
I have attached the code to reproduce below along with a short video.
body: SingleChildScrollView(
padding: EdgeInsets.all(size.longestSide * 0.03),
controller: scrollController,
child: Column(
children: [
Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
const SizedBox(width: 20.0, height: 100.0),
const Text(
'Be',
style: TextStyle(fontSize: 43.0),
),
const SizedBox(width: 20.0, height: 100.0),
DefaultTextStyle(
style: const TextStyle(
fontSize: 40.0,
fontFamily: 'Horizon',
),
child: AnimatedTextKit(animatedTexts: [
RotateAnimatedText('AWESOME'),
RotateAnimatedText('OPTIMISTIC'),
RotateAnimatedText('DIFFERENT'),
]),
),
],
)
],
),
),
Here is the result for: flutter --version:
Flutter 2.5.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 18116933e7 (3 weeks ago) • 2021-10-15 10:46:35 -0700
Engine • revision d3ea636dc5
Tools • Dart 2.14.4
Below is a screen recording of the problem.
https://user-images.githubusercontent.com/69125015/140864513-5624d00b-0c71-427f-85d2-91074188c850.mov
Hoping for the best!
Thanks, Rhino Inani
Try wrapping DefaultTextStyle or the AnimatedTextKit widget in a Container and set a fixed height