Назад к вопросам
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.

Примеры виджетов для анимаций:

  • AnimatedContainer
  • AnimatedOpacity
  • Hero (для перехода между экранами)
  • AnimatedBuilder
  • SlideTransition
  • ScaleTransition
  • FadeTransition
// Пример 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),
      ),
    );
  }
}