Introduction

In this tutorial, you will learn how to build chat functionality into Android apps using Flutter. We will use Android Studio as the development environment and MirrorFly SDKs to add the messaging features in this guide.

Let’s get started!

Minimum Requirements

  • Android 4.4 or later
  • Flutter 2.0.0 or later
  • Dart 2.12.0 or later
  • MirrorFly Chat SDK & License Key

1) Get Your Application Keys

Steps to Build Chat Into Flutter App

Step 1 : Signup for a MirrorFly account

Step 2 : Verify your account via your registered email

Step 3 : Log into your account and download the Flutter SDK Package

Step 4 : Extract the packages on your device

Step 5 : Note down the License key, which will be used to authenticate your SDK to the server.

#

2) Set Up Flutter Chat App

Step 1 : The next step of the project is to set up a flutter app in Android Studio. To do this, you need to open Android Studio IDE and create a Flutter app project.

#

Step 2 : Next, you’ll need to add MirrorFly dependencies to the project.

Step 3 : Open the app folder and add the packages to pubspec.yaml file.

Step 4 : Next, add the below line to the gradle.properties file, to avoid any kind of library conflicts from the imported package files.


                        android.enableJetifier=true
                     

Step 5 : For permissions to access different components of the project, you need to add the below permissions to the AndroidManifest.xml


                     <uses-permission android:name="android.permission.INTERNET" />
                     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
                  

Step 6 : Configure the app/build.gradle file with the License key acquired from your MirrorFly Account Dashboard


                         plugins { 
                            ... 
                            id 'kotlin-android' 
                            id 'kotlin-kapt' 
                         } 
                         android { 
                            compileOptions { 
                               sourceCompatibility JavaVersion.VERSION_1_8 
                               targetCompatibility JavaVersion.VERSION_1_8 
                            } 
                            kotlinOptions { 
                               jvmTarget = '1.8' 
                            } 
                            packagingOptions { 
                               exclude 'META-INF/AL2.0' 
                               exclude 'META-INF/DEPENDENCIES' 
                               exclude 'META-INF/LICENSE' 
                               exclude 'META-INF/LICENSE.txt' 
                               exclude 'META-INF/license.txt' 
                               exclude 'META-INF/NOTICE' 
                               exclude 'META-INF/NOTICE.txt' 
                               exclude 'META-INF/notice.txt' 
                               exclude 'META-INF/ASL2.0' 
                               exclude 'META-INF/LGPL2.1' 
                               exclude("META-INF/*.kotlin_module") 
                            } 
                         } 

                     

In the app/build.gradle file of your Flutter project, add the following dependencies:


                         dependencies { 
                            ... // your app dependencies 
                            implementation files('libs/appbase.aar') 
                            implementation files('libs/flycommons.aar') 
                            implementation files('libs/flynetwork.aar') 
                            implementation files('libs/flydatabase.aar') 
                            implementation files('libs/videocompression.aar') 
                            implementation files('libs/xmpp.aar') 
                         } 
                     

Add the below modules to your gradle build and configure the required parameters as shown below:


                      dependencies { 
                          
                            ... // your app dependencies 
                          
                            configurations { 
                               all { 
                                     exclude group: 'org.json', module: 'json' 
                                     exclude group: 'xpp3', module: 'xpp3' 
                               } 
                            } 
                          
                            //For lifecycle listener 
                            implementation 'android.arch.lifecycle:extensions:1.1.1' 
                            annotationProcessor 'android.arch.lifecycle:compiler:1.1.1' 
                          
                            //For GreenDao 
                            implementation 'de.greenrobot:greendao:2.1.0' 
                          
                            //For gson parsing 
                            implementation 'com.google.code.gson:gson:2.8.1' 
                          
                            //for smack implementation 
                            implementation 'org.igniterealtime.smack:smack-android:4.4.4' 
                            implementation 'org.igniterealtime.smack:smack-tcp:4.4.4' 
                            implementation 'org.igniterealtime.smack:smack-im:4.4.4' 
                            implementation 'org.igniterealtime.smack:smack-extensions:4.4.4' 
                            implementation 'org.igniterealtime.smack:smack-sasl-provided:4.4.4' 
                          
                            implementation 'androidx.localbroadcastmanager:localbroadcastmanager:1.0.0' 
                            implementation 'androidx.multidex:multidex:2.0.1' 
                            implementation 'com.google.android.gms:play-services-location:17.0.0' 
                          
                            //Dagger Dependencies 
                            api 'com.google.dagger:dagger:2.40.5' 
                            kapt 'com.google.dagger:dagger-compiler:2.40.5' 
                            api 'com.google.dagger:dagger-android:2.40.5' 
                            api 'com.google.dagger:dagger-android-support:2.40.5' 
                            kapt 'com.google.dagger:dagger-android-processor:2.40.5' 
                          
                            //coroutines 
                            implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-android:1.3.8' 
                            implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-test:1.3.8' 
                          
                            //apicalls 
                            implementation 'com.squareup.retrofit2:retrofit:2.6.1' 
                            implementation 'com.squareup.retrofit2:converter-gson:2.6.1' 
                            implementation 'com.squareup.okhttp3:okhttp:4.2.0' 
                            implementation 'com.jakewharton.retrofit:retrofit2-kotlin-coroutines-adapter:0.9.2' 
                          
                            //stetho interceptor 
                            implementation 'com.facebook.stetho:stetho-okhttp3:1.3.1' 
                          
                            //okhttp interceptor 
                            implementation 'com.squareup.okhttp3:logging-interceptor:3.14.3' 
                          
                            //shared preference encryption 
                            implementation 'androidx.security:security-crypto:1.1.0-alpha03' 
                          
                            //for mobile number formatting 
                            implementation 'io.michaelrocks:libphonenumber-android:8.10.1' 
                         } 

                     

                         buildTypes { 
                         debug { 
                            buildConfigField 'String', 'SDK_BASE_URL', '"https://api-preprod-sandbox.mirrorfly.com/api/v1/"' 
                            buildConfigField 'String', 'LICENSE', '"xxxxxxxxxxxxxxxxxxxxxxxxx"' 
                            buildConfigField 'String', 'WEB_CHAT_LOGIN', '"https://webchat-preprod-sandbox.mirrorfly.com/"' 
                            buildConfigField "String", "SUPPORT_MAIL", '"contussupport@gmail.com"' 
                         } 
                      } 
                         
                     

3) Chat SDK Initialization

Inside the onCreate() method of the Android Application Class, you need to add the ChatSDK builder. This will render all the necessary data to initialize the SDKs.

Kotlin


                   //For chat logging 
                   LogMessage.enableDebugLogging(BuildConfig.DEBUG) 
                   ChatSDK.Builder() 
                   .setDomainBaseUrl(BuildConfig.SDK_BASE_URL) 
                   .setLicenseKey(BuildConfig.LICENSE) 
                   .setIsTrialLicenceKey(true) 
                   .build() 
                  

5) Connect To MirrorFly Chat Server

To connect your chat app to the server, you need to connect your chat app to the server.

Establish the app-server connection using the below connect() method.


                      Server connected automatically during registration
                  

6) Add Interaction Features

MirrorFly SDK offer a wide range of interaction-rich features. You can add each one of them as guided below:

Step 1 : Choose App Style

With the Flutter SDK, you can redesign your existing app style and typography. Use the style/ font of your style and then pass it to the MaterialApp class as shown below


                   Widget build(BuildContext context) { 
                      return GetMaterialApp( 
                      title: "MirrorFly", 
                      theme: MirrorFlyAppTheme.theme, 
                      ); 
                   } 
                  

Step 2 : Send a Message

Use the below sendTextMessage() method to send the first message using your Flutter app.


                      FlyChat.sendTextMessage(TEXT, TO_JID, replyMessageId).then((value) { 
                         // you will get the message sent success response 
                      }); 
                  

Step 3 : Receive a Message

To receive a text message on your app, add the below onMessageReceived() method to get notified on any incoming messages

FlyChat.onMessageReceived.listen(onMessageReceived);


                      void onMessageReceived(chatMessage) { 
                      //called when the new message is received 
                      } 
                  

Conclusion

To conclude, you now know how to use MirrorFly Chat SDKs to add messaging functionalities to your Android apps. Apart from chat, MirrorFly also lets you integrate video calling to your mobile and web apps. We recommend a few tutorials to get started with:

Hope you find this tutorial helpful. Happy developing!

mirrorfly

Looking to Build a Flutter Chat App With MirrorFly SDK

Get Started with MirrorFly SDK and Improve your overall in-app conversion, engagement, and retention.

  • Topic-based Chat
  • Upload Large Files
  • Multi-tenancy support
  • Lite Chat App
  • Hire Dedicated Team
mirrorfly support team
Integrate Our Chat SDK In Just 20 Mins!

Start adding our messaging APis & SDK to any app right away!

Get Started

Need SDK integration support? Hire our developers!

mirrorfly sales team
Get Started With Our Self-hosted Chat Solution Today!

Get Full Access To Our Customizable Video, Voice & Chat SDKs!

Request Demo

Let us build your chat app. Hire dedicated team!

Need to build a complete chat app? Let our experts help you out.
Hire Our Team