get 1.10.5

  • Readme
  • Changelog
  • Example
  • Installing
  • 95

Get #

A consistent navigation library that lets you navigate between screens, open dialogs/bottomSheets, and display snackbars from anywhere in your code without context.

Getting Started #

Flutter's conventional navigation has a lot of unnecessary boilerplate, requires context to navigate between screens, open dialogs, and use snackbars on framework is really painful. In addition, with each route navigation, all of your screens below MaterialApp are rebuilt, often causing RAM and CPU bottlenecks. I worked on a pull to fix it in the framework, and seeing how things work I realized that a lot of cliche code could be avoided to get clean and concise code. With that in mind, I created this library that will change the way you work with the Framework and save your life from cliche code, increasing your productivity, and eliminating all the bugs present in Flutter's default navigation altogether.

If you use MODULAR, you can to use GET MODULAR or add on your MaterialApp this: navigatorKey: Get.addKey(Modular.navigatorKey)

How to use? #

Add this to your package's pubspec.yaml file:

dependencies:
  get: ^1.10.5

And import it:

import 'package:get/get.dart';

Add GetKey to your MaterialApp and enjoy:

MaterialApp(
    navigatorKey: Get.key,
    home: MyHome(),
  )

To navigate to a new screen:

Get.to(NextScreen());

To return to previous screen

Get.back();

To go to the next screen and no option to go back to the previous screen (for use in SplashScreens, login screens and etc.)

Get.off(NextScreen());

To go to the next screen and cancel all previous routes (useful in shopping carts, polls, and tests)

Get.offAll(NextScreen());

To navigate to the next route, and receive or update data as soon as you return from it:

var data = await Get.to(Payment());

on other screen, send a data for previous route:

Get.back(result: 'sucess');

And use it:

ex:

if(data == 'sucess') madeAnything();

SnackBars #

To show a modern snackbar:

Get.snackbar('Hi', 'i am a modern snackbar');

To have a simple SnackBar with Flutter, you must get the context of Scaffold, or you must use a GlobalKey attached to your Scaffold, but with Get, all you have to do is call your Get.snackbar from anywhere in your code or customize it however you want!

  Get.snackbar(
               "Hey i'm a Get SnackBar!", // title
               "It's unbelievable! I'm using SnackBar without context, without boilerplate, without Scaffold, it is something truly amazing!", // message
              icon: Icon(Icons.alarm), 
              shouldIconPulse: true,
              onTap:(){},
              barBlur: 20,
              isDismissible: true,
              duration: Duration(seconds: 3),
            );

  ////////// ALL FEATURES //////////
  //     Color colorText,
  //     Duration duration,
  //     SnackPosition snackPosition,
  //     Widget titleText,
  //     Widget messageText,
  //     Widget icon,
  //     bool shouldIconPulse,
  //     double maxWidth,
  //     EdgeInsets margin,
  //     EdgeInsets padding,
  //     double borderRadius,
  //     Color borderColor,
  //     double borderWidth,
  //     Color backgroundColor,
  //     Color leftBarIndicatorColor,
  //     List<BoxShadow> boxShadows,
  //     Gradient backgroundGradient,
  //     FlatButton mainButton,
  //     OnTap onTap,
  //     bool isDismissible,
  //     bool showProgressIndicator,
  //     AnimationController progressIndicatorController,
  //     Color progressIndicatorBackgroundColor,
  //     Animation<Color> progressIndicatorValueColor,
  //     SnackStyle snackStyle,
  //     Curve forwardAnimationCurve,
  //     Curve reverseAnimationCurve,
  //     Duration animationDuration,
  //     double barBlur,
  //     double overlayBlur,
  //     Color overlayColor,
  //     Form userInputForm
  ///////////////////////////////////

Dialogs #

To open dialog:

Get.dialog(YourDialogWidget());

To open default dialog:

 Get.defaultDialog(
                title: "My Title",
                content: Text("Hi, it's my dialog"),
                confirm: FlatButton(
                  child: Text("Ok"),
                  onPressed: () => print("OK pressed"),
                ),
                cancel: FlatButton(
                  child: Text("Cancel"),
                  onPressed: () => Get.back(),
                ));

BottomSheets #

Get.bottomSheet is like showModalBottomSheet, but don't need of context.

Get.bottomSheet(
      builder: (_){
          return Container(
            child: Wrap(
            children: <Widget>[
            ListTile(
            leading: Icon(Icons.music_note),
            title: Text('Music'),
            onTap: () => {}          
          ),
            ListTile(
            leading: Icon(Icons.videocam),
            title: Text('Video'),
            onTap: () => {},          
          ),
            ],
          ),
       );
      }
    );

That's it, you've learned how to navigate between routes the default way. #

