Create Chat Application in Android using GCM Part 2

In the previous Create Chat Application in Android using GCM we built the REST API. In this post we will build our android application. You can follow the previous Create Chat Application in Android using GCM …

create chat application in android

In the previous Create Chat Application in Android using GCM we built the REST API. In this post we will build our android application. You can follow the previous Create Chat Application in Android using GCM from the link given below.

Create Chat App for Android using GCM Part 1

Our REST APIs are ready now its time to build our application. So lets begin.

Create Chat Application in Android using GCM

Creating Android Studio Project

  • Open android studio and create a new android project. Select empty activity and next->next->finish.
  • Once your project is loaded, you need to add google-services.json in app directory, which you have generated while creating the app in google developer console. If you don’t know what is it just go through the Android Push Notification Tutorial using GCM.
  • Now inside your main package create 3 packages as shown in the image below (this step is optional you can keep all codes in the same package but for the sake of simplicity I have created these packages).

project structure

  • I have created activities to store all the activities, in gcm we will store gcm classes, and all the rest would go inside helper. At this time your MainActivity is inside the main package to move it inside the package activities just drag it inside activities and it will be moved there.

Adding Required Dependencies

  • We will be using many library dependencies for this project so this is my app level build.gradle file. You need to change your file according to this.

  • We have added play services which is required for GCM. We have also added support design, recyclerview, CardView and volley. We will be using all these libraries.
  • Modify project level build.gradle file as shown below.

Creating a class to store the constants

  • Create two classes inside helper package. One is Constants.java to store all the required constants and other is URLs.java to store the API URLs.
  • So create class named Constants.java in helper package and write the following code.

  • Now create URLs.java and write the following code.

  • In the first constant ROOT_URL you need to change the IP according to your system. To know what your IP is you can use ipconfig command in cmd (windows user).

Creating a class to handle the network request and sharedpreferences

  • Now we will create a class. This class will handle the volley requests and sharedpreferences. This would be a singleton class and it will start on the app launch. So we also need to add it inside AndroidManifest.xml. So create a class named AppController.java  inside helper package and write the following code.

  • Now add this class inside the application tag in your AndroidManifest.xml file.

Creating Login Screen on MainActivity

  • We need a login screen to enter in the chat room. So inside activity_main.xml write the following xml code.

  • The above code will generate the following UI.
create chat application in android
Login Screen
  • We are not using password, if the user is already registered it will be logged in or if user is not already registered it will be registered. So basicallly user need to provide his name and email to enter the Chat Room.
  • Now inside MainActivity.java write the following code to add the login functionality.

  • As you can see on login we are starting ChatRoomActivity so we need to create it as well.

Designing Chat Room

  • Create a new empty activity named ChatRoomActivity and in the respective layout file write the following xml code (in my case it is activity_chat_room.xml).

  • The above code would generate the following UI.
create chat application in android
Chat Room
  • We have a RecyclerView to display the thread in the chat room. And at the bottom we have an EditText and a Button.  We need to create a logout button to logout from the chat room.
  • Create a xml file named menu.xml inside menu folder and write the following code.

  • We will code this activity at last.

Creating RecyclerView Layout

  • For RecyclerView we will create two layouts. One layout for self message which will be displayed from right and other for other’s message which will be displayed from left.
  • So first create chat_thread.xml inside layout folder and write the following code. This is for self message.

  • Now create chat_thread_other.xml and write the following code. This is for other’s messages.

  • Both above codes are same only difference is the alignment and background color. In the message part we have two textviews, the first one is large to display the message and the second one is small to display name of the sender and time of the message.
  • The above codes will generate the following UIs.
create chat application in android
Create Chat Application in Android

Creating Message

  • Create a class named Message inside helper package.

  • I have only generated a Constructor and Getters in the above class. You can do it easily by right click->generate in the code window. This class will used to store the messages of the thread.
  • Now for our RecyclerView we need to create our Adapter that will show the Thread. I have also covered a recyclerview tutorial you can check to understand it better.

Creating RecyclerView Adapter

  • Create a class named ThreadAdapter and write the following code.

  • Now we will create our Notification Handler.

Creating Class to Handle Push Notification

  • Create a class NotificationHandler and write the following code.

Adding Google Cloud Messaging

  • For google cloud messaging we have to create three classes. We have did all these in previous GCM tutorial. So I am only pasting the codes here. First create a class named GCMRegistrationIntentService inside gcm package and write the following code.

  • Now create class GCMTokenRefreshListenerService inside gcm package and write the following codes.

  • The last class we need to create in gcm package is GCMPushReceiverService. This class will actually receive the messages.

Creating Chat Room

  • The final step is we will code the ChatRoomActivity. So come inside ChatRoomActivity.java and write the following code.

  • The coding is done now.

Reveiwing AndroidManifest.xml

  • Inside AndroidManifest.xml we have to define the GCM Services and some permissions. So here is my AndroidManifest.xml. Review your manifest according to this.

  • Thats it now run your application and you will see the following output. Just run your app twice using two different emulators.
create chat application in android using gcm
Create Chat Application in Android

Create Chat Application in Android Source Code and Video

  • You can check this video to see the actual output of the application.

  • You can download the working apk that I built for this Create Chat Application in Android Tutorial.

Download APK

  • You can also download my source code from GitHub. Just go to the link given below.

[sociallocker id=1372] Download Chat App Source Code [/sociallocker]

Final Words

So thats all for this Create Chat Application in Android using GCM friends.  This post was very lengthy so follow it carefully if you want to make it work. If you are facing trouble try with my source code. And you can also get my working APK of this Create Chat Application in Android Tutorial.
And please do like and share this post if you find it helpful. And don’t hesitate to ask with your comments if having any confusions or doubts. Thank You 🙂

Hi, my name is Belal Khan and I am a Google Developers Expert (GDE) for Android. The passion of teaching made me create this blog. If you are an Android Developer, or you are learning about Android Development, then I can help you a lot with Simplified Coding.

Expand Your Knowledge: Next Tutorial Picks

0 0 votes
Article Rating
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x