📱 Flutter WhatsApp-like Chat Chat App

Overview

This Flutter project is a chat application inspired by WhatsApp. The app features a familiar interface with a functional chat page, a Local Auth Screen, and user registration using email/password or Google Account.

Screenshots

Update Available Screen

SignUp using Email & Password Screen

SignUp using the Google Account Screen ( After Select Account )

Login Screen

Reset Password Screen

Home Screen

Settings Screen

Chat Screen

Select Image

Local Auth Screen (Fingerprint & FaceID)

No Internet Screen

Coming Soon Screen

Features

• User Authentication:

• Email/Password registration with placeholder image.

• Google Account registration with profile image.

• Chat Functionality:

• Display all registered users on the home page.

• Clicking on a user tile opens the chat page.

• Chat page displays saved messages from Firebase store.

• Input text field and send button for sending messages.

• Real-time updates using Firebase Cloud Firestore.

• Push notifications using Firebase Cloud Messaging.

• Notification Handling:

• Display notifications when the app is in the foreground using flutter_local_notifications package.

• Open the chat with the sender when the app is in the background or terminated.

• Security:

• App lock feature using fingerprint or face ID with local_auth package.

• Fingerprint/face ID attempts are limited to prevent unauthorized access.

• Lock screen request after multiple unsuccessful attempts.

• Settings:

• Accessible from the home page’s three dots menu.

• Option to enable/disable app lock with a Cupertino switch.

• Option to Change App Language

• Camera Integration:

• Capture high-quality photos using the device’s camera.

• Save pictures on the device.

• Send photos

Dependencies

• awesome_dialog: Provides versatile dialogs for various use cases.
• cached_network_image: Library to load and cache network images.
• chat_bubbles: Simplifies chat message UI creation.
• cloud_firestore: Integrates with Firebase Firestore for data storage and retrieval.
• dio: HTTP client for making API requests.
• easy_localization: Internationalizing and localization App.
• firebase_auth: Manages user authentication with Firebase.
• firebase_core: Initializes the Firebase connection.
• firebase_messaging: Enables FCM for notifications.
• firebase_storage: Plugin for Firebase Cloud Storage.
• flutter_local_notifications: Presents local notifications when the app is in the foreground.
• flutter_native_splash: Customize the App’s default white native splash screen with background color and splash image.
• flutter_offline: Handles offline connectivity scenarios.
• flutter_screenutil: Adapts UI elements to different screen sizes.
• flutter_speed_dial: Plugin to implement a beautiful and dynamic Material Design Speed Dial with labels.
• flutter_svg: An SVG rendering and widget library.
• gap: Simplifies spacing management in layouts.
• flutter_link_previewer: Customizable link and URL preview extracted from the provided text with the ability to render from the cache.
• gallery_saver: Saves images and videos from network or temporary file to external storage. Both images and videos will be visible in Android Gallery and iOS Photos.
• restart_app: A Flutter plugin that helps you to restart the whole Flutter app with a single function call by using native APIs.
• path_provider: Flutter plugin for getting commonly used locations on host platform file systems, such as the temp and app data directories.
• google_sign_in: Facilitates Google Sign-In authentication.
• googleapis_auth: Obtain Access credentials for Google services using OAuth 2.0.
• image_picker: Plugin for selecting images from the image library, and taking new pictures with the camera.
• intl: Internationalization and localization support.
• local_auth: Enables fingerprint and Face ID authentication.
• logger: Assists with logging messages for debugging.
• shared_preferences: Stores simple data locally on the device.
• pretty_dio_logger: A Dio interceptor that logs network calls in a pretty, easy-to-read format.
• modal_bottom_sheet: Create awesome and powerful modal bottom sheets.
• lottie: Render After Effects animations natively on Flutter.
• package_info_plus: Querying information about the application package.
• pub_semver: in this App to compare versions.
• url_launcher: Plugin for launching a URL.

Installation

1. Clone the repository:

git clone https://github.com/MoazSayed7/Flutter-Chat-App-Firebase-Authentication-Messaging-WhatsApp-Like.git

2. Navigate to the project directory:

cd Flutter-Chat-App-Firebase-Authentication-Messaging-WhatsApp-Like

3. Install dependencies:

flutter pub get

4. Configure Firebase:

• Create a Firebase project at https://console.firebase.google.com/.
• Enable the required Firebase services for your app, including Firestore, Authentication, and Cloud Messaging.

5. Set up Firebase for your project by following the Using Firebase CLI.

6. Update the app’s launcher icon:

dart run flutter_launcher_icons

7. Update the app’s splash screen:

dart run flutter_native_splash:create --path=flutter_native_splash.yaml

8. Run the app:

flutter run