flutter_quick_router 0.0.1 copy "flutter_quick_router: ^0.0.1" to clipboard
flutter_quick_router: ^0.0.1 copied to clipboard

The QuickRouter provides handy methods for navigating between routes using the Navigator widget in Flutter. It supports both regular and restorable routes and offers various transition types.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_quick_router/quick_router.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'QUICK ROUTER',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const HomeScreen(),
    );
  }
}

// A widget that defines the main screen of the app
class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Home Screen')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // A button that navigates to the second screen using the to() method
            ElevatedButton(
              onPressed: () {
                context.to(const SecondScreen());
              },
              child: const Text('Go to second screen'),
            ),
            // A button that navigates to the third screen using the pushReplacement() method
            ElevatedButton(
              onPressed: () {
                context.pushReplacement(const ThirdScreen(),
                    result: 'Hello from home');
              },
              child: const Text('Replace with third screen'),
            ),
            // A button that navigates to the fourth screen using the pushAndRemoveUntil() method
            ElevatedButton(
              onPressed: () {
                context.pushAndRemoveUntil(
                  const FourthScreen(),
                  (route) => route.isFirst,
                );
              },
              child:
                  const Text('Remove all except first and go to fourth screen'),
            ),
            // A button that navigates to the fifth screen using the restorablePushAndRemoveUntil() method
            ElevatedButton(
              onPressed: () {
                context.restorablePushAndRemoveUntil(
                  (context, arguments) => MaterialPageRoute(
                    builder: (context) => const FifthScreen(),
                    settings: const RouteSettings(name: '/fifth'),
                  ),
                  (route) => false,
                  arguments: 'Some arguments',
                );
              },
              child: const Text(
                  'Remove all and go to fifth screen with restoration'),
            ),
          ],
        ),
      ),
    );
  }
}

// A widget that defines the second screen of the app
class SecondScreen extends StatelessWidget {
  const SecondScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Second Screen')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // A button that returns to the previous screen using the back() method
            ElevatedButton(
              onPressed: () {
                context.back('Hello from second');
              },
              child: const Text('Go back with result'),
            ),
            // A button that replaces the current screen with the third screen using the replace() method
            ElevatedButton(
              onPressed: () {
                context.replace(
                  old: this,
                  to: const ThirdScreen(),
                );
              },
              child: const Text('Replace with third screen'),
            ),
            // A button that replaces the route below the current one with the fourth screen using the replaceRouteBelow() method
            ElevatedButton(
              onPressed: () {
                context.replaceRouteBelow(
                  anchor: this,
                  to: const FourthScreen(),
                );
              },
              child: const Text('Replace route below with fourth screen'),
            ),
            // A button that replaces the current screen with the fifth screen using the restorableReplace() method
            ElevatedButton(
              onPressed: () {
                context.restorableReplace(
                  old: this,
                  to: (context, arguments) => MaterialPageRoute(
                    builder: (context) => const FifthScreen(),
                    settings: const RouteSettings(name: '/fifth'),
                  ),
                  arguments: 'Some arguments',
                );
              },
              child: const Text('Replace with fifth screen with restoration'),
            ),
          ],
        ),
      ),
    );
  }
}

// A widget that defines the third screen of the app
class ThirdScreen extends StatelessWidget {
  const ThirdScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Third Screen')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // A button that returns to the previous screen using the back() method
            ElevatedButton(
              onPressed: () {
                context.to(const HomeScreen(),
                    transitions: QuickTransition.Size);
              },
              child: const Text('Go back with result'),
            ),
          ],
        ),
      ),
    );
  }
}

// A widget that defines the fourth screen of the app
class FourthScreen extends StatelessWidget {
  const FourthScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Fourth Screen')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // A button that returns to the previous screen using the back() method
            ElevatedButton(
              onPressed: () {
                context.back('Hello from fourth');
              },
              child: const Text('Go back with result'),
            ),
          ],
        ),
      ),
    );
  }
}

// A widget that defines the fifth screen of the app
class FifthScreen extends StatelessWidget {
  const FifthScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Fifth Screen')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // A button that returns to the previous screen using the back() method
            ElevatedButton(
              onPressed: () {
                context.back('Hello from fifth');
              },
              child: const Text('Go back with result'),
            ),
          ],
        ),
      ),
    );
  }
}
8
likes
0
points
21
downloads

Publisher

unverified uploader

Weekly Downloads

The QuickRouter provides handy methods for navigating between routes using the Navigator widget in Flutter. It supports both regular and restorable routes and offers various transition types.

Repository (GitHub)
View/report issues

Documentation

Documentation

License

unknown (license)

Dependencies

flutter

More

Packages that depend on flutter_quick_router