Skip to content

Commit c08245d

Browse files
authored
Merge pull request #29 from KaustubhBiswas/animations_docs
Added text animation docs
2 parents 855384d + b6a8330 commit c08245d

File tree

2 files changed

+37
-0
lines changed

2 files changed

+37
-0
lines changed

README.md

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -213,3 +213,35 @@ This Flutter application showcases a loading animation with a radial progress in
213213
- **Interactive Button:** There's an "Start" button that you can click to trigger the animation.
214214

215215

216+
## Flutter Text Animation
217+
218+
### Introduction
219+
Text Animations in flutter can be usually includes interpolation effects on a given text string. This can be put to good use for displaying text responses to the user. We can implement text animations in dart codes using `TweenAnimationBuilder` widget.
220+
221+
### Using `TweenAnimationBuilder`
222+
223+
1. **Import Dependencies**: Import the necessary Flutter libraries.
224+
225+
2. **Create an `TweenAnimationBuilder` Widget**: Use the TweenAnimationBuilder widget as the child of the necessary parent widget. Specify the necessary properties like the `tween` property, to set the initial and final sizes of the text font, mention the duration of the effect under the `duration` property, and finally for the `builder` property, return the Text widget on which you want to apply the effect. Please note that having a child widget is not compulsory for the TweenAnimationBuilder class.
226+
227+
3. **Trigger the Animation**: For triggering the animation, in the parameters for the `builder` property, change the `Object?` to the data type of the font size, and set the value of `fontSize` property in the Text widget to the corresponding parameter name of the object type.
228+
229+
Here's the sample code of an example:
230+
231+
```dart
232+
Widget build(BuildContext context) {
233+
return Scaffold(
234+
body: Center(
235+
child: TweenAnimationBuilder(
236+
tween: Tween<double>(begin: 1.0,end: 30.0),
237+
duration: Duration(seconds: 2),
238+
builder: (Buildcontext context, double value, Widget? child) {
239+
return Text('Text Animation Effect',style: TextStyle(fontWeight: FontWeight.bold,fontSize: value));
240+
},
241+
)
242+
)
243+
)
244+
}
245+
```
246+
247+
4. **Customize the Animation**: You can customize the animation effects using the different available properties and making suitable changes in the widget which you are returning from the `TennAnimationBuilder` widget. To learn more about this widget you can explore the official dart docs at `https://api.flutter.dev/flutter/widgets/TweenAnimationBuilder-class.html`.

windows/runner/flutter_window.cpp

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,11 @@ bool FlutterWindow::OnCreate() {
3131
this->Show();
3232
});
3333

34+
// Flutter can complete the first frame before the "show window" callback is
35+
// registered. The following call ensures a frame is pending to ensure the
36+
// window is shown. It is a no-op if the first frame hasn't completed yet.
37+
flutter_controller_->ForceRedraw();
38+
3439
return true;
3540
}
3641

0 commit comments

Comments
 (0)