animated_widgets #

Easily add animations on your screen with AnimatedWidgets. Add always your animated widgets in your component's tree, then activate them when you want to activate the animations.

For example : add an OpacityAnimateWidget and a TranslationAnimatedWidget on a button, then activate it to display it !

class _MyScreenState extends State<MyScreen> {

  bool enabled = false;

  @override
  Widget build(BuildContext context) {
    return Stack(
      fit: StackFit.expand,
      children: <Widget>[
        Center(
          child: TapScaleAnimated(
            scale: 0.3,
            onTap: () {
              setState(() {
                enabled = !enabled;
              });
            },
            child: Container(height:100, width: 100, color: Colors.blue, child: Text("animate")),
          ),
        ),
        Positioned(
          bottom: 20,
          left: 20,
          right: 20,
          child: TranslationAnimatedWidget(
            enabled: enabled,
            values: [Offset(0, 200), Offset(0, 0)],
            child: RaisedButton(
              onPressed: () {},
              child: Text("Dismiss"),
            ),
          ),
        ),
      ],
    );
  }
}

Getting Started with Flutter #

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.