Introduction

In this tutorial, we will learn how to implement our real-time video call SDKs into your pre-built Android video call app using JavaScript to enhance its capabilities to get connected with worldwide users instantly.

Requirements

  • Android Lollipop 5.0 (API Level 21) or above
  • Java 7 or higher
  • Gradle 4.1.0 or higher
  • MirrorFly SDK License Key

Get Started with the App Development

There are two ways to add our video call SDKs into your existing video call app,

  • Integrate the SDKs to your existing or pre-built app
  • Use our Sample trial app

Let’s get into the details.

Integration of Video Call SDKs

System Requirements

The entire integration process begins with the installation of app's dependencies.

Installing the App Dependencies

Step 1 : Open your Android IDE.

Step 2 : Create a new project or open an existing one.

Step 3 : Add the below given libraries to your project's app/libs folder.

  • appbase.aar
  • flycommons.aar
  • flynetwork.aar
  • flydatabase.aar
  • videocompression.aar
  • xmpp.aar
  • flywebrtc.aar

Step 4 : Now, download the library files from your MirroFly SDK files and add them to your project as shown below.

#

Step 5 : Add the below given codes to the app/build.gradle file.

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

Step 6 : Continue adding the following dependencies to the app/build.gradle file.

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')
                        implementation files('libs/flywebrtc.aar')
                        }
#

Step 7 : Now, the SDKs are required to have the below dependencies,


                        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.3'
                           implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-test:1.3.3'
                           
                           //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'
                           
                           //Socket - versions.gradle
                           implementation 'com.github.nkzawa:socket.io-client:0.6.0'
                           //Google - versions.gradle
                           implementation 'org.webrtc:google-webrtc:1.0.32006'
                           
                           implementation 'androidx.core:core-ktx:+'
                           implementation 'org.jetbrains.kotlin:kotlin-stdlib-jdk7:1.4.31'
                           
                           implementation 'androidx.media:media:1.0.0'
                           
                           //room database
                           implementation 'androidx.room:room-runtime:2.2.5'
                           kapt 'androidx.room:room-compiler:2.2.5'
                           implementation "androidx.room:room-ktx:2.2.5"
                           
                           // Lifecycle
                           implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'
                           kapt 'androidx.lifecycle:lifecycle-compiler:2.2.0'
                           
                           }
                        

Step 8 : Continue adding the below codes to the gradle.properties file, mainly to avoid importing library conflicts.


                     android.enableJetifier=true
                       

Step 9 : Now, open the AndroidManifest.xml and add the below permissions to it.

<uses-permission android:name="android.permission.INTERNET" />
                        <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
                        <uses-permission android:name="android.permission.RECORD_AUDIO" />
                        <uses-permission android:name="android.permission.DISABLE_KEYGUARD" />
                        <uses-permission android:name="android.permission.CAMERA" />
                        <uses-permission android:name="android.permission.READ_PHONE_STATE" />
                        <uses-permission android:name="android.permission.WAKE_LOCK" />

                       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"'
                        }
                        }
                        
                       

Initializing the MirrorFly Video Call SDK

You require some critical data for the video call SDK to operate properly. Thus, you need a ChatSDK builder class to provide data to call SDKs.

Now, add the below lines in the oncreate() method of your application class,

Argument Description Type
CALL_UI_ACTIVITY Class Activity which needs to be invoked during incoming call. when a incoming call is received Call sdk will start this activity with the call details

                                 @Override
                                 public void onCreate() {
                                 super.onCreate();
                                 //Initialize call manager
                                 CallManager.init(this);
                                 //set your call activity
                                 CallManager.setCallActivityClass(CALL_UI_ACTIVITY.class);
                                 CallManager.setMissedCallListener((isOneToOneCall, userJid, groupId, callType, userList) -> {
                                 //show missed call notification
                                 });
                                 
                                 CallManager.setCallHelper(new CallHelper() {
                                 @NotNull
                                 @Override
                                 public String getDisplayName(@NotNull String jid) {
                                 return ContactManager.getDisplayName(jid);
                                 }
                                 @Override
                                 public String getNotificationContent(@NonNull String callDirection) {
                                 return CallNotificationHelper.getNotificationMessage();
                                 }
                                 @Override
                                 public boolean isDeletedUser(@NonNull String jid) {
                                 return ContactManager.getProfileDetails(jid).getContactType() == ContactType.DELETED_CONTACT;
                                 }
                                 @Override
                                 public void sendCallMessage(@NotNull GroupCallDetails details, @NotNull List users, @NotNull List invitedUsers) {
                                 CallMessenger.sendCallMessage(details, users, invitedUsers);
                                 }
                                 });
                                 }
                         
                           

