Что такое AnimationController в Flutter?

«Что такое AnimationController в Flutter?» — вопрос из категории Анимации, который задают на 29% собеседований Flutter Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

AnimationController — это центральный дирижёр анимации в Flutter. Это специальный объект, который генерирует линейную последовательность значений (обычно от 0.0 до 1.0) за заданный промежуток времени и управляет жизненным циклом анимации (старт, пауза, остановка, повтор).

Ключевые аспекты и пример использования:

  1. TickerProvider: Контроллеру требуется источник тиков (Ticker). На практике это означает использование миксина SingleTickerProviderStateMixin (или TickerProviderStateMixin для нескольких контроллеров) в State классе виджета.

  2. Связь с анимацией: Сам по себе контроллер генерирует только числа. Чтобы анимировать свойства виджета, его связывают с Animation или CurvedAnimation.

  3. Типичный паттерн использования в StatefulWidget:

    class PulsatingCircle extends StatefulWidget {
      const PulsatingCircle({super.key});
    
      @override
      State<PulsatingCircle> createState() => _PulsatingCircleState();
    }
    
    class _PulsatingCircleState extends State<PulsatingCircle>
        with SingleTickerProviderStateMixin {
      late AnimationController _controller;
      late Animation<double> _scaleAnimation;
    
      @override
      void initState() {
        super.initState();
        // 1. Инициализация контроллера
        _controller = AnimationController(
          vsync: this, // Источник тиков
          duration: const Duration(milliseconds: 800),
        );
        // 2. Создание анимации с кривой и диапазоном значений
        _scaleAnimation = Tween<double>(begin: 1.0, end: 1.5).animate(
          CurvedAnimation(parent: _controller, curve: Curves.easeInOut),
        );
        // 3. Запуск анимации с повторением
        _controller.repeat(reverse: true);
      }
    
      @override
      Widget build(BuildContext context) {
        // 4. Использование анимации в виджете через AnimatedBuilder
        return AnimatedBuilder(
          animation: _scaleAnimation,
          builder: (context, child) {
            return Transform.scale(
              scale: _scaleAnimation.value,
              child: Container(
                width: 100,
                height: 100,
                decoration: const BoxDecoration(
                  color: Colors.blue,
                  shape: BoxShape.circle,
                ),
              ),
            );
          },
        );
      }
    
      @override
      void dispose() {
        // 5. ОБЯЗАТЕЛЬНО освобождаем ресурсы
        _controller.dispose();
        super.dispose();
      }
    }

Почему это важно: Без AnimationController невозможно создать кастомную, управляемую по времени анимацию. Он предоставляет низкоуровневый контроль, на котором строятся все высокоуровневые анимационные виджеты (AnimatedContainer, AnimatedOpacity и т.д.).