Анимация изображения флаттера больше и меньше - PullRequest
Новая
       3

Анимация изображения флаттера больше и меньше

1 голос
/ 21 февраля 2020

Я хочу сделать простую повторяющуюся анимацию изображения. Он должен продолжать анимацию, пока пользователь не закроет экран. Что я хочу, чтобы изображение медленно становилось больше, а затем уменьшалось.

Я проверил animatedContainer, но, похоже, это не происходит динамически. Вот код, который я использовал с AnimatedContainer: 

@override
  void didChangeDependencies() {
  increaseSize(widget.seconds);
  super.didChangeDependencies();
}

void increaseSize(int toSize) {
for (i = 0; i > toSize; i++) {
  setState(() {
    _width += i;
    _height += i;
  });
 }
}

@override
  Widget build(BuildContext context) {
    return AnimatedContainer(
  // Use the properties stored in the State class.
  width: _width,
  height: _height,
  decoration: BoxDecoration(
    color: _color,
    borderRadius: _borderRadius,
  ),
   // Define how long the animation should take.
   duration: Duration(seconds: 30),
   // Provide an optional curve to make the animation feel smoother.
   curve: Curves.easeInOutBack,
   );
  ;
}

Кто-нибудь сталкивался с этим раньше, любая помощь будет оценена.

Большое спасибо

1 Ответ

0 голосов
/ 24 февраля 2020

Попробуйте что-то вроде этого:

Это пример контейнера, который увеличивается и уменьшается с 50 до 100 и обратно до 50. 

class SizeWidget extends StatefulWidget {
  final int seconds;

  const SizeWidget({this.seconds = 3});

  @override
  _SizeWidgetState createState() => _SizeWidgetState();
}

class _SizeWidgetState extends State<SizeWidget> with TickerProviderStateMixin {
  AnimationController _animationController;
  Animation _sizeAnimation;

  bool reverse = false;

  @override
  void initState() {
    super.initState();

    _animationController = AnimationController(
        vsync: this, duration: Duration(seconds: widget.seconds))
      ..addStatusListener((status) {
        if (status == AnimationStatus.completed) {
          _animationController.repeat(reverse: !reverse);
          reverse = !reverse;
        }
      });

    _sizeAnimation =
        Tween<double>(begin: 50.0, end: 100.0).animate(_animationController);
    _animationController.forward();
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _sizeAnimation,
      builder: (context, child) => Container(
        width: _sizeAnimation.value,
        height: _sizeAnimation.value,
        color: Colors.red,
      ),
    );
  }
}
...