However, for people who like more organized code who want to navigate with named routes, or for Flutter_web Developers who want the url to show exactly which route is being shown, and want the page refresh not to affect the state of the routes. On your site, we give you a much more elegant and functional solution. Yeah, the default navigation doesn't fully support Flutter_web, but Get does !!!!

So... Is possible used default namedRoutes from flutter? #

  • Yes, and with no navigation bug, add "named" to Get. HOWEVER, TO MAKE THIS TYPE OF NAVIGATION, USE THE ROUTE MODEL FROM REPOSITORY. Example of navigation with named routes:

To navigate to nextScreen

Get.toNamed("/NextScreen");

To navigate and remove the previous screen from the tree.

Get.offNamed("/NextScreen");

To navigate and remove all previous screens from the tree.

Get.offAllNamed("/NextScreen");

Using with Named Routes and And offering full flutter_web support (REQUIRED FOR NAMED ROUTES): #

Add " navigatorKey: Get.key," to MaterialApp #

void main() {
  runApp(MaterialApp(
    onGenerateRoute: Router.generateRoute,
    initialRoute: "/",
    navigatorKey: Get.key,
    title: 'Navigation',
  ));
}

Middleware

If you want listen Get events to trigger actions, you can add a GetObserver to your materialApp. This is extremely useful for triggering events whenever a specific Screen is displayed on the screen. Currently on Flutter you would have to put the event on initState and wait for a possible response in a navigator.pop (context); to get that. But with Get, this is extremely simple!

add GetObserver();
void main() {
  runApp(MaterialApp(
    onGenerateRoute: Router.generateRoute,
    initialRoute: "/",
    navigatorKey: Get.key,
    navigatorObservers: [
        GetObserver(MiddleWare.observer), // HERE !!!
    ],
  ));
}

Create a MiddleWare class

class MiddleWare {
  static observer(Routing routing) {
    /// You can listen in addition to the routes, the snackbars, dialogs and bottomsheets on each screen. 
    ///If you need to enter any of these 3 events directly here, 
    ///you must specify that the event is != Than you are trying to do.
    if (routing.current == '/second' && !routing.isSnackbar) {
      Get.snackbar("Hi", "You are on second route");
    } else if (routing.current =='/third'){
      print('last route called');
    }
  }
}

COPY THE ROUTER CLASS BELOW: #

Copy this Router class below and put it in your app, rename routes and classes for your own, add more classes to it if necessary.

Important!!!

GetRoute has great performance optimizations that MaterialPageRoute and CupertinoPageRoute do not. It solves the main problems with memory leaks and unexpected reconstructions of the Flutter, so please do not insert MaterialPageRoute or CupertinoPageRoute here, or you will lose one of the main benefits of this lib, in addition to experiencing inconsistencies in the transitions. We recommend always using GetRoute, and if you need custom transitions, use PageRouteBuilder by adding the parameter 'opaque = false' to maintain compatibility with the library.

class Router {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case '/':
        return GetRoute(
          page: First(),
          settings: settings,
        );
      case '/second':
        return GetRoute(
            settings: settings, page: Second(), transition: Transition.fade);
      case '/third':
        return GetRoute(
            settings: settings,
            page: Third(),
            transition: Transition.rightToLeft);
      default:
        return GetRoute(
            settings: settings,
            transition: Transition.fade,
            page: Scaffold(
              body:
                  Center(child: Text('No route defined for ${settings.name}')),
            ));
    }
  }
}

And now, all you need to do is use Get.toNamed() to navigate your named routes, without any context (BLoC will love it), and when your app is compiled to the web, your routes will appear in the url beautifully <3

class First extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(Icons.add),
          onPressed: () {
            Get.snackbar("hi", "i am a modern snackbar");
          },
        ),
        title: Text('First Route'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('Open route'),
          onPressed: () {
            Get.toNamed("/second");
          },
        ),
      ),
    );
  }
}

class Second extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(Icons.add),
          onPressed: () {
            Get.snackbar("hi", "i am a modern snackbar");
          },
        ),
        title: Text('second Route'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('Open route'),
          onPressed: () {
            Get.toNamed("/third");
          },
        ),
      ),
    );
  }
}

class Third extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Third Route"),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            Get.back();
          },
          child: Text('Go back!'),
        ),
      ),
    );
  }
}

Others methods (docs will be added soon): #

Get.removeRoute() // remove one route.

Get.until() // back repeatedly until the predicate returns true.

Get.offUntil() // go to next route and remove all the previous routes until the predicate returns true.

Get.offNamedUntil() // go to next named route and remove all the previous routes until the predicate returns true.

That is all.

[1.0.0] #

  • initial release

[1.0.1] #

  • Doc changes

[1.0.2] #

  • Add examples

