Flutter Task 01: When user logged in then after splash screen always show home page

Flutter Task 01: When user logged in then after splash screen always show home page.

To achieve the behavior where the Splash Screen is displayed first and then redirects to the Home Page if the user is logged in, you can manage this flow by using a Future to check the user's login status during app initialization. Here's how you can implement it:

---

Steps to Implement the Flow

1. Setup Splash Screen
   • Add a splash screen that runs first when the app starts.
   • Check the user's login status during the splash screen.
2. Check Login Status
   • Use SharedPreferences or any other persistent storage to determine if the user is logged in.
3. Navigation Logic
   • If logged in, navigate to the Home Page after the splash screen.
   • Otherwise, navigate to the Login Page.
4. Handle Back Navigation
   • Use WillPopScope on the Home Page to prevent the back button from going to the splash screen unnecessarily.

---

Implementation

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData.light(),
      darkTheme: ThemeData.dark(),
      themeMode: ThemeMode.system,
      home: SplashScreen(),
    );
  }
}

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreenState createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  @override
  void initState() {
    super.initState();
    navigateToNextScreen();
  }

  void navigateToNextScreen() async {
    await Future.delayed(Duration(seconds: 2)); // Simulate a loading period
    final isLoggedIn = await checkLoginStatus();

    if (isLoggedIn) {
      Navigator.pushReplacement(
        context,
        MaterialPageRoute(builder: (context) => HomePage()),
      );
    } else {
      Navigator.pushReplacement(
        context,
        MaterialPageRoute(builder: (context) => LoginPage()),
      );
    }
  }

  Future<bool> checkLoginStatus() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    return prefs.getBool('isLoggedIn') ?? false;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          "MyApp",
          style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
        ),
      ),
    );
  }
}

class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Login"),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () async {
            SharedPreferences prefs = await SharedPreferences.getInstance();
            await prefs.setBool('isLoggedIn', true); // Set login status
            Navigator.pushReplacement(
              context,
              MaterialPageRoute(builder: (context) => HomePage()),
            );
          },
          child: Text("Login"),
        ),
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        // Exit the app instead of going back to the splash screen
        return false;
      },
      child: Scaffold(
        appBar: AppBar(
          title: Text("Home"),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () async {
              SharedPreferences prefs = await SharedPreferences.getInstance();
              await prefs.setBool('isLoggedIn', false); // Clear login status
              Navigator.pushReplacement(
                context,
                MaterialPageRoute(builder: (context) => SplashScreen()),
              );
            },
            child: Text("Logout"),
          ),
        ),
      ),
    );
  }
}

---

Explanation

1. Splash Screen Logic:
   • The SplashScreen checks the login status by fetching data from SharedPreferences.
   • Based on the login status, it navigates to the Home Page or Login Page.
2. Navigation:
   • Navigator.pushReplacement() ensures that the previous page is removed from the navigation stack.
3. Back Button Handling:
   • On the Home Page, the back button is disabled using WillPopScope to prevent navigating back to the Splash Screen.
4. Logout Logic:
   • Clearing the login status in SharedPreferences and navigating back to the Splash Screen allows the app to reset the flow.

---

This structure ensures a smooth and user-friendly navigation experience.