الحركات الضمنية (Implicit) — الأسهل
ويدجتس تتحرّك تلقائيًّا عند تغيّر خصائصها:
AnimatedContainer(
duration: const Duration(milliseconds: 300),
width: expanded ? 200 : 100,
height: 100,
color: expanded ? Colors.purple : Colors.blue,
curve: Curves.easeInOut,
)
غيّر expanded عبر setState → ينتقل بسلاسة.
ويدجتس متحرّكة جاهزة
AnimatedOpacity(opacity: visible ? 1 : 0, duration: ...)
AnimatedPadding(...)
AnimatedDefaultTextStyle(...)
Hero — انتقال مشترك بين الشاشات
// في الشاشة الأولى
Hero(tag: "logo", child: Image.asset("logo.png"))
// في الثانية (نفس tag)
Hero(tag: "logo", child: Image.asset("logo.png"))
ينشئ انتقالًا سلسًا للعنصر بين الشاشتين.
الحركات الصريحة (Explicit)
للتحكّم الكامل، استخدم AnimationController مع AnimatedBuilder — أقوى لكن أعقد.
💡 ابدأ بالحركات الضمنية (Animated*) — تغطّي معظم الحالات بأقلّ كود.
🎯 التالي: الحِزَم و pubspec.