kadir yapar
kadir yapar

Reputation: 67

Flutter dynamic web link on routing

I have an application and this application opens different business details for the same page according to the businessId. I want to create different web links for this page.

The link will be like this: www.domainname.com/businessId/businessName

The normal routing and pushNamed is working but dynamic routing is not working for the Flutter web.

This is my main.dart page;

import 'package:book_me_place/l10n/l10n.dart';
import 'package:book_me_place/providers/business_provider.dart';
import 'package:book_me_place/providers/user_provider.dart';
import 'package:book_me_place/screens/admin_panel/admin_panel_page.dart';
import 'package:book_me_place/screens/login_pages/auth.dart';
import 'package:book_me_place/screens/login_pages/sign_in_screen.dart';
import 'package:book_me_place/screens/login_pages/sign_up_screen.dart';
import 'package:book_me_place/screens/main_page/business_details_tab_bar_page.dart';
import 'package:book_me_place/screens/main_page/business_listing_page.dart';
import 'package:book_me_place/screens/main_page/category_business_listing_page.dart';
import 'package:book_me_place/screens/main_page/main_page.dart';
import 'package:book_me_place/screens/messages/messages_page.dart';
import 'package:book_me_place/screens/profile/contact_us.dart';
import 'package:book_me_place/screens/profile/edit_profile_page.dart';
import 'package:book_me_place/screens/profile/privacy_policy.dart';
import 'package:book_me_place/screens/profile/profile_page.dart';
import 'package:book_me_place/screens/customer_reservations/reservations_page.dart';
import 'package:book_me_place/screens/profile/terms_and_conditions.dart';
//import 'package:firebase_app_check/firebase_app_check.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'package:firebase_messaging/firebase_messaging.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:provider/provider.dart';
import 'firebase_options.dart';
import 'package:upgrader/upgrader.dart';

Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
  await Firebase.initializeApp();
}

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  await Auth().getOrCreateUserWithFirebase();

  final userProvider = UserProvider(); // Create the UserProvider

  FirebaseMessaging.onBackgroundMessage(_firebaseMessagingBackgroundHandler);

  runApp(MultiProvider(
    providers: [
      ChangeNotifierProvider(
        create: (context) => userProvider,
      ),
      ChangeNotifierProvider(create: (context) => BusinessProvider()),
    ],
    child: const MyApp(),
  ));
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.black),
        useMaterial3: true,
        primaryColor: const Color(0xFF58768B),
        primarySwatch: Colors.blue,
        dialogTheme: const DialogTheme(
          backgroundColor: Colors.white, // Background color for your dialogs
          titleTextStyle: TextStyle(
              color: Color(0xFF58768B),
              fontSize: 20), // Text style for the title in your dialogs
          contentTextStyle: TextStyle(
              color: Color(0xFF58768B),
              fontSize: 16), // Text style for the content in your dialogs
          // Add other properties as needed
        ),
        buttonTheme: const ButtonThemeData(
          buttonColor: Colors.blue, // Background color for your buttons
          // Text color for your buttons
          textTheme: ButtonTextTheme.primary, // Text theme for your buttons
        ),
      ),
      localizationsDelegates: const [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
        AppLocalizations.delegate,
      ],
      supportedLocales: L10n.all,
      home: UpgradeAlert(
        child: const MainPage()
        ),
      routes: {
        '/main-page': (context) => const MainPage(),
        '/business-listing-page': (context) => const BusinessListingPage(),
        '/messages-page': (context) => const MessagesPage(),
        '/profile-page': (context) => ProfilePage(),
        EditProfilePage.routeName: (context) => const EditProfilePage(),
        '/privacy-policy': (context) => const PrivacyPolicy(),
        '/terms-service': (context) => const TermsAndConditions(),
        '/contact-us': (context) => ContactUsPage(),
        '/reservations-page': (context) => const ReservationsPage(),
        '/sign_up_page': (context) => const SignUpScreen(),
        '/sign_in_page': (context) => const SignInScreen(),
        '/admin-panel': (context) => const AdminPanelPage(),
      },
      onGenerateRoute: (settings) {
        final Uri uri = Uri.parse(settings.name!);
        if (uri.pathSegments.length == 2) {
          final businessId = uri.pathSegments[0];
          final businessName = uri.pathSegments[1];
          return MaterialPageRoute(
            builder: (context) => BusinessDetailsTabBarPage(
              businessId: businessId,
              businessName: businessName,
            ),
          );
        } else if (settings.name == '/category-business-listing-page') {
          final args = settings.arguments as Map<String, dynamic>;
          return MaterialPageRoute(
            builder: (context) => CategoryBusinessListingPage(
              categoryTitle: args['categoryTitle'],
              categoryIndex: args['categoryIndex'],
              firebaseCategoryTitle: args['firebaseCategoryTitle'],
            ),
          );
        }
        // Handle other routes here
        return null;
      },
    );
  }
}

And this is my navigator page;

 onTap: () {
   Navigator.pushNamed(
    context,
    '/$businessId/$businessName',
  );
},

onGenerate route part is not working.

How can I solve this problem. Thank you for answers in advance.

Upvotes: 0

Views: 32

Answers (0)

Related Questions