felixblaschke

var aNumber = StateProvider((_) => 0);

class SomeButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      child: Text("Click me"),
      onPressed: () => buttonClicked(context),
    );
  }

felixblaschke

var aNumber = StateProvider((_) => 0);

class SomeWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Consumer(builder: (context, watch, _) { // access the global variables pool
      var number = watch(aNumber).state; // keep an eye on "aNumber"

      return Text("My number is $number");
    });

felixblaschke

void main() {
  runApp(ProviderScope(child: MyApp()));
}

felixblaschke

var aNumber = StateProvider((_) => 0);
var aString = StateProvider((_) => 'Hello');
var aColor = StateProvider<Color>((_) => Colors.red);
var aWidget = StateProvider<Widget>((_) => Text("Hi!"));

felixblaschke

TimelineTween<Prop> _createComplexTween() {
  var tween = TimelineTween<Prop>();

  var fadeIn = tween.addScene(begin: 0.seconds, duration: 1.seconds)
    .animate(Prop.x, ...)
    .animate(Prop.y, ...);

  var grow = fadeIn.addSubsequentScene(duration: 2.seconds) // right after fadeIn
    .animate(Prop.x, ...)
    .animate(Prop.y, ...);

felixblaschke

var _tween = TimelineTween<AniProps>()
  ..addScene(begin: 0.seconds, duration: 1.seconds)
      .animate(AniProps.x, tween: (-100.0).tweenTo(100.0)) // x to right
  ..addScene(begin: 1.seconds, duration: 1.seconds)
      .animate(AniProps.y, tween: (-100.0).tweenTo(100.0)) // y down
  ..addScene(begin: 2.seconds, duration: 1.seconds)
      .animate(AniProps.x, tween: (100.0).tweenTo(-100.0)) // x to left
  ..addScene(begin: 3.seconds, duration: 1.seconds)
      .animate(AniProps.y, tween: (100.0).tweenTo(-100.0)); // y up

felixblaschke

var _tween = TimelineTween<AniProps>()
  ..addScene(begin: 0.seconds, duration: 1.seconds) // 0 - 1s
      .animate(AniProps.x, tween: (0.0).tweenTo(100.0)) // move x: 0 -> 100
  ..addScene(begin: 1.seconds, duration: 1.seconds) // 1 - 2s
      .animate(AniProps.y, tween: (0.0).tweenTo(100.0)) // move y: 0 -> 100

felixblaschke

// Create enum that defines the animated properties
enum AniProps { width, height, color }

class MyAnimatedWidget extends StatelessWidget {

  // Specify your tween
  final _tween = MultiTween<AniProps>()
    ..add(AniProps.width, 0.0.tweenTo(100.0), 1000.milliseconds)
    ..add(AniProps.width, 100.0.tweenTo(200.0), 500.milliseconds)

felixblaschke

final _tween = MultiTween<AniProps>()
  ..add(AniProps.width, 0.0.tweenTo(100.0), 1000.milliseconds)
  ..add(AniProps.width, 100.0.tweenTo(200.0), 500.milliseconds)
  ..add(AniProps.height, 0.0.tweenTo(200.0), 2500.milliseconds)
  ..add(AniProps.color, Colors.red.tweenTo(Colors.blue), 3.seconds);

felixblaschke

import 'package:flutter/material.dart';
import 'package:simple_animations/simple_animations.dart';
import 'package:supercharged/supercharged.dart';

main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(