Question 79938 in Flutter Question posted in
The official Flutter documentation can be found here.

Switching to another Screen using onPressed not working properly – Flutter

I am trying switch to a different screen in Flutter project using onPressed but it is not generating any outcome not sure what is the reason.

Here is the homescreen page:

                                          onPressed: () {
                                            const User_Profile();
                                            print("Hello");
                                          },

Here is the user profile:

class User_Profile extends StatefulWidget {
  const User_Profile({Key? key}) : super(key: key);
 
  @override
  State<User_Profile> createState() => _user_profileState();
}
 
class _user_profileState extends State<User_Profile> {
  @override
  Widget build(BuildContext context) {
    return const Text("User Profile");
  }
}

Question:
How to switch screens using Onpressed? What am I doing wrong noting that the word Hello for debugging is printed everytime.

Tags:

3

Answers


  1. 0

    Try below code and use Navigator.push refer navigation

      ElevatedButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => User_Profile(),
              ),
            );
          },
          child: const Text('User Profile'),
        ),
    Login or Signup to reply.
  2. 0

    You have to use a function instead of your class like this:

    Navigator.push(context, MaterialPageRoute(builder: (context)=>User_profile()));

    call this:

     onPressed: () {
                                       Navigator.push(context, MaterialPageRoute(builder: (context)=>User_profile()));
                                      },

    instead of this:

       onPressed: () {
                                        const User_Profile();
                                        print("Hello");
                                      },
    Login or Signup to reply.
  3. 0

    as you know you can’t go to a specific page by calling the constructor method in a class. you have 2 ways:

    1. use Navigator.push like this:

           Navigator.push(
       context,
       MaterialPageRoute(
         builder: (context) => User_Profile(),
       ),
     );

    and you can send the parameters to the next page by sending by constructor parameters like: User_Profile(name: 'yourName').2) you can use Navigator.pushNamed. you can define routeName in your main class of the project like this:

    Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(
    MyApp(),
  );
}
class MyApp extends StatefulWidget {
  MyApp({Key? key}) : super(key: key);

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        canvasColor: Colors.transparent,
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => Splash(),
        '/user_profile': (context) => User_Profile(),
      },
    );
  }
}

    as you see you defined a routeName '/user_profile' and you can use Navigator.pushNamed and if you want to pass parameters to the next page you have to use arguments like this:

     Navigator.pushNamed(
  context,
 '/user_profile',
 arguments: {"name" : "yourName"},);

    and this code is for getting the arguments that you’ve passed in your User_Profile :

    var arguments = ModalRoute.of(context)!.settings.arguments as Map;
var name = arguments['name'] as String;

    I recommend you to use the second way to know all your routes of your projects.

    Good Luck;)

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search