wheely_card

import 'package:flutter/material.dart';
import 'dart:math' as math;

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Wheely Card Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  PageController _controller;

  double scrollOffset = 0.0;


  @override
  void initState(){
    super.initState();
    _controller = PageController(
        initialPage: 0,
        viewportFraction: .645
    );

    _controller.addListener(() {
      setState(() {
        scrollOffset = _controller.page;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: PageView.builder(
          itemCount: 3,
            controller: _controller,
            itemBuilder: (ctx, index){
          double alignment = math.exp(- math.pow(scrollOffset - index, - 2) / 3);
          bool fromLefft = scrollOffset.round() > index;

          return Align(
            alignment: Alignment(0, alignment),
            child: Transform.rotate(
              angle: fromLefft ? - (alignment * .6) : (alignment * .6),
              child: Container(
                height: 300 - alignment * 3 ,
                width: 250 - alignment * 3,
                color: Colors.primaries[index],
              ),
            ),
          );
        }),
      ),
    );
  }
}