flutter_deck icon indicating copy to clipboard operation
flutter_deck copied to clipboard

docs: introduce animated_to as a handy animation package

Open chooyan-eng opened this issue 8 months ago • 1 comments

Description

How do you like introducing animated_to package somewhere in the document?

I believe animated_to will be a good tool to make more polished slide decks with animations in a handy way.

Let's say, if we want to display texts one by one with animation like below:

Image

you can just wrap Text with AnimatedTo.

AnimatedTo.spring(
  globalKey: _someGlobalKey,
  child: Text('whatever text'),
  slidingFrom: const Offset(0, 200),
),

This also enables us to make more complex animations like:

Image

We can still make this only by wrapping the circle widget with AnimatedTo and updating the structure of the widget tree by causing a rebuild.

This would let flutter_deck users focus on making content in each slide deck without making them consider how to implement animations.

You can see the source code of my usage here.

https://github.com/chooyan-eng/flutter_ninjas_2025/blob/main/lib/slide/why_declarative_slide.dart

and here

https://github.com/chooyan-eng/flutter_ninjas_2025/blob/main/lib/slide/impure_shell_slide.dart

chooyan-eng avatar Jul 01 '25 03:07 chooyan-eng

Another idea would be to suggest an utility widget to simplify the global key management:

class Animated extends StatelessWidget {
  const Animated(
    this.id, {
    super.key,
    required this.child,
    required this.slidingFrom,
  });

  final String id;
  final Widget child;
  final Offset? slidingFrom;

  static final Map<String, GlobalKey> keys = {};

  @override
  Widget build(BuildContext context) {
    return AnimatedTo.spring(
      globalKey: keys.putIfAbsent(
        id,
        () => GlobalKey(debugLabel: id),
      ),
      slidingFrom: slidingFrom,
      child: child,
    );
  }
}
Animated(
  'title',
  slidingFrom: const Offset(0, 200),
  child: Text('whatever text'),
),

Having static global keys is not recommended in a regular app, but for such a constrained environment it is fine and I find it a bit simpler this way.

aloisdeniel avatar Jul 01 '25 12:07 aloisdeniel