Site icon Flutter Packages | Pub dev Packages – Flutter Mobile App World

A dank way to navigate

yeet 


A dank way to navigate.

How to yeet?

  1. Install latest version of yeet:
dependencies:
  flutter:
    sdk: flutter
  yeet: ^0.4.7
  1. Define your yeets:
final yeet = Yeet(
  children: [
    Yeet(
      path: '/',
      builder: (_) => HomeView(),
    ),
    Yeet(
      path: r'/user/:id(\d+)',
      builder: (ctx) => UserView(int.parse(ctx.params['id']!)),
      children: [
        Yeet(
          path: 'posts',
          builder: (ctx) => PostsView(int.parse(ctx.params['id']!)),
        )
      ],
    ),
    Yeet(
      path: ':_(.*)',
      builder: (_) => NotFoundView(),
    ),
  ],
);
  1. Turn your MaterialApp into MaterialApp.router and add the following arguments.
return MaterialApp.router(
  routeInformationParser: YeetInformationParser(),
  routerDelegate: YeeterDelegate(yeet: yeet),
);
  1. Set new paths.
context.yeet('/your/new/path');
context.yeet('can/be/relative');
  1. And pop.
context.yeet();
  1. Enjoy!
  2. Missing a feature? Have a suggestion? Found a bug? Open an issue. Thanks!

Migrating from 0.3.2 to 0.4.0

  1. Parameters of builder have changed from (params, queryParams) to just a single (context):

Before:

Yeet(
  path: '/user/:id'
  builder: (params, queryParams) => UserPage(id: params[id]!, edit: queryParams['edit'] ?? false)
)

After:

Yeet(
  path: '/user/:id'
  builder: (context) => UserPage(id: context.params[id]!, edit: context.queryParams['edit'] ?? false)
)

Now the page doesn’t have to use the path or query parameters right away, and can always access it using the BuildContext withing the build function.

  1. Yeet.custom has been removed. Instead you can use the transition parameter to configure the page transition. Transition is YeetTransition.adaptive() by default, which means that in iOS and macOS it’s using YeetTransition.cupertino() and in other platforms YeetTransition.material().

Before:

Yeet.custom(
  path: '/',
  transitionsBuilder: ...,
  opaque: ...,
  //...
)

After:

Yeet(
  path: '/',
  transiton: YeetTransition.custom(
    transitionsBuilder: ...,
    opaque: ...,
    //...
  ),
)

Download navigate package source code on GitHub

https://github.com/HosseinYousefi/yeet
Exit mobile version
Skip to toolbar