page_view_animation.dart

import 'package:flutter/material.dart';
import 'package:todos/images.dart';

void main() => runApp(MyApp());

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

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  final List<String> _movies = [
  'https://media.wsimag.com/attachments/0008a7cbd09e97ff723a48db20ee240902a540b9/store/fill/1090/613/d77a0e86916236a2114283d897f04be528a2637f5c3cecea1bca27d2ea04/Dune.jpg',
  'https://media.npr.org/assets/img/2019/07/11/lionking_wide-393969051a1b78c9d7bc4e01fe147ff3607573d2-s800-c85.jpg',
  'https://i1.wp.com/geekvibesnation.com/wp-content/uploads/2020/03/Bloodshot-Movie-Review.png?fit=800%2C400&ssl=1',
  'https://s1.dmcdn.net/v/RFJDU1TRxluhOo_EN/x1080',
  'https://miro.medium.com/max/2778/1*4UyyUI4cRY6PYKJFRfX65g.jpeg',
  'https://res.cloudinary.com/leetchi/image/upload/c_fill,f_auto,fl_lossy,g_center,h_520,q_80,w_715/v1583046587/9758894b-9ffe-4c96-9c7a-dac1aeaaf54d.jpg',
  'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSYglNPiDtdFHUlsZrBbIJD5-4GurkoYiTUFRzK3ZFfF5OKJJeB&usqp=CAU',
];
  
  int _selectedIndex = 0;

  static const _count = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Flutter Demo"),
      ),
      body: Center(
        child: SizedBox(
          height: 240,
          child: PageView.builder(
            itemCount: _movies.length,
            controller: PageController(
                viewportFraction: 0.8,
            ),
            onPageChanged: (index) {
              setState(() {
                _selectedIndex = index;
              });
            },
            itemBuilder: (context, index) {
              final movieUrl = _movies[index];

              final _isSelectedIndex = _selectedIndex == index;
              final _scale = _isSelectedIndex ? 1.0 : 0.85;

              return TweenAnimationBuilder<double>(
                duration: Duration(milliseconds: 270),
                tween: Tween(
                  begin: _scale,
                  end:  _scale
                ),
                child: GestureDetector(
                  onTap: () {
                    Navigator.push(context,
                    MaterialPageRoute(
                      builder: (_) => MovieDetails(movieUrl)
                    ));
                  },
                    child: PageItem(movieUrl: movieUrl)),
                builder: (context, scale, child) {
                  return Transform.scale(
                    scale: scale,
                    child: child,
                  );
                },
              );
            },
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.cloud_upload),
        onPressed: () {},
    ),
    );
  }
}

class PageItem extends StatelessWidget {
  PageItem({@required this.movieUrl});

  final String movieUrl;

  @override
  Widget build(BuildContext context) {
    return Hero(
      tag: movieUrl,
      child: Container(
        decoration: BoxDecoration(
          color: Colors.blueGrey,
          borderRadius: BorderRadius.circular(16),
          image: DecorationImage(
            fit: BoxFit.cover,
            image: NetworkImage(movieUrl),
          ),
        ),
      ),
    );
  }
}

class MovieDetails extends StatelessWidget {
  MovieDetails(this.movieUrl) : assert(movieUrl != null);

  final String movieUrl;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: <Widget>[
          Hero(
            tag: movieUrl,
            child: Container(
              height: 250,
              decoration: BoxDecoration(
                color: Colors.blueGrey,
                image: DecorationImage(
                  fit: BoxFit.cover,
                  image: NetworkImage(movieUrl),
                ),
              ),
            ),
          )
        ],
      ),
    );
  }
}