floating_text

Description:

floating text

Floating Text #














A light weight flutter package that provides beautiful floating text animations.
Getting Started #
Add this package in your project's dependencies.
dependencies:
floating_text: ^0.2.0
copied to clipboard
Import the package:
import 'package:floating_text/floating_text.dart'
copied to clipboard
Use Anywhere instead of Text Widget:
Demo's #


Demo 1
Demo 2
Demo 3









Demo 4
Demo 5








Key Features #

Light Weight ( Only 100 Lines of code inside package )
Support any Text on the Screen
Custom style for the floating/animated text
Custom style support for the non floating text
highly customizable
Easy to use

Use On Any Widget #
RaisedButton(
onPressed: () {},
child: FloatingText(
text: 'Button',
repeat: true,
duration: Duration(milliseconds: 500),
),
),
copied to clipboard

Set repeat true for repeating the animation #
FloatingText(
text: "WELCOME",
repeat: true,
duration: Duration(milliseconds: 600),
floatingTextStyle: TextStyle(
color: Colors.blue,
fontSize: 50,
),
textStyle: TextStyle(
color: Colors.black38,
fontSize: 60,
)),
onAnimationComplete: () {
//Do your stuff
},
copied to clipboard
Use your custom text style #
FloatingText(
text: 'Congratulations',
repeat: true,
textStyle: TextStyle(
fontSize: 40,
color: Colors.black54,
),
floatingTextStyle: TextStyle(
color: Colors.red,
fontSize: 40,
shadows: [
BoxShadow(
color: Colors.yellow,
blurRadius: 10,
)
],
),
),
copied to clipboard
Full Example #
FloatingText(
text: 'Congratulations',
repeat: true,
repeatCount: 5,
isRTL: false,
duration: Duration(milliseconds: 100),
textStyle: TextStyle(
fontSize: 40,
color: Colors.black54,
),
floatingTextStyle: TextStyle(
color: Colors.red,
fontSize: 40,
shadows: [
BoxShadow(
color: Colors.yellow,
blurRadius: 10,
)
],
),
onAnimationComplete: () {
print('Animation Completed');
},
),
copied to clipboard
Parameters #

text (String) - text to display on screen
repeat (Boolean) - by default false, set true if you want animation to repeat
repeatCount (Integer) - Number of time animation should repeat. repeat paramater must be true for it to work.
duration (Duration) - duration of the animation. Default value 200 milliseconds
isRTL (Boolean) - by default false, set true for RTL support
textStyle (TextStyle) - text style for floating/animating part of text
floatingTextStyle (TextStyle) - text style for not floating part of text
onAnimationComplete (Function - void) - Called once the animation is complete.


Tip: Experiment with different textStyle and non floatingTextStyle to get some new cool effects