All Projects → thecodepapaya → show_up_animation

thecodepapaya / show_up_animation

Licence: MIT license
A flutter package to simplify the common "show up" animation

Programming Languages

dart
5743 projects
kotlin
9241 projects
swift
15916 projects
objective c
16641 projects - #2 most used programming language

Projects that are alternatives of or similar to show up animation

pub-scaff
scaff, scaffold generator for Dart and Flutter
Stars: ✭ 27 (+22.73%)
Mutual labels:  pubdev
awesome-pubdev
A curated list of awesome packages on pub.dev
Stars: ✭ 85 (+286.36%)
Mutual labels:  pubdev
pub updater
A Dart package which supports checking if a current package is up-to-date.
Stars: ✭ 43 (+95.45%)
Mutual labels:  pubdev
flutter map tile caching
Plugin for 'flutter_map' providing advanced caching functionality, with ability to download map regions for offline use.
Stars: ✭ 66 (+200%)
Mutual labels:  pubdev
flutter opencv
Flutter plug-in providing (a few) basic bindings to OpenCV-4.x. OpenCV methods implemented without the Core packages. WIP.
Stars: ✭ 119 (+440.91%)
Mutual labels:  pubdev

show_up_animation Build Status

A flutter package to simplify the implementation of "show up" animation

Getting Started

Install dependencies

dependencies:
  show_up_animation: ^1.0.2

Then import wherever you want to implement the animation

import 'package:show_up_animation/show_up_animation.dart';

ShowUpAnimation

Wrap any widget you want to animate inside ShowUpAnimation widget and provide a Duration() to delayStart field to control after how much delay the animation fires.

ShowUpAnimation(
  delayStart: Duration(seconds: 1),
  animationDuration: Duration(seconds: 1),
  curve: Curves.bounceIn,
  direction: Direction.vertical,
  offset: 0.5,
  child: YourWidget(),
),

ShowUpList

To create a list of "show up" animations, use ShowUpList and provide your list of widgets to children parameter.

ShowUpList(
  direction: Direction.horizontal,
  animationDuration: Duration(milliseconds: 1500),
  delayBetween: Duration(milliseconds: 800),
  offset: -0.2,
  children: <Widget>[
    Widget1(),
    Widget2(),
    Widget3(),
    Widget4(),
  ],
),

Properties

ShowUpAnimation Properties

You can customize how to do you want to animate your child using the parameters described below.

Property Function
child The widget on which to apply the given ShowUpAnimation
offset The offset by which to slide and [child] into view from [Direction]. Use negative value to reverse animation [direction]. Defaults to 0.2
curve The curve used to animate the [child] into view. Defaults to [Curves.easeIn]
direction horizontal or vertical
delayStart The delay with which to animate the [child]. Takes in a [Duration] and defaults to 0 seconds
animationDuration The total duration in which the animation completes. Defaults to 800 milliseconds

ShowUpList Properties

Property Function
children The list of widgets on which to apply the given ShowUpAnimation
offset The offset by which to slide and [child] into view from [Direction]. Use negative value to reverse animation [direction]. Defaults to 0.2
curve The curve used to animate each [child] into view. Defaults to [Curves.easeIn]
direction horizontal or vertical
delayBetween he delay between animating each [children] into view. Takes in a [Duration] and defaults to 300 milliseconds
animationDuration The total duration in which the animation of each child completes. Defaults to 500 milliseconds

Demo

videotogif_2020 04 21_19 44 01 videotogif_2020 04 30_04 07 18

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].