StreamBuilder userLogin Screen not working

32 views Asked by At

I am creating a simple login page where after a user signs in as a guest, they are redirected to the Dashboard. But for some reason, the Dashboard screen doesn't seem to load when the user logs in as a guest immediately, but only shows up when i hot restart the app.

This is the Login Screen

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

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 15),
      width: double.infinity,
      height: double.infinity,
      child: Stack(
        children: [
          Positioned(
            top: 20,
            child: Container(
              padding: const EdgeInsets.all(30),
              decoration: BoxDecoration(
                color: Colors.teal,
                borderRadius: BorderRadius.circular(20),
              ),
              child: Column(
                children: [
                  Text(
                    'Create a',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 40,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                  Text(
                    'Job-Ready',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 40,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                  Text(
                    'Resume ',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 40,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                  Text(
                    'in Minutes.',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 40,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ],
              ),
            ),
          ),
          Positioned(
            bottom: 220,
            right: 0,
            child: Container(
              padding: const EdgeInsets.all(30),
              decoration: BoxDecoration(
                color: Colors.amber.shade800,
                borderRadius: BorderRadius.circular(20),
              ),
              child: Column(
                children: [
                  Text(
                    '3 Steps.',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 40,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                  Text(
                    '5 Minutes.',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 40,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ],
              ),
            ),
          ),
          Positioned(
            width: MediaQuery.of(context).size.width - 30,
            bottom: 20,
            child: Column(
              children: [
                InkWell(
                  onTap: () async {
                    await AuthService().googleSignIn();
                  },
                  child: Container(
                    height: 70,
                    decoration: const BoxDecoration(
                      color: Colors.white,
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(10),
                      child: Stack(
                        children: [
                          const Align(
                            alignment: Alignment.centerLeft,
                            child: Icon(
                              FontAwesomeIcons.google,
                              color: Colors.black,
                            ),
                          ),
                          Align(
                            alignment: Alignment.center,
                            child: Text(
                              'Continue with Google',
                              style: TextStyle(
                                color: Colors.black,
                                fontSize: 25,
                                fontFamily: GoogleFonts.oswald().fontFamily,
                                height: 1,
                                fontWeight: FontWeight.w200,
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
                const SizedBox(
                  height: 20,
                ),
                InkWell(
                  onTap: () async {
                    await AuthService().signInAnon();
                  },
                  child: Container(
                    height: 70,
                    decoration: const BoxDecoration(
                      color: Colors.white,
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(10),
                      child: Stack(
                        children: [
                          const Align(
                            alignment: Alignment.centerLeft,
                            child: Icon(
                              FontAwesomeIcons.user,
                              color: Colors.black,
                            ),
                          ),
                          Align(
                            alignment: Alignment.center,
                            child: Text(
                              'Continue as Guest',
                              style: TextStyle(
                                color: Colors.black,
                                fontSize: 25,
                                fontFamily: GoogleFonts.oswald().fontFamily,
                                height: 1,
                                fontWeight: FontWeight.w200,
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

This is the Onboarding Screen


  const OnboardingScreen({super.key});

  @override
  State<OnboardingScreen> createState() => _OnboardingScreenState();
}

class _OnboardingScreenState extends State<OnboardingScreen> with TickerProviderStateMixin {
  late final AnimationController cont = AnimationController(
    vsync: this,
    duration: const Duration(microseconds: 200),
  );

  late final AnimationController cont1 = AnimationController(
    vsync: this,
    duration: const Duration(seconds: 3),
  );

  late final Animation anim = Tween<double>(begin: 220, end: 200).animate(CurvedAnimation(
    parent: cont,
    curve: Curves.bounceInOut,
  ));

  late final Animation ganim = Tween<double>(begin: 0.4, end: 0).animate(
    CurvedAnimation(parent: cont1, curve: Curves.easeInOut),
  );

  @override
  void initState() {
    super.initState();

    cont1.repeat(reverse: true);
  }

  @override
  void dispose() {
    cont.dispose();
    cont1.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: AnimatedBuilder(
        animation: ganim,
        builder: (context, child) {
          return Container(
            decoration: BoxDecoration(
              gradient: LinearGradient(
                colors: [Colors.pink.shade100, Colors.pink.shade200],
                begin: Alignment.topCenter,
                end: Alignment.bottomRight,
                stops: [0.1 + ganim.value, (0.3 + ganim.value).toDouble()],
              ),
            ),
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height,
            child: Transform.translate(
              offset: const Offset(-15, 20),
              child: Center(
                child: SizedBox(
                  width: 300,
                  height: 400,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      SizedBox(
                        child: Text(
                          'RESUME \nCRAFT',
                          style: TextStyle(
                            fontFamily: GoogleFonts.oswald().fontFamily,
                            fontSize: 50,
                            height: 1,
                            fontWeight: FontWeight.bold,
                            color: Colors.black,
                          ),
                        ),
                      ),
                      SizedBox(
                        child: Text(
                          'Your Resume Redefined',
                          style: TextStyle(
                            fontFamily: GoogleFonts.oswald().fontFamily,
                            fontSize: 30,
                            height: 1,
                            fontWeight: FontWeight.bold,
                            color: Colors.black,
                          ),
                        ),
                      ),
                      SizedBox(
                        child: Text(
                          'Welcome to ResumeCraft, where we redefine resume creation. Craft a modern and compelling resume that sets you apart from the competition. Your journey to success begins with a simple tap. Let us get started on your redefined resume.',
                          style: TextStyle(
                            fontSize: 16,
                            color: Colors.black.withOpacity(0.7),
                          ),
                        ),
                      ),
                      AnimatedBuilder(
                        animation: anim,
                        builder: (context, child) {
                          return Container(
                            width: anim.value,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(20),
                              border: Border.all(color: Colors.black, width: 3),
                              color: Colors.white,
                            ),
                            padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 5),
                            child: ElevatedButton(
                              onPressed: () {
                                cont.forward();
                                Future.delayed(
                                  const Duration(milliseconds: 200),
                                  () {
                                    cont.reverse();
                                  },
                                );

                                Future.delayed(
                                  const Duration(milliseconds: 500),
                                  () {
                                    Navigator.of(context).push(
                                      MaterialPageRoute(
                                        builder: (context) => const LoaderScreen(),
                                      ),
                                    );
                                  },
                                );

                                Future.delayed(
                                  const Duration(milliseconds: 4500),
                                  () {
                                    Navigator.of(context).push(
                                      PageRouteBuilder(
                                        pageBuilder: (context, animation, secondaryAnimation) {
                                          return const LoginScreen();
                                        },
                                        transitionsBuilder: (context, animation, secondaryAnimation, child) {
                                          final canim = CurvedAnimation(parent: animation, curve: Curves.easeInOutCirc);

                                          return ScaleTransition(
                                            scale: canim,
                                            alignment: Alignment.center,
                                            child: child,
                                          );
                                        },
                                      ),
                                    );
                                  },
                                );
                              },
                              style: ElevatedButton.styleFrom(
                                backgroundColor: Colors.transparent,
                                shadowColor: Colors.transparent,
                              ),
                              child: const Text(
                                'Get Started',
                                style: TextStyle(fontSize: 20, color: Colors.black, fontWeight: FontWeight.bold),
                              ),
                            ),
                          );
                        },
                      )
                    ],
                  ),
                ),
              ),
            ),
          );
        },
      ),
    );
  }
}

This is the DashBoard Screen

class DashScreen extends StatefulWidget {
  const DashScreen({super.key});

  @override
  State<DashScreen> createState() => _DashScreenState();
}

class _DashScreenState extends State<DashScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: Appbar(
        leading: IconButton(
          icon: const Icon(
            FontAwesomeIcons.powerOff,
            color: Colors.white,
          ),
          onPressed: () {
            AuthService().signOut();
          },
        ),
        title: const Text(''),
      ),
      body: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 20),
        child: ListView(
          children: [
            const SizedBox(
              height: 10,
            ),
            SizedBox(
              width: MediaQuery.of(context).size.width,
              child: Column(
                children: [
                  Text(
                    'Get Inspired by Resume Samples from Various Industires',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 50,
                      fontFamily: GoogleFonts.oswald().fontFamily,
                      height: 1,
                      fontWeight: FontWeight.w700,
                    ),
                    textAlign: TextAlign.center,
                  ),
                  const SizedBox(
                    height: 15,
                  ),

This is the decider Logic

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

  @override
  Widget build(BuildContext context) {
    return StreamBuilder(
        stream: AuthService().duser,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.waiting) {
            return const LoaderScreen();
          } else if (snapshot.connectionState == ConnectionState.active) {
            if (snapshot.hasError) {
              return const Center(child: Text('Error'));
            } else if (snapshot.hasData) {
              print(snapshot.data);
              return const DashScreen();
            } else {
              return const OnboardingScreen();
            }
          } else {
            return const Center(child: Text('Error'));
          }
        });
  }
}

For some reason, when i mention LoginScreen instead of OnboardingScreen in the else logic, the Dashboard shows up. Only when I write OnboardingScreen, the Dashboard has issues showing up.

Any help would be much appreciated. Thank You.

0

There are 0 answers