Last active
August 9, 2022 16:03
-
-
Save tranductam2802/a9c9236a642f8249cd5f56584196ab47 to your computer and use it in GitHub Desktop.
The basic code snippet which demo a infinite page view
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
void main() => runApp(MyApp()); | |
class MyApp extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
title: 'Flutter Tutorial by Tran Duc Tam', | |
home: MyPage(), | |
); | |
} | |
} | |
class MyPage extends StatefulWidget { | |
@override | |
MyPageState createState() => MyPageState(); | |
} | |
class MyPageState extends State<MyPage> { | |
late PageController pageController; | |
@override | |
void initState() { | |
super.initState(); | |
pageController = PageController( | |
viewportFraction: 0.8, | |
initialPage: 10, | |
); | |
} | |
@override | |
Widget build(BuildContext context) { | |
List<Widget> items = [ | |
Container( | |
color: Colors.red, | |
child: const ListTile( | |
leading: Icon(Icons.local_activity, size: 50), | |
title: Text('Activity 0'), | |
subtitle: Text('Description here'), | |
), | |
), | |
Container( | |
color: Colors.yellow, | |
child: const ListTile( | |
leading: Icon(Icons.local_activity, size: 50), | |
title: Text('Activity 1'), | |
subtitle: Text('Description here'), | |
), | |
), | |
Container( | |
color: Colors.green, | |
child: const ListTile( | |
leading: Icon(Icons.local_activity, size: 50), | |
title: Text('Activity 2'), | |
subtitle: Text('Description here'), | |
), | |
), | |
Container( | |
color: Colors.pink, | |
child: const ListTile( | |
leading: Icon(Icons.local_activity, size: 50), | |
title: Text('Activity 3'), | |
subtitle: Text('Description here'), | |
), | |
), | |
Container( | |
color: Colors.blue, | |
child: const ListTile( | |
leading: Icon(Icons.local_activity, size: 50), | |
title: Text('Activity 4'), | |
subtitle: Text('Description here'), | |
), | |
), | |
]; | |
return Scaffold( | |
appBar: AppBar( | |
title: const Text('Flutter Tutorial by Tran Duc Tam'), | |
), | |
body: PageView.builder( | |
itemCount: null, | |
reverse: false, | |
pageSnapping: true, | |
controller: pageController, | |
onPageChanged: (index) { | |
print('Index changed: $index'); | |
if (index == 5) { | |
pageController.jumpToPage(10); | |
} | |
}, | |
scrollDirection: Axis.horizontal, | |
itemBuilder: (BuildContext context, int index) { | |
print('Index: $index'); | |
final int idx = index % items.length; | |
return AnimatedBuilder( | |
animation: pageController, | |
child: items[idx], | |
builder: (BuildContext context, child) { | |
return Container(child: child); | |
}, | |
); | |
}, | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment