flutter_split_layout 0.0.3 flutter_split_layout: ^0.0.3 copied to clipboard
This is Flutter Split Layout package.
flutter_split_layout #
This plugin is Flutter Split Layout
plugin.
This plugin was created in Flutter, referring to the iOS Split Style.
Note: that it is not the same as iOS Split Style!
Usage #
FlutterSplitController
is a Singleton object.
Please refer to the example
folder for more details.
How to initialize #
main.dart
late FlutterSplitController splitController;
@override
void initState() {
super.initState();
splitController = FlutterSplitController();
switch (getDeviceType()) {
case DeviceType.phone:
splitController.primaryNavigatorKey = null;
splitController.secondaryNavigatorKey = null;
break;
case DeviceType.tablet:
splitController.primaryNavigatorKey = GlobalKey<NavigatorState>();
splitController.secondaryNavigatorKey = GlobalKey<NavigatorState>();
break;
}
}
@override
Widget build(BuildContext context) {
switch (getDeviceType()) {
case DeviceType.phone:
...
case DeviceType.tablet:
return FlutterSplitMaterialApp(
controller: splitController,
primaryApp: MaterialApp(
title: title,
theme: themeData,
home: const MyPrimaryPage(),
),
secondaryApp: MaterialApp(
title: title,
theme: themeData,
home: const MySecondaryPage(),
),
);
}
How to navigate to a new screen only on secondary. #
If secondaryContext
is Null, Navigator push is performed using the context of the relevant screen.
This is for use with both phone
and tablet
.
In the example, the my_primary_page.dart
file is used simultaneously on phone and tablet.
The code below is for Navigator push with one code.
my_primary_page.dart
final controller = FlutterSplitController();
Navigator.push(
controller.secondaryContext ?? context,
MaterialPageRoute(
builder: (context) => const MySecondaryDetailPage(),
),
);
Contributors #
Thank you for your interest in the source and for your help :)