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 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.

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 🙂

Subscribe To Our Newsletter

Subscribe To Our Newsletter

Join our mailing list to receive the latest news and updates from our team.

You have Successfully Subscribed!

Comments

    • Shahin Abdulla says

      hello kelvin
      here recyclerview is updating realtime, your problem might be because of the pushed message is not receiving to the receiver device. check your php codes, especially the gcm.php. since you have copied the entire project as such, the problem might be the compatibility of your server. check whether “php_curl” is installed/enabled in your php.ini file.

  1. Rehaan says

    Dude you are awesome.I just had a question that I wanted to purchase an android book.But every ecommerce website like snapdeal flipkart or amazon.It shows many books but in those books only pradeep kothari books is the best would you suggest me this books.Thanks

  2. R.Raja says

    HI,
    I had copied your project and imported in Android Studio and php code in wamp but after giving name and email its not working .pls tell have to change anythiglike API,Project number.Entering chatroom dialog is always running..PLs tell have to modify anything..

  3. Sebastian says

    Hi,
    Great tutorial 😉 I try to make that app but i have a problem. An app after put some random name and email stuck on “Enter Chatroom” my logs show something like this
    “06-25 16:51:57.742 6498-7735/com.example.borowski.sebastian.gcmchatroom I/System.out: (HTTPLog)-Static: isSBSettingEnabled false
    06-25 16:51:57.742 6498-7735/com.example.borowski.sebastian.gcmchatroom I/System.out: (HTTPLog)-Static: isShipBuild true
    06-25 16:51:57.742 6498-7735/com.example.borowski.sebastian.gcmchatroom I/System.out: (HTTPLog)-Thread-80463-576767514: SmartBonding Enabling is false, SHIP_BUILD is true, log to file is false, DBG is false
    06-25 16:51:57.742 6498-7735/com.example.borowski.sebastian.gcmchatroom I/System.out: (HTTPLog)-Thread-80463-576767514: SMARTBONDING_FEATURE_ENABLED is true
    06-25 16:51:57.742 6498-7735/com.example.borowski.sebastian.gcmchatroom I/System.out: (HTTPLog)-Static: isSBSettingEnabled false
    06-25 16:54:45.252 6498-6498/com.example.borowski.sebastian.gcmchatroom W/IInputConnectionWrapper: showStatusIcon on inactive InputConnection”
    It would be awesome if You could help me 🙂
    Ps; i use free web service with sql database instead of wamp.

  4. Mohammad Julfikar Mahmud says

    Hello mate. I sent you a mail last week may be you didnt notice. Actually I have request to you, can you do a sample project for video calling using webrtc? I really don’t have any idea regarding webrtc. I always refer to your all tutorials for learning android and I am really grateful for that. Thank you in advance

  5. Fahad says

    Assalamualikum

    Thanks for the wonderful tutorial.

    I want to remove login activity and send button and txt box, so that ppl couldnot reply back.
    please help.

    in addtional if I want to link it from Main Activity as my main Activity is used as category.so if I use image button to call chat Application will there be any way.

    Jazakallah

  6. Fahad says

    Asalamualikum brother.
    Now I need your help with sending image and web url in this app as we can send text only here Iwant to send Image and at the same time see that image which I send.
    please help.

  7. rosh says

    slim rest api working perfectly at my localhost.But did not work the resposes(GET,STATUS..ect) at godaddy webhost why???Only getting 500 internal server error.How to solve that????

    http://mydomain.com/achat/v1/messages

    Didn’t get any responses from remote server localhost everything work as fine

  8. Yogesh patel says

    Hii Belal
    Very nice tutorial But The recyclerView doesn’t refresh and push notification not work please suggest me

Leave a Reply

Your email address will not be published. Required fields are marked *


*