Card widget, it's like a real playing card

card.dart

import 'package:flutter/material.dart';

class CardItem extends StatefulWidget {
  CardItem({Key key, this.color, this.value}) : super(key: key);

  final int value;
  final Color color;

  _CardItemState createState() => _CardItemState();
}

class _CardItemState extends State<CardItem> with TickerProviderStateMixin {
  // Animation used to slide the card to some position, after dragging ends
  AnimationController controller;
  Animation<double> animation;

  bool isDragging = false; //shows if card is dragging by finger
  bool isAnimating = false; //shows if card is thowing(sliding)

  double x; //card position in X axis
  double y; //card position in Y axis

  // Animation used to center the card, after finger touches card
  AnimationController controllerCentering;
  Animation<double> animationCentering;

  //varibles used to center the card, after finger touches card
  double dx = 0;
  double dy = 0;
  double dxx = 0;
  double dyy = 0;

  // Current position of finger while dragging
  double currentPanPositionX = 0;
  double currentPanPositionY = 0;

  // Position of finger when it starts dragging
  double firstPanPositionX = 0;
  double firstPanPositionY = 0;

  @override
  void initState() {
    controller = AnimationController(
        duration: const Duration(milliseconds: 500), vsync: this);
    animation = Tween<double>(begin: 0, end: 250)
        .chain(new CurveTween(
          curve: Curves.easeOutQuad,
        ))
        .animate(controller)
          ..addListener(() {})
          ..addStatusListener((AnimationStatus status) {
            if (status == AnimationStatus.completed) {
              setState(() {
                isAnimating = false;
              });
            }
          });

    controllerCentering = AnimationController(
        duration: const Duration(milliseconds: 500), vsync: this);
    animationCentering = Tween<double>(begin: 0, end: 1)
        .chain(new CurveTween(
          curve: Curves.easeOutQuad,
        ))
        .animate(controller)
          ..addListener(() {})
          ..addStatusListener((AnimationStatus status) {
            if (status == AnimationStatus.completed) {
              setState(() {});
            }
          });

    isDragging = false;
    x = 0;
    y = 0;

    super.initState();
  }

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

  // dragging card
  void _onTapUpdate(DragUpdateDetails details) {
    if (isAnimating) return;
    setState(() {
      // setting finger position to card position, dx and dy describes centering the card after first touch
      x = details.globalPosition.dx - dx;
      y = details.globalPosition.dy - dy;

      //setting current drag position
      currentPanPositionX = details.globalPosition.dx;
      currentPanPositionY = details.globalPosition.dy;

      isDragging = true;
      isAnimating = false;
    });
  }

  //when finger touches the card
  void _onPanStart(DragStartDetails startDetails) {
    setState(() {
      //setting finger first touch details
      firstPanPositionX = startDetails.globalPosition.dx;
      firstPanPositionY = startDetails.globalPosition.dy;

      currentPanPositionX = firstPanPositionX;
      currentPanPositionY = firstPanPositionY;

      //centering the card
      dxx = (x - firstPanPositionX).abs();
      dyy = (y - firstPanPositionY).abs();

      animationCentering = Tween<double>(begin: 0, end: 1)
          .chain(new CurveTween(
            curve: Curves.easeOutQuad,
          ))
          .animate(controllerCentering)
            ..addListener(() {
              setState(() {
                dx = dxx + (37.5 - dxx) * animationCentering.value;

                dy = dyy + (175 - dyy) * animationCentering.value;

                x = currentPanPositionX - dx;
                y = currentPanPositionY - dy;
              });
            })
            ..addStatusListener((AnimationStatus status) {
              if (status == AnimationStatus.completed) {
                dx = 37.5;
                dy = 175;
              }
            });

      controllerCentering.forward(from: 0.0);
    });
  }

  //when dragging is ended, and card slides to some position, in our case to endPointX
  void _onPanEnd(DragEndDetails endDetails) {
    double endPointX;

    // checking if card position on left side or on right side
    if (x < MediaQuery.of(context).size.width / 2) {
      endPointX = 0;
    } else {
      endPointX = MediaQuery.of(context).size.width - 70;
    }
    setState(() {
      isDragging = false;
      isAnimating = true;
      animation = Tween<double>(begin: x, end: endPointX)
          .chain(new CurveTween(
            curve: Curves.easeOutQuad,
          ))
          .animate(controller)
            ..addListener(() {
              setState(() {});
            })
            ..addStatusListener((AnimationStatus status) {
              if (status == AnimationStatus.completed) {
                setState(() {
                  isAnimating = false;
                  x = animation.value;
                });
              }
            });

      controller.forward(from: 0.0);
      isDragging = false;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Positioned(
      left: (isDragging) ? x : (isAnimating) ? animation.value : x,
      top: y,
      child: SizedBox(
          width: 75,
          height: 125,
          child: GestureDetector(
            onPanUpdate: (DragUpdateDetails details) {
              if (!isAnimating) {
                _onTapUpdate(details);
              }
            },
            onPanEnd: (DragEndDetails endDetails) => _onPanEnd(endDetails),
            onPanStart: (DragStartDetails startDetails) {
              if (!isAnimating) {
                _onPanStart(startDetails);
              }
            },
            child: Container(
              color: widget.color,
              width: double.infinity,
              height: double.infinity,
            ),
          )),
    );
  }
}