Search code examples
flutterdartflutter-layoutdart-async

Why is flutter printing out widget name?


I have a problem with flutter printing out the name and rendering Widget name after running the application

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  autoLogin() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    bool? loggedIn = prefs.getBool('loggedin');
    if (loggedIn == true) {
       Home();
    } else {
      return LoginOrSignup();
    }
  }

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(body:SafeArea(
          child: FutureBuilder(
            future: autoLogin(),
            builder: (BuildContext context, snapshot) {
              if (snapshot.hasData) {
                return Text('${snapshot.data}');
              } else {
                return LoginOrSignup();
              }
            }),

        ))
    );
  }
}

After running the app the output is LoginOrSignup()

class LoginOrSignup extends StatelessWidget {
  const LoginOrSignup({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          Center(
            child: MaterialButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => Login()),
                );

              },
              child: Text('Loginsss'),
            ),
          ),
          Center(
            child: MaterialButton(
              onPressed: (){
                 Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => Signup()),
                );
              },
              child: Text('Signup'),
            ),
          )
        ],
      ),
    );
  }
}

enter image description here I have tried using another widget like Text() but it still prints out the same when i run the application on a mobile app. The problem seems to appear in the autoLogin() function that i have


Solution

  • The issue is your future return Widget itself, and when you use Text('${snapshot.data}') it print the widget, To simplfity this you can return data from Future(this is what mostly we do). Let say you like to return widget itself.

    A little correction is needed on Future.

      Future<Widget> autoLogin() async {
        SharedPreferences prefs = await SharedPreferences.getInstance();
        bool? loggedIn = prefs.getBool('loggedin');
        if (loggedIn == true) {
          return Home();
        } else {
          return LoginOrSignup();
        }
      }
    

    And

    return MaterialApp(
        home: Scaffold(
            body: SafeArea(
      child: FutureBuilder<Widget>(
        future: autoLogin(),
        builder: (BuildContext context, snapshot) {
          if (snapshot.hasData) {
            return snapshot.data!;
          } else {
            return LoginOrSignup();
          }
        }),
    )));