How to Build a Flutter Chat App with the MirrorFly SDK

Introduction

In this tutorial, you will learn how to add 500+ chat features to your apps using Flutter. We will use MirrorFly SDK to add the features to your app in less than 20 mins.

Don’t have an app?
Use our Sample app! Also, you can integrate the MirrorFly Chat Plugin to build a complete UI in just 5 mins.

Let’s get started!

Minimum Requirements

To start the development, you will need the following requirements:

Android Lollipop 5.0 (API Level 21) or above (For building your Android chat app in Flutter)
Java 7 or higher
Gradle 4.1.0 or higher The minimum requirements for Chat SDK for iOS
iOS 12.1 or later (For building your iOS chat app in Flutter)

Steps To Build Chat Into Flutter App

1) Get Your License Key

Step 1 : Signup for a MirrorFly account

Step 2 : Verify your account via your registered email

Step 3 : Log into your account

Step 4 : Go to the ‘Application info’ section in your Account Overview

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

2) Download the SDK

From the list of SDKs, download the Flutter Chat SDK Package.
Extract the packages on your device.
Create a new Flutter project using CLI or any IDE as per your project requirements.

3) Create Dependencies

Android Dependencies:

Spot the build.gradle in the root directory of your Android folder and add the following code.


                   allprojects {  
                        repositories {  
                            google()  
                           mavenCentral()  
                           jcenter()  
                           maven {  
                                 url "https://repo.mirrorfly.com/release"  
                           }  
                        }  
                      }

Next, add the following dependencies in the app/build.gradle file.


                      android { 
                      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") 
                      } 
                   }

iOS Dependencies:

Go to the end of your iOS/Podfile and add the following code:


                      post_install do |installer|  
                         installer.pods_project.targets.each do |target|  
                            flutter_additional_ios_build_settings(target)  
                            target.build_configurations.each do |config|  
                               config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '12.1'  
                               config.build_settings['ENABLE_BITCODE'] = 'NO'  
                               config.build_settings['APPLICATION_EXTENSION_API_ONLY'] = 'No'  
                               config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'  
                               config.build_settings["EXCLUDED_ARCHS[sdk=iphonesimulator*]"] = "arm64"  
                            end  
                         end  
                         end

Next, you need to enable the App Groups capabilities in your project.

 Goto Project -> Target -> Signing & Capabilities -> Click + at the top left corner -> Search for ‘App Groups’

Flutter Dependencies:

Go to pubspec.yaml and add the following dependencies

 dependencies: mirrorfly_plugin: ^0.0.13

Use the below import statement so that you can use all the methods and classes. Run the flutter pub get command.

 import 'package:mirrorfly_plugin/mirrorfly.dart';

4) Initialization of MirrorFly Plugin

Add the following code in the main function of your main.dart file, before runApp()


                   void main() {  
                      WidgetsFlutterBinding.ensureInitialized();  
                      Mirrorfly.initializeSDK(  
                         licenseKey: LICENSE_KEY,  
                         iOSContainerID: iOS_APP_GROUP_ID,  
                         chatHistoryEnable: ENABLE_CHAT_HISTORY);  
                      runApp(const MyApp());  
                   }

5) Register A User

To register a user in the Sandbox/ Live mode, include the below code:


                   Mirrorfly.registerUser(userIdentifier).then((value) {  
                   // you will get the user registration response  
                   var userData = registerModelFromJson(value);  
                   }).catchError((error) {  
                      // Register user failed print throwable to find the exception details.  
                      debugPrint(error.message);  
                   });

6) Send 1:1 Message

You can use the below method to enable sending of messages.


                   var userJid = await Mirrorfly.getJid(username);


                   Mirrorfly.sendTextMessage(message, jid).then((value) {  
                      // you will get the message sent success response  
                      var chatMessage = sendMessageModelFromJson(value);  
                   });

7) Receive 1:1 Message

Use the below code to enable reception of messages.


                   Mirrorfly.onMessageReceived.listen(result){  
                      // you will get the new messages  
                      var chatMessage = sendMessageModelFromJson(result)  
                   }

Conclusion

To conclude, by now you would have known how to use MirrorFly's Flutter Chat SDKs to add messaging functionalities to your Android apps.

Apart from chat, MirrorFly's SDK also lets you integrate voice and video calling capabilities to your mobile and web apps easily.

If you are ready to get started with our Flutter SDKs, we suggest a few tutorials:

Hope you find this tutorial helpful. Happy developing!

Build A Chat App With MirrorFly Flutter SDK