How to route to a different pages in flutter app?

Question

Hi Team

I have a page and created some different routing pages to each, somehow they seem not to work at all and when debugging there is much errors. What am missing from my logic? Below is my current code that does this routing. 

 

import 'package:ecape_decor_pty_ltd/screens/profile.dart';
import 'package:ecape_decor_pty_ltd/screens/login.dart';
import 'package:flutter/material.dart';
import 'package:ecape_decor_pty_ltd/screens/home.dart';
import 'package:ecape_decor_pty_ltd/screens/wishlist.dart';
import 'package:carousel_slider/carousel_slider.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Decor Pty Ltd',
      theme: ThemeData(
        primarySwatch: Colors.deepPurple,
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => const MyHomePage(title: 'Decor Store Pty Ltd'),
        '/home': (context) => HomeScreen(),
        '/wishlist': (context) => WishlistScreen(),
        '/profile': (context) => ProfileScreen(),
        '/login' : (context) => LoginScreen(),
      },
      
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = 0;

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });

    

    // Navigate to the selected screen
    switch (index) {
    case 0:
      // home screen page
      Navigator.pushNamed(context, '/home');
      break;
     
      // wishlist screen page.
    case 1:
    Navigator.pushNamed(context, '/wishlist');
     break;
        
      // profile screen page.
      case 2:
      Navigator.pushNamed(context,'/profile');
      break;

      // login screen page.
      case 3: 
      Navigator.pushNamed(context,'/login');

    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: CarouselSlider(
        options: CarouselOptions(
          height: 200,
          aspectRatio: 16 / 9,
          viewportFraction: 0.8,
          initialPage: 0,
          enableInfiniteScroll: true,
          reverse: false,
          autoPlay: true,
          autoPlayInterval: Duration(seconds: 3),
          autoPlayAnimationDuration: Duration(microseconds: 800),
          autoPlayCurve: Curves.fastOutSlowIn,
          enlargeCenterPage: true,
          scrollDirection: Axis.horizontal,
        ),
        items: [
          Icon(Icons.king_bed, size: 100, color: Colors.blue), // Example icon
          Icon(Icons.chair, size: 100, color: Colors.green), // Example icon
          Icon(Icons.home, size: 100, color: Colors.red), // Example icon
          // Add more icons for furniture here
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.home, color: Colors.blue),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.favorite, color: Colors.green),
            label: 'Wishlist',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.person, color: Colors.grey),
            label: 'Profile',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.login, color: Colors.lightGreen),
            label: 'Login',
          ),
        ],
        currentIndex: _selectedIndex,
        selectedItemColor: Colors.blue,
        onTap: _onItemTapped,
      ),
    );
  }
}