flutter_split_layout 0.0.3 copy "flutter_split_layout: ^0.0.3" to clipboard
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 :)

0
likes
140
pub points
10%
popularity

Publisher

unverified uploader

This is Flutter Split Layout package.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_split_layout