Countdown text with animation.

Preview:

preview.gif

Feature:

  • Auto calculate time pass.
  • Build-in animations and custom animation builder.
  • support reverse countDown.

Basic Usage:

AnimateCountdownText(
              initDuration: Duration(days: 450, hours: 4, minutes: 10, seconds: 50),
              // Must provide initDuration or dateTime
              // dateTime: DateTime(2020, 7, 16, 5, 13, 10),
              format: (duration)=>DurationFormat(day:duration.inDays),
              characterTextStyle: TextStyle(fontSize: 16),
              animationType: AnimationType.bounceIn,
              reverse: true,
            )

All parameters:

Duration? initDurationInit Duration´╝î One of this and dateTime must provide.
DateTime? dateTimeCompared DateTime, One of this and initDuration must provide.
FormatDuration formatTransform duration to human-readable format, (Duration)=>FormatDuration
AnimationType animationTypeBuild-in animation type, will ignore this if animationBuilder is provided
TextStyle characterTextStyleCharacter TextStyle
TextStyle suffixTextStyleSuffix TextStyle
Duration intervalInterval to refresh view, default to 1 second
bool reverseDirection, default to false. Set it to true if you want to count reverse
Duration? expireDurationThe max duration that should mark countdown as done, If not null, format will return this as duration params when timeUp. Default to Duration.zero.
Duration? reverseExpireDurationThe max duration that should mark reverse countdown as done,<br/> If not null, format will return this as duration when timeUp. Default to null.
VoidCallback? onDoneCallback when timeUp. Only work when expireDuration is not null.
EdgeInsets characterPaddingPadding of characters, including character and suffix
AnimationBuilder? animationBuilderCustom animation builder.

Libraries

animate_countdown_text