Simple ChatApp using Firebase Realtime Database

Here we are creating simple group chat application using Firebase Realtime Database, in the previous blog we have completed User Registration and Login users by firebase authentication. If you not seen please jump to Firebase Authentication

Video Demo



1. Implementing Realtime Database

  • After completing Authentication, now user is successfully logged in to our app.
  • Now add realtime database to your app by using Firebase Console in Android Studio
  • Save and retrieve data -> Connect to firebase -> add Realtime Database to your app -> configure
  • After successfully added, go to Firebase console -> your project -> Database -> choose Realtime Databse -> create database ->make sure you enabled test mode so that read/write will be true.
  • After database is created, below console will be displayed. Now database creation is completed


  • 2. Simple Chat page

  • Create an Activity “GroupChatActivity”, where all the chat messages will be displayed in this activity.

  • Add the below code

    activity_group_chat.xml

    Add the below code in your “GroupChatActivity.java” file.

    GroupChatActivity.java

  • onclick send button, user message, user name, timestamp has been loaded in model class “FirebaseMessage” and sent to the realtime database.
  • Create a model class FirebaseMessage, where user message, username as a parameter in constructor

  • FirebaseMessage.java

  • After data is pushed to database, displayChatMessages() will be called.
  • By using FirebaseAdapter, it will get all the Messages from the database as a List then inflates and binds the values in message_layout.xml.
  • populateView() passes View, Position and model(holds the data) of current List position.
  • We no need to create adapter class separately, firebase provides firebaseAdapter it automatically loads the data in Listview.
  • Then adapter is loaded into Listview, now all the chat messages will be displayed.
  • This layout is inflated into listview for each chat message

  • message_layout.xml

  • Implement below code for using Firebase adapter. gradle(module.app)
  • 
    implementation 'com.firebaseui:firebase-ui:0.6.0'
    implementation 'com.android.support:design:28.0.0'
    

    Drawable files:

    messenger_border_green.xml

    chat_box_view_bg.xml



    3.RealTime Chat using your App

  • Now run your app, once user is authenticated it will directed to Dashboard Activity and by clicking Group Chat button, user is directed to GroupChat page.
  • Now you can chat with all registered users in your database.
  • After message sent Database is updated with user message, time, name.
  • Hope this article is helpful, now you can create a chat app by using Firebase realtime database.

    Project GitHub Link

    Navin Kumar

    Aspiring Android developer who Translate designs and wireframes into high quality code. A down to earth person with interests to Ensure the best possible performance, quality, and responsiveness of the application.