滑屏翻页,我们可以用到PageView这个组件
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
theme: ThemeData.light(),
home: new DefaultTabController(
length: 4,
child: Scaffold(
body: PageView(
// pageSnapping: false, // 是否允许停止自动翻页
scrollDirection: Axis.vertical, //变成垂直滚动
onPageChanged: (currentPage) => debugPrint('$currentPage'), // 换页事件
controller: PageController(
initialPage: 1, // 初始页面是在第几个
viewportFraction: 0.85, // 占用可视口的85%
),
children: <Widget>[
Container(
color: Colors.brown[900],
alignment: Alignment(0.0, 0.0),
child: Text('ONE',
style: TextStyle(fontSize: 32.0, color: Colors.white)),
),
Container(
color: Colors.yellow[900],
alignment: Alignment(0.0, 0.0),
child: Text('Two',
style: TextStyle(fontSize: 32.0, color: Colors.white)),
),
Container(
color: Colors.green[900],
alignment: Alignment(0.0, 0.0),
child: Text('Three',
style: TextStyle(fontSize: 32.0, color: Colors.white)),
)
],
),
),
),
);
}
}
网友评论