qlevar_router
qlevar_router copied to clipboard
[Proposal] May we implement a TabPage or PageView with Qlevar?
Hello guys, I was wondering If it would be possible to get children's route act like TABS into a TabPage?
Example of the use case - MobileRoutes has three tabs
Route:
mobile_routes.dart
class MobileRoutes {
static const String mobile = 'mobileRoute';
static const List<Tab> tabs = <Tab>[
Tab(text: 'Mobile stores'),
Tab(text: 'Mobile products'),
Tab(text: 'Mobile settings'),
];
final route = QRoute.withChild(
path: '/mobile',
name: mobile,
initRoute: '/stores',
builderChild: (router) => MobileView(router),
children: [
QRoute(
path: '/stores',
pageType: QFadePage(),
builder: () => MobileStoresView(),
),
QRoute(
path: '/products',
pageType: QFadePage(),
builder: () => MobileProductsView(),
),
QRoute(
path: '/settings',
pageType: QFadePage(),
builder: () => MobileSettingsView(),
),
]);
}
Widget:
mobile_view.dart
class _MobileViewState extends State<MobileView> {
late TabController _tabController;
@override
void initState() {
super.initState();
_tabController =
TabController(length: MobileRoutes.tabs.length, vsync: this);
}
@override
void dispose() {
_tabController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
bottom: TabBar(
controller: _tabController,
tabs: MobileRoutes.tabs,
),
),
body: TabBarView(controller: _tabController, children: [
MobileStoresView(),
MobileSettingsView(),
]),
);
}
And thank you so much guys, having a nice day!
@SchabanBo We are also looking for this feature to be integrated, as I see you already added it to your ToDo list. I am eagerly waiting for it to get release as it will help our project.
Again thanks for the package.
Hi @abdojay @manish1238, I write an example on how to use TabView with qlevar_router. Can you please check it out and see if this what you wanted? I will close this issue after your feedbacks. Thanks