Navigation with Fluro (Flutter web)

2,053

I still don't know why, but the issue was that all my pages started with MaterialApp, and the solution was to use Material.

Share:
2,053
Jonathan Gómez
Author by

Jonathan Gómez

Here to create big things!

Updated on December 26, 2022

Comments

  • Jonathan Gómez
    Jonathan Gómez over 1 year

    I'm trying to have navigation into pages. Trying to create some routes.

    The problem I have is:

    1. When the route changes it disappears from the URL
    2. When I try to go back or forward in the browser it doesn't do anything.

    I'm trying to use the Fluro package. I'm also trying to compare their example with mine and I don't find what is the difference. main.dart:

    void main() {
      runApp(AppComponent());
    }
    
    class AppComponent extends StatefulWidget {
      @override
      State createState() {
        return _AppComponentState();
      }
    }
    
    class _AppComponentState extends State<AppComponent> {
      _AppComponentState() {
        final router = FluroRouter();
        Routes.configureRoutes(router);
        Application.router = router;
      }
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'NexTeam',
          debugShowCheckedModeBanner: false,
          initialRoute: kHomeRoute,
          onGenerateRoute: Application.router.generator,
        );
      }
    }
    
    class Application {
      static FluroRouter router;
    }
    

    router.dart:

    class Routes {
      final router = FluroRouter();
    
      static Handler _loginHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => LoginPage());
      static Handler _registerHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => RegisterPage());
      static Handler _homeHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => HomePage());
      static Handler _profileHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => ProfilePage());
      static Handler _notificationsHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => NotificationsPage());
      static Handler _chatHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => ChatPage());
    
      static void configureRoutes(FluroRouter router) {
        router.define(kLoginRoute, handler: _loginHandler);
        router.define(kRegisterRoute, handler: _registerHandler);
        router.define(kHomeRoute, handler: _homeHandler);
        router.define(kProfileRoute, handler: _profileHandler);
        router.define(kNotificationsRoute, handler: _notificationsHandler);
        router.define(kChatRoute, handler: _chatHandler);
      }
    }
    

    function to navigate:

    Application.router.navigateTo(context, kNotificationsRoute);

    • Timur Turbil
      Timur Turbil over 3 years
      I didn't understand as well what you want, if you want to navigate from your app to web page, you should use url_launcher package
    • Jonathan Gómez
      Jonathan Gómez over 3 years
      @Timurturbil I don't want to go to another website. I want to navigate through my website.