PageView can be used to show a scrollable list that works page by page. Each child of a page view is forced to be the same size as the viewport.
Table of Contents
Basics
Display a list of 3 pages with scroll direction as Axis.horizontal
.

import 'package:flutter/material.dart'; class PageViewPage extends StatefulWidget { @override _PageViewPageState createState() => _PageViewPageState(); } class _PageViewPageState extends State<PageViewPage> { final PageController _controller = PageController(initialPage: 0); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('PageView'),), body: SafeArea( child: PageView( controller: _controller, children: [ Container( color: Colors.red, child: Center( child: Text( 'Page 1', style: TextStyle(fontSize: 18.0), )), ), Container( color: Colors.green, child: Center( child: Text( 'Page 2', style: TextStyle(fontSize: 18.0), )), ), Container( color: Colors.blue, child: Center( child: Text( 'Page 3', style: TextStyle(fontSize: 18.0), )), ) ], ), ), ); } }
PageView.builder and custom animation
We use PageView.builder constructor to build children wrapped in their respective animation widget for custom page transition.

The _currentPage variable is a double value. It indicates the progress of switching pages.
import 'package:flutter/material.dart'; class PageViewPage extends StatefulWidget { @override _PageViewPageState createState() => _PageViewPageState(); } class _PageViewPageState extends State<PageViewPage> { List<Widget> _pages = []; final PageController _controller = PageController(initialPage: 0); double? _currentPage = 0; @override void initState() { _pages = [ Container( color: Colors.red, child: Center( child: Text( 'Page 1', style: TextStyle(fontSize: 18.0, color: Colors.white), )), ), Container( color: Colors.green, child: Center( child: Text( 'Page 2', style: TextStyle(fontSize: 18.0, color: Colors.white), )), ), Container( color: Colors.blue, child: Center( child: Text( 'Page 3', style: TextStyle(fontSize: 18.0, color: Colors.white), )), ) ]; //add _controller.addListener(() { setState(() { _currentPage = _controller.page; }); }); super.initState(); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('PageView')), body: SafeArea( child: PageView.builder( itemBuilder: (context, index) { return Transform( transform: Matrix4.identity()..rotateZ(_currentPage! - index), child: _pages[index], ); }, scrollDirection: Axis.horizontal, controller: _controller, itemCount: _pages.length, ), ), ); } }
thanks for the good content dude !!!