DevelopmentMédio

Flutter Animations

pormadteacher·madteacher· v1.0.0 · atualizado em 2026-04-10

Score

Comprehensive guide for implementing animations in Flutter. Use when adding motion and visual effects to Flutter apps: implicit animations (AnimatedContainer, AnimatedOpacity, TweenAnimationBuilder), explicit animations (AnimationController, Tween, AnimatedWidget/AnimatedBuilder), hero animations (shared element transitions), staggered animations (sequential/overlapping), and physics-based animations. Includes workflow for choosing the right animation type, implementation patterns, and best practices for performance and user experience.

flutteranimationuimobile-developmentwidgetuser-experience

0Stars

0Forks

0Usos

Fork

Documento do Skill

SKILL.mdflutter-animations/workflow

Determine Animation Goal: — Define the desired visual effect and user interaction.

Choose Animation Type: — Select implicit, explicit, hero, staggered, or physics-based animation based on complexity and control needs.

Implement Animation: — Use Flutter widgets like `AnimatedContainer`, `AnimationController`, `Hero`, etc.

Configure Animation: — Set duration, curve, and tween for the animation.

Test Animation: — Verify smooth performance and desired effect on different devices.

Optimize Performance: — Refactor code, use `AnimatedBuilder`, and avoid unnecessary rebuilds.

Telemetria de Agentes

Execuções

total

Taxa de Sucesso

últimos 30d

Latência Média

0.0s

p50

Alucinação

0.0%

detecção

Tokens Entrada

avg 0/exec

Tokens Saída

avg 0/exec

Uso por Plataforma

Skills Relacionados

Similar adelight

40%

Similar aDesigning with Sleek

60%

Similar aExpo UI Guidelines

60%

Árvore do Skill

Flutter Animations

flutter-animations

Fases Cognitivas5

1.SENSE

2.CONTEXTUALIZE

3.RECOMMEND

4.ACT

5.REFLECT

Triggers7

add animation to a Flutter appimplement hero animation in Fluttercreate a staggered animation in Flutteranimate a widget in Flutteruse AnimatedContainer in Flutterimplement physics-based animation in Fluttercreate a transition between screens in Flutter

Avaliar este Skill

Score Breakdown

⭐Avaliação Humana0%

🤖Sucesso de Agentes0%

🕐Atualidade100%

🔗Saúde de Dependências100%

🕸️Centralidade no Grafo0%

🛡️Segurança50%

CompositeScore = α·Humano + β·Agente + γ·Recência + δ·Deps + ε·Centralidade + ζ·Segurança

Instalação

$ synaptic mcp download flutter-animations

$ synaptic skills detail flutter-animations

$ synaptic skills live flutter-animations

Links

GitHub Repository