[1.0.3] #

  • Improve Performance

[1.1.0] #

  • Add support to named routes

[1.2.0] #

  • Add routes navigation with no context

[1.2.1] #

  • Fix bug currentState = null

[1.3.0] #

  • Update docs, readme, and add full support to flutter_web

[1.3.1] #

  • Update docs

[1.3.2] #

  • Improve performance

[1.3.3] #

  • Fix Get.back arguments

[1.3.4] #

  • Improve performance

[1.4.0] #

  • Added Get.removeRoute // ability to remove one route. Get.until // back repeatedly until the predicate returns true. Get.offUntil // go to next route and remove all the previous routes until the predicate returns true. Get.offNamedUntil // go to next named route and remove all the previous routes until the predicate returns true.

[1.4.0+6] #

  • Improve performance and bug fix

[1.4.0+7] #

  • Add more documentation

[1.5.0] #

  • Add support to dialogs

[1.5.0+1] #

  • Add color and opacity to dialogs

[1.6.0] #

  • Add support to snackbars

[1.6.1] #

  • Add docs and improve performance

[1.6.2] #

  • Fix bugs on blurred Snackbars

[1.6.3] #

  • Clean code.

[1.6.4] #

  • Improve performance.

[1.7.0] #

  • Improve geral performance. Get.to Wrap now consumes even less RAM and CPU. In an application with 20 screens, it obtained 82% less RAM usage compared to the traditional method Navigator.push and had a CPU normalization of 23% in a Moto z2, against 64% CPU usage in Navigator.push with MaterialPageRoute. Test it for yourself!
  • Added BottomSheet with no context
  • Added modern Blur Snackbar
  • Added customs transitions
  • Improve dialogs performance

[1.7.1] #

-Fix docs

[1.7.2] #

-Fix bottomsheet on macos

[1.7.3] #

-Added transitions docs

[1.7.4] #

-Fix dialog child error

[1.8.0] #

-Add Get.close method. -Add many Snackbars features

[1.8.1] #

-Fix new snackbar features

[1.9.0] #

-Added: Navigator observer -Added: Get.args to named routes -Improve snackbar performance

[1.9.1] #

-Fix typo on snackbar route

[1.9.2] #

-Added docs to GetObserver

[1.10.0] #

-Added backdrop

[1.10.1] #

-Backdrop improvement

[1.10.2] #

-Improve snackbar text color

[1.10.3] #

-Improve default color from dialogs

[1.10.4] #

-Improve Get.offAll() - predicate now is optional

[1.10.5] #

-Added setKey to improve modular compatibility -Added ability to define transition duration directly when calling the new route.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorKey: Get.key,
      initialRoute: "/",
      navigatorObservers: [
        GetObserver(MiddleWare.observer),
      ],
      onGenerateRoute: Router.generateRoute,
    );
  }
}

class MiddleWare {
  static observer(Routing routing) {
    ///Trigger any event when a route is pushed or popped by Get. 
    /// You can listen in addition to the routes, the snackbars, dialogs and bottomsheets on each screen. 
    ///If you need to enter any of these 3 events directly here, 
    ///you must specify that the event is != Than you are trying to do.
    if (routing.current == '/second' && !routing.isSnackbar) {
      Get.snackbar("Hi", "You are on second route");
    } else if (routing.current =='/third'){
      print('last route called');
    }
  }
}

class First extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(Icons.add),
          onPressed: () {
            Get.snackbar("hi", "i am a modern snackbar");
          },
        ),
        title: Text('First Route'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('Open route'),
          onPressed: () {
            Get.toNamed("/second");
          },
        ),
      ),
    );
  }
}

class Second extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(Icons.add),
          onPressed: () {
            Get.snackbar("hi", "i am a modern snackbar");
          },
        ),
        title: Text('second Route'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('Open route'),
          onPressed: () {
            Get.toNamed("/third");
          },
        ),
      ),
    );
  }
}

class Third extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Third Route"),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            Get.back();
          },
          child: Text('Go back!'),
        ),
      ),
    );
  }
}

class Router {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case '/':
        return GetRoute(
          page: First(),
          settings: settings,
        );
      case '/second':
        return GetRoute(
            settings: settings, page: Second(), transition: Transition.fade);
      case '/third':
        return GetRoute(
            settings: settings,
            page: Third(),
            transition: Transition.rightToLeft);
      default:
        return GetRoute(
            settings: settings,
            transition: Transition.fade,
            page: Scaffold(
              body:
                  Center(child: Text('No route defined for ${settings.name}')),
            ));
    }
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  get: ^1.10.5

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:get/get.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
91
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
95
Learn more about scoring.

We analyzed this package on Feb 29, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.5
  • Flutter: 1.12.13+hotfix.8

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.8
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test