import 'package:flutter/material.dart';



class PageA extends StatefulWidget {





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

class _PageAState extends State<PageA> with TickerProviderStateMixin{

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("PageA"),
      ),
      body: Center(
        child: Text("okay"),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.endDocked,
      floatingActionButton: TransitionFab(
        screenHeight: MediaQuery.of(context).size.height - 65.0,
        screenWidth: MediaQuery.of(context).size.width,
      ),
    );
  }
}

class TransitionFab extends StatefulWidget {

  var screenWidth;
  var screenHeight;

  TransitionFab({this.screenWidth, this.screenHeight});

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

class _TransitionFabState extends State<TransitionFab> with TickerProviderStateMixin{

  AnimationController _controller;
  Animation _animationBorderRadius;
  Animation _animationFabSizeWidth;
  Animation _animationFabSizeHeight;
  Animation _animationNegativePadding;

  bool didStart = false;


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

    _controller = new AnimationController(vsync: this, duration: Duration(milliseconds: 400));

    _animationBorderRadius = BorderRadiusTween(
        begin: BorderRadius.circular(75.0),
        end: BorderRadius.circular(0.0)
    ).animate(CurvedAnimation(
        parent: _controller,
        curve: Curves.ease
    ));

    _animationFabSizeWidth = Tween(
        begin: 50.0,
        end: widget.screenWidth
    ).animate(CurvedAnimation(
        parent: _controller,
        curve: Curves.ease
    ));

    _animationFabSizeHeight = Tween(
      begin: 50.0,
      end: widget.screenHeight,
    ).animate(CurvedAnimation(
        parent: _controller,
        curve: Curves.ease
    ));


  }

  void startAnim(){
    setState(() {
      didStart = !didStart;
    });
    if(didStart){
      _controller.reverse();
    }else{
      _controller.forward();
    }
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _controller,
      builder: (BuildContext context, Widget child){
        return InkWell(
          onTap: () => this.startAnim(),
          child: new Container(
            width: _animationFabSizeWidth.value,
            height: _animationFabSizeHeight.value,
            decoration: BoxDecoration(
                borderRadius: _animationBorderRadius.value,
                color: Colors.blue[500]
            ),
            child: Icon(Icons.add, color: Colors.white),
          ),
        );
      }
    );
  }
}