Last active
August 29, 2022 07:56
-
-
Save Abhilash-Chandran/abe26388e1f3a2ea0660fbd6089c6da5 to your computer and use it in GitHub Desktop.
Tab View inside PageView.
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/gestures.dart'; | |
import 'package:flutter/material.dart'; | |
void main() => runApp(MyApp()); | |
class MyApp extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) => MaterialApp( | |
title: 'TabBarView inside PageView', | |
home: MyHomePage(), | |
); | |
} | |
class MyHomePage extends StatefulWidget { | |
MyHomePage({Key key}) : super(key: key); | |
@override | |
_MyHomePageState createState() => _MyHomePageState(); | |
} | |
final PageController _pageController = PageController(); | |
PageView myPageView = PageView( | |
controller: _pageController, | |
allowImplicitScrolling: true, | |
children: <Widget>[ | |
Container(color: Colors.red), | |
GreenShades(), | |
Container(color: Colors.yellow), | |
], | |
); | |
class _MyHomePageState extends State<MyHomePage> { | |
@override | |
Widget build(BuildContext context) => Scaffold( | |
appBar: AppBar( | |
title: Text('TabBarView inside PageView'), | |
), | |
body: myPageView, | |
); | |
} | |
class GreenShades extends StatefulWidget { | |
@override | |
_GreenShadesState createState() => _GreenShadesState(); | |
} | |
class _GreenShadesState extends State<GreenShades> | |
with SingleTickerProviderStateMixin { | |
TabController _tabController; | |
@override | |
void initState() { | |
super.initState(); | |
this._tabController = TabController(length: 3, vsync: this); | |
} | |
@override | |
Widget build(BuildContext context) { | |
// Local dragStartDetail. | |
DragStartDetails dragStartDetails; | |
// Current drag instance - should be instantiated on overscroll and updated alongside. | |
Drag drag; | |
return Column( | |
children: <Widget>[ | |
TabBar( | |
labelColor: Colors.green, | |
indicatorColor: Colors.green, | |
controller: _tabController, | |
tabs: <Tab>[ | |
const Tab(text: "Dark"), | |
const Tab(text: "Normal"), | |
const Tab(text: "Light"), | |
], | |
), | |
Expanded( | |
child: NotificationListener( | |
onNotification: (notification) { | |
if (notification is ScrollStartNotification) { | |
dragStartDetails = notification.dragDetails; | |
} | |
if (notification is OverscrollNotification) { | |
drag = _pageController.position.drag(dragStartDetails, () {}); | |
drag.update(notification.dragDetails); | |
} | |
if (notification is ScrollEndNotification) { | |
drag?.cancel(); | |
} | |
return true; | |
}, | |
child: TabBarView( | |
controller: _tabController, | |
children: <Widget>[ | |
Container(color: Colors.green[800]), | |
Container(color: Colors.green), | |
Container(color: Colors.green[200]), | |
], | |
), | |
), | |
), | |
], | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment