Roi Snir
Roi Snir

Reputation: 441

Text overflow animation

How can I accomplish this kind of text animation with flutter when text is longer than it's container?

text oveeflow animation example

thanks

Upvotes: 6

Views: 2429

Answers (3)

Truong Viet Hoang
Truong Viet Hoang

Reputation: 46

Try this package: https://pub.dev/packages/overflow_text_animated

OverflowTextAnimated(
    text: overflowText,
    style: descriptionStyle,
    animation: OverFlowTextAnimations.infiniteLoop,
    loopSpace: 30,
)

Upvotes: 0

Amir Aghajani
Amir Aghajani

Reputation: 387

AutoSizeText(

        text,

        minFontSize: fontSize,

        maxFontSize: fontSize,

        style: TextStyle(

          fontSize: fontSize,

          fontWeight:fontWeight,

        ),

        overflowReplacement: Marquee(

          text: text,

          blankSpace: blankSpace,

          accelerationCurve: Curves.easeOutCubic,

          velocity: velocity,

          startPadding: 2.0,

          startAfter: startAfter,

          pauseAfterRound: pauseAfterRound,

          style: TextStyle(

            fontSize: fontSize,

            fontWeight: fontWeight,

          ),

        ),

  ),

Upvotes: -1

Darish
Darish

Reputation: 11481

You may try this package.

Example:

  Marquee(
  text: 'Some sample text that takes some space.',
  style: TextStyle(fontWeight: FontWeight.bold),
  scrollAxis: Axis.horizontal,
  crossAxisAlignment: CrossAxisAlignment.start,
  blankSpace: 20.0,
  velocity: 100.0,
  pauseAfterRound: Duration(seconds: 1),
  startPadding: 10.0,
  accelerationDuration: Duration(seconds: 1),
  accelerationCurve: Curves.linear,
  decelerationDuration: Duration(milliseconds: 500),
  decelerationCurve: Curves.easeOut,
)

Upvotes: 5

Related Questions