Pixel Launcher style transition between pages.

PixelLauncherTransition.dart

import 'package:flutter/material.dart';

class TestView extends StatefulWidget {
  @override
  _TestViewState createState() => _TestViewState();
}

class _TestViewState extends State<TestView> {
  PageController pageController;
  double panPosition = 1; // dummy value prevents division with 0
  double deviceHeight;

  void updatePageState() {
    setState(() {
      panPosition =
          pageController.position.pixels.abs(); // updates pan position
    });
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    pageController = PageController(
      keepPage: true,
    );
    pageController
        .addListener(updatePageState); // add listener to page controller.
  }

  @override
  Widget build(BuildContext context) {
    deviceHeight =
        MediaQuery.of(context).size.height; //get device screen height
    return Scaffold(
      backgroundColor: Colors.white,
      body: PageView(
        controller: pageController,
        scrollDirection: Axis.vertical, //vertical scroll
        children: <Widget>[
          Opacity(
            // opacity handles the transition effect
            opacity: 1 - (panPosition / deviceHeight),
            //first screen opacity goes from 1 to 0
            child: ScreenOne(),
          ),
          Opacity(
            opacity: (panPosition / deviceHeight),
            //first screen opacity goes from 0 to 1
            child: ScreenTwo(),
          )
        ],
      ),
    );
  }
}

class ScreenOne extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Screen-1'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.end,
        crossAxisAlignment: CrossAxisAlignment.end,
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[
          Container(
            height: 96,
            color: Colors.red,
          )
        ],
      ),
    );
  }
}

class ScreenTwo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Screen-2'),
      ),
      body: Center(
        child: Text('Screen-2'),
      ),
    );
  }
}