Middle
Чӣ гуна интихоби роҳи мувофиқ барои ворид кардани анимация дар барномаи Flutter?
sobes.tech AI
Ҷавоб аз AI
Интихоб вобаста аст аз мураккабияти анимация, басомати он ва суръати он ва дараҷаи ҳамкории бо корбар.
Роҳҳои асосӣ:
- ImplicitlyAnimatedWidgets: Анимацияҳои содда барои гузариш барои тағир додани хусусиятҳои widget (андоза, ранг, шаффофият). Автоматӣ тағиротҳоро аниматсия мекунанд.
// Мисоли AnumatedContainer AnimatedContainer( duration: const Duration(seconds: 1), width: _size, height: _size, color: _color, alignment: Alignment.center, curve: Curves.fastOutSlowIn, child: const FlutterLogo(size: 75), ); - AnimatedBuilder ва AnimationController: Барои анимацияҳои мураккаб ва фармоишӣ. Ниёз дорад ба идоракунии равшан тавассути
AnimationControllerва навсозии widget боAnimatedBuilder.// Мисоли RotationTransition бо AnimationController class RotatingSquare extends StatefulWidget { @override _RotatingSquareState createState() => _RotatingSquareState(); } class _RotatingSquareState extends State<RotatingSquare> with SingleTickerProviderStateMixin { late AnimationController _controller; late Animation<double> _animation; @override void initState() { super.initState(); _controller = AnimationController( duration: const Duration(seconds: 2), vsync: this, )..repeat(); // Такрор додани анимация _animation = CurvedAnimation( parent: _controller, curve: Curves.linear, // Кривая ростиии хаттӣ ); } @override void dispose() { _controller.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return RotationTransition( // Вижаги барои чархзанӣ turns: _animation, child: Container( width: 100, height: 100, color: Colors.blue, ), ); } } - AnimatedWidget: Класс абстрактӣ барои сохтани widget-ҳои аниматсионӣ, ки метавонанд такрор истифода шаванд. Соддасозии сохтани widget-ҳое, ки аз
AnimationControllerвобастаанд.// Мисоли ScaleTransition (аз AnimatedWidget мерос мегирад) ScaleTransition( scale: _animation, child: const FlutterLogo(size: 75), ); - Hero анимацияҳо: Анимацияҳои гузариш байни экранҳо, вақте ки як ваҳдати "парвоз" мекунад аз як экран ба дигар.
// Дар аввалин экран Hero(tag: 'logo', child: FlutterLogo(size: 50)); // Дар дуввумин экран Hero(tag: 'logo', child: FlutterLogo(size: 200)); - CustomPaint: Барои расмкашии графикаи фармоишӣ ва анимацияи он. Ниёз дорад ба фаҳмиши амиқ дар расмкашӣ дар канвас.
Таблиғи муқоиса:
| Раванди | Мураккабият | Назорат бар анимация | Истифода |
|---|---|---|---|
| ImplicitlyAnimatedWidgets | Кам | маҳдуд | Тасҳеҳоти содда дар хусусиятҳо |
| AnimatedBuilder/Controller | Миёна | пурра | Анимацияҳои мураккаб/фармоишӣ |
| AnimatedWidget | Миёна | пурра | Вижагиҳои аниматсионӣ барои такрор истифода бурда мешаванд |
| Hero анимацияҳо | Кам | маҳдуд | Гузаришҳо байни экранҳо |
| CustomPaint | Баландӣ | пурра | Графикаи фармоишӣ |
Интихоб кунед усули соддатар, ки талаботҳои анимацияро қонеъ мекунад. Барои ҳолатҳои содда, ImplicitlyAnimatedWidgets беҳтар аст. Барои сценарийҳои мураккаб ва фармоишӣ, AnimatedBuilder бо AnimationController истифода баред. Hero барои гузаришҳо, CustomPaint барои графикаи мураккаб.