destination_animation_v1.dart

/*
This examples defines a widget called "Destination" that displays two
widgets in a column: an "icon" and a "label". The Destination widget's
height is the height of the icon + the height of the label multiplied
by the Destination's "progress" parameter, a value between 0 and 1.
When progress is zero, the Destination's height is the same as the
icon's height, and when progress is 1.0 the Destination's height is the
sum of the icon and label's height

Tapping on the demo animates the Destination's progress value. The
Destination widget is clipped, so that only the part of the label exposed
by the progress parameter appears.
*/

import 'dart:math' as math;
import 'dart:ui' show lerpDouble;

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';


class Destination extends StatelessWidget {
  Destination({ Key key, this.icon, this.label, this.progress }) : super(key: key);

  final Widget icon;
  final Widget label;
  final double progress;

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        icon,
        Align(
          alignment: Alignment.topCenter,
          heightFactor: progress,
          widthFactor: 1.0,
          child: label,
        ),
      ],
    );
  }
}

class AnimationDemo extends StatefulWidget {
  @override
  _AnimationDemoState createState() => _AnimationDemoState();
}

class _AnimationDemoState extends State<AnimationDemo> with SingleTickerProviderStateMixin {
  AnimationController _controller;

  @override
  void initState() {
    super.initState();
    _controller = new AnimationController(
      duration: const Duration(milliseconds: 2000),
      vsync: this
    );
  }

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

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        if (_controller.isCompleted) {
          _controller.reverse();
        } else {
          _controller.forward();
        }
      },
      child: Scaffold(
        body: Center(
          child: DefaultTextStyle(
            style: Theme.of(context).textTheme.display2,
            child: Container(
              color: Colors.grey.withOpacity(0.15),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Text('Above'),
                  Container(
                    color: Colors.blue.withOpacity(0.15),
                    child: AnimatedBuilder(
                      animation: _controller,
                      builder: (BuildContext context, Widget child) {
                        return ClipRect(
                          child: Destination(
                            icon: Icon(Icons.android, size: 48),
                            label: Text('Hello World'), // Try 'Hello\nWorld' instead
                            progress: _controller.value,
                          ),
                        );
                      },
                    ),
                  ),
                  Text('Below'),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}


void main() {
  runApp(MaterialApp(title: 'Reveal Transition Demo', home: AnimationDemo()));
}