Назад к вопросам
Junior
175
questionbank
Какие существуют виды анимаций в Flutter?
Sobes Copilot
Получайте ответы в реальном времени
Ответ от нейросети
sobes.tech AI
- Tween Animation
- Physics-based Animation
Tween Animation:
Основана на интерполяции значений между начальным и конечным состоянием. Использует AnimationController, Animation и Tween.
Physics-based Animation:
Имитирует реальные физические процессы, такие как пружины (spring) или демпфирование (damping). Приятнее для пользователя, так как чувствуется более реалистично. Использует пакет flutter/physics.
Примеры виджетов для анимаций:
AnimatedContainerAnimatedOpacityHero(для перехода между экранами)AnimatedBuilderSlideTransitionScaleTransitionFadeTransition
// Пример Tween анимации
import 'package:flutter/material.dart';
class AnimatedContainerExample extends StatefulWidget {
const AnimatedContainerExample({super.key});
@override
State<AnimatedContainerExample> createState() =>
_AnimatedContainerExampleState();
}
class _AnimatedContainerExampleState extends State<AnimatedContainerExample> {
bool _isBig = false;
void _toggleSize() {
setState(() {
_isBig = !_isBig;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('AnimatedContainer Example')),
body: Center(
child: AnimatedContainer(
duration: const Duration(seconds: 1), // Длительность анимации
curve: Curves.easeInOut, // Кривая анимации
width: _isBig ? 200.0 : 100.0,
height: _isBig ? 200.0 : 100.0,
color: _isBig ? Colors.blue : Colors.red,
alignment: _isBig ? Alignment.center : Alignment.topLeft,
child: FlutterLogo(size: _isBig ? 100 : 50),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _toggleSize,
tooltip: 'Toggle Size',
child: const Icon(Icons.swap_vert),
),
);
}
}