Блог

Я пытаюсь создать квадратную анимацию из центра экрана, которая открывается из центра (начиная с очень маленького и увеличиваясь от центра квадрата, к сожалению, что происходит с моим кодом, так это то, что анимация в качестве параметра для прямоугольника в CustomPaint , поскольку Size(transitionTween.value, transitionTween.value) анимация не растетцентр from выходит, но сначала начинается с вершины влево / вверх, увеличивая прямоугольник вправо вместо центра. Как я могу получить эффект, чтобы моя анимация начиналась и увеличивалась от центра

 import 'package:flutter/material.dart';

class PointToCircle extends StatefulWidget {
  @override
  _PointToCircleState createState() => _PointToCircleState();
}

class _PointToCircleState extends State<PointToCircle>
    with TickerProviderStateMixin {
  AnimationController _controller;
  Animation<double> transitionTween;
  // Animation<BorderRadius> borderRadius;

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

    _controller = AnimationController(
        duration: const Duration(milliseconds: 2000), vsync: this);
    
    transitionTween = Tween<double>(
      begin: 1.0,
      end: 200.0,
    ).animate(
      CurvedAnimation(
        parent: _controller,
        curve: Curves.easeIn,
      ),
    );

    _controller.forward();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _controller,
      builder: (BuildContext context, Widget child) {
        return Scaffold(
            body: new Center(
                child: CustomPaint(
          painter: OpenPainter(transitionTween),
        )));
      },
    );
  }
}

class OpenPainter extends CustomPainter {
  Animation<double> transitionTween;
  OpenPainter(this.transitionTween);

  @override
  void paint(Canvas canvas, Size size) {
    var paint1 = Paint()
      ..color = Colors.blue
      ..style = PaintingStyle.stroke;

    canvas.drawRect(
        Offset(-50, -100) amp; Size(transitionTween.value, transitionTween.value),
        paint1);
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) => true;
}
  

Найдено решение добавить a size:Size(transition.value,transition.value); в пользовательскую краску, оставив также динамическую анимацию внутри размера прямоугольника

но я не понимаю, почему сейчас работает