Setting Up Your Call Activity

In your manifest, you need to define the Call UI Activity as given below,


                        <activity
                        android:name="YOUR_CALL_ACTIVITY"
                        android:configChanges="screenSize|smallestScreenSize|screenLayout|orientation"
                        android:excludeFromRecents="true"
                        android:launchMode="singleTask"
                        android:resizeableActivity="false"
                        android:screenOrientation="portrait"
                        android:supportsPictureInPicture="true"
                        android:showOnLockScreen="true"
                        android:turnScreenOn="true"
                        android:taskAffinity="call.video"
                        tools:targetApi="o_mr1" />
                        

Now, to configure the call activity you can call the below method on your call activity onCreate(),


                        CallManager.configureCallActivity(ACTIVITY);
                        

If you wish to notify the call SDK to remove the ongoing call notification, call the below method on onStart() from your activity.


                        CallManager.bindCallService();
                        

To notify the call SDK to show the ongoing call notification, must call the below onStop() method from your call activity.


                        CallManager.bindCallService();
                        

Make a Call Using Both Voice & Video Feature

To make or receive calls, the SDKs need permissions for both audio and video as given below,

Need of Runtime Permissions

You require a below permission to make a voice call


                            Manifest.permission.RECORD_AUDIO 
                            Manifest.permission.READ_PHONE_STATE 
                           

To check for the audio permission, you can use this below method,


                           CallManager.isAudioCallPermissionsGranted(); 
                       
                           

The same way to make a video call you require the below permission,


                              Manifest.permission.RECORD_AUDIO 
                              Manifest.permission.CAMERA 
                              Manifest.permission.READ_PHONE_STATE 
                              

To check for a video call permission you can use the below mentioned method,


                           CallManager.isVideoCallPermissionsGranted(); 
                           
Arguments Type Description
TO_JID String jid of the call receiver
CALLBACK CallActionListener callback to observe the action status

Making a Video Call

As soon as the permissions are checked, you can use the following codes to make a one-to-one video call to get connected with another user.


                              CallManager.makeVideoCall("TO_JID", (isSuccess, message) -> { 
                              }); 
                              

Making a Group Video Call

To make a Group video call, you can use the following codes to add group video call functionality,


                        CallManager.makeGroupVideoCall(JID_LIST, GROUP_ID, (isSuccess, message) -> {         
                        }); 
                              

Add Participants to the Call

Once, the call is connected you get access to add users to the ongoing call using the below codes:

Arguments Type Description
JID_LIST List jid list of the callee's

                              CallManager.inviteUsersToOngoingCall(JID_LIST);         
                              

Receiving an Incoming Voice/Video Call

If your android device’s version is greater than or equal to Android 10 (API level 29), your call SDK will notify you about every incoming call you receive. Otherwise, the set activity will get started during the SDK initialization using the CallManager.setCallActivityClass() method.

Answer the Incoming Call

Whenever a user (callee) accepts an incoming call, the below given two primary actions are performed :

  • The call will get answered
  • The caller will be notified about the call status as the call has been accepted by the caller

Hence, the below codes will be used to achieve the same:

Arguments Type Description
CALLBACK CallActionListener callback to observe the action status

                                 CallManager.answerCall((isSuccess, message) -> { 
                                 });
                              

Decline the Incoming Call

Whenever the callee declines a call without answering it, the below activities will take place :

  • The call connection will get stopped
  • The caller will be notified as the call has been declined

You can use the below codes to establish this process,


                           CallManager.declineCall();
                           

Disconnect the Ongoing Call

To disconnect an ongoing call, the user needs to follow the below codes,


                                   CallManager.disconnectCall();
                              

Final Words!

However, this tutorial has shown you an insight on the fundamental features and functionalities of a video call application with the integration of MirrorFly SDKs, there are much more available to explore with us. This includes,

  • Call History
  • Auto-reconnect
  • Adaptive Frame & Bitrate
  • Video Frame Capture
  • Media Storage
  • Call Signaling and more.

If this interests you, click here to explore.

Looking To Build a JavaScript Video Chat App?

Build a Video Chat experience by integrating real-time video, chat and voice features into any iOS, Android and Web App.

  • Average API response 3s
  • 100ms worldwide latency
  • 1 Billion+ Conversations
Try it free
#
Ready to Get Started with Our FREE Chat APIs?

Create immersive chat, video & voice calling experiences that skyrocket engagement and increase your app stickiness with our APIs & SDKs.

  • Dedicated Cloud Server
  • API Response 3 Seconds
  • 99.999% Uptime SLA
Try it free *No Credit Card Required Contact Sales