aagarwal1012 / aagarwal1012/Animated-Text-Kit
Rotate Animation Causes Row to Move
- 主要语言
- Dart
- 星标
- 1.8k
- 派生
- 321
- PR 合并指标
- 30 天内没有已合并 PR
描述
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: [
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
贡献指南
调研方向
The issue is with RotateAnimatedText causing layout shifts in a Row inside a Column and SingleChildScrollView. Start by examining the RotateAnimatedText implementation in the animated_text_kit package, likely in lib/src/rotate.dart. Reproduce the bug with the provided code sample on Flutter web. Look at how the animation affects the widget's size or constraints during the rotation transition. Check if there's a fixed height or width that should be applied to prevent the row from moving.
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- dart, flutter
- 领域
- desktop, frontend, mobile
- Issue 类型
- 缺陷
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 活跃度
- 停滞
- 描述清晰度
- 描述清楚
- 新手友好度
- 55/100