How to build a Video Conferencing App for Android with EnableX APIs

TechTalks

Video-Conferencing-Android-App

Technology has changed the way businesses operate, and never in history has that change occurred so fast.

It’s even more evident with the rising trends of social distancing, remote working, and global reach. If at all you are a techie who’s trying to get things done promptly, or a geek who wants to stay updated, or just someone who is simply curious about what’s the next update in technology, then this blog could help add a few more feathers to your expertise.

Video Conferencing Infrastructure

It is a known fact that video conferencing or VC is a communication medium through which people (two or more) connect virtually via audio and video technologies. The backend of a video conferencing application consists of two major components:

Server: Your application on the device acts as a client which captures user requests via UI and sends requests to the server to carry out respective action with the help of Server APIs. These requests typically consist of creating a Room on the server where the conference will take place and providing access token to everyone who wants to join the conference, with access roles (moderator or participant).

Client: Now you can connect to the room using token received from the server. Use the token to join the room, publish your media stream, receive other participants’ media stream and perform other activities in the video conferencing session with the help of Client APIs.

This is how a video conferencing application works in the backend and while it may look simple, it requires a lot of things to be taken care of, including a hosting server.

Fortunately, we have cloud-based solutions available that provide either complete solutions or necessary toolkits to develop such video conferencing applications quickly.

Understanding EnableX

We are going to build our application using EnableX – a cloud-based communications platform for modularly implementing various communication channels like video/audio/SMS/chat in your mobile application or website. Built on a carrier-grade platform, it offers developers with full stack of communications APIs and all the necessary toolkits to develop innovative and engaging communication experience.

EnableX provides Toolkits/SDKs for web, iOS and android, hence offering a complete omni-channel and omni-device experience.

So, let’s embark upon this journey of developing a video conferencing app in Android and turn your smartphone “smarter” 😀.

Prerequisites

  1. A basic-to-intermediate understanding of Java and Android SDK
  2. EnableX App Credentials: Create an EnableX.io developer’s account.
    Once registered, create a project and get App credentials containing APP_ID and APP_KEY generated against the project.
  3. Android Studio 3 or above and Android devices 6 or above.
  4. Download the latest version of EnableX Android SDK.

The downloaded Android Toolkit/SDK contains the following major classes that are responsible for conducting an end-to-end RTC session:

  1. EnxRtc: This Class contains methods to connect to a room and join the room.
  2. EnxRoom: This Class contains methods to handle operations within a room. e.g. connection of End-Points to EnableX Room, publishing & subscribing to streams etc.
  3. EnxStream: This Class handles all Media Stream related functions. For e.g., initiate, configure and transport streams to and from EnableX Media Servers, receive stream to be played etc.
  4. EnxPlayerView: This Class is used to display the video stream on a EnxPlayerview.

Learn more about EnableX basics on Enablex official developer documentation

Let’s Start Building

  1. Set Up New Project

    1. 1.1. Open Android Studio and select – Start a new Android Studio project.
    2. 1.2. On the Choose your project panel, select – Phone and Tablet > Empty Activity, and then click Next.
    3. 1.3. Click Finish. Follow the on-screen instructions if you need to install any plug-ins.
  2. Add Project Permissions

    Add project permissions in the /app/src/main/AndroidManifest.xml file for device access according to your needs:

    
                     <uses-permission android:name="android.permission.CAMERA" />
                     <uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" />
                     <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
                     <uses-permission android:name="android.permission.RECORD_AUDIO" />
                     <uses-permission android:name="android.permission.INTERNET" />
                     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
                     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
                     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
                     <!--EnableX Sdk requires Bluetooth permission incase users are using Bluetooth devices-->
                    
                     <uses-permission android:name="android.permission.BLUETOOTH" />
                     <uses-permission android:name="android.permission.BLUETOOTH_ADMIN"  /> 
                     <!--EnableX Sdk requires wakelock permission incase users are using proximity sensor--> 
                    
                     <uses-permission android:name="android.permission.WAKE_LOCK" />
                    
                     <uses-permission android:name="android.permission.FOREGROUND_SERVICE"  />
                    
  3. Integrate the SDK

    Edit the /build.gradle for your project and add the following code snippet to the allprojects.repositories section:

    
                    allprojects {
                        repositories {
                             maven  {
                                 url  "https://dl.bintray.com/enablex/maven" 
                            }
                        }
                    }
                  
                 

    Modify /app/build.gradle for your module and add the following code snippet to the dependencies section:

                    dependencies {
                        ...
                        //EnableX SDK for audio and video call
                       implementation 'com.enxrtc:Enx-Rtc-Android:1.8.2'
                      }
                    
    
  4. Generate Access Token

    As explained above, a user requires a unique Access Token to connect to a room. The token is requested by the Application Server using RESTful APIs – Server API. Please note that you require EnableX application credentials (APP_ID and APP_KEY) to execute the following Server APIs.

    1. 4.1. Create a video Room using following Server API https://openapi.enablex.io/video/v1/api-docs/#/Rooms/createRoom
    2. 4.2. Create Token for joining the Room using Room ID as received above https://openapi.enablex.io/video/v1/api-docs/#/Rooms/createToken
    3. 4.3. Click Finish. Follow the on-screen instructions if you need to install any plug-ins.
  5. Start Video Call

    We have provisioned a Video Room on the EnableX server and created a token to access it. Now we can implement the actual video logic in the VideoConferenceActivity.

    1. 5.1 Create a UI for this VideoConferenceActivity. Refer to the .xml file for creating a layout.
    2. 5.2 Implement onCreate() method in the VideoConferenceActivity to perform the following activities:
      1. 5.2.1 Initialize enableX SDK by creating EnxRtc object
      2. 5.2.2 Join the room
      3. 5.2.3 Setup local video stream
      4. 5.2.4 Publish local stream
      5. 5.2.5 Subscribe remote stream
    • Initialize enableX SDK by creating EnxRtc object
      Create an instance of EnxRtc Class to initialize the EnableX SDK.

      
                                  EnxRtc mEnxRtc = new EnxRtc(activity, mEnxRoomObserver,
                                  mEnxStreamObserver);
                              

      Parameters:

      • activity: The current class instance of VideoConferenceActivity mEnxRoomObserver: Event listener for events related to the ongoing conference session in the Room.
      • MEnxStreamObserver: Event listener for events related to the media stream in the Room.
      • MEnxStreamObserver: Event listener for events related to the media stream in the Room.
    • Join the Room
      Execute joinRoom() method on enxrtc instance to join the video conference. JoinRoom() method returns local stream instance which is used to publish the user’s local media in the Room. This basically means that once the user has joined the video conference, her video/audio stream becomes available to everyone in the conference.

      
                                  EnxStream localStream = enxRtc.joinRoom(mToken, mPublishStreamInfo, mRoomInfo, mAdvanceOptionsInfo);
                              

      Parameters:

      • – mToken: The token as received in Step 4 above.
      • – mPublishStreamInfo: Event listener for events related to the media stream in the Room.
        {
                                            "audio": true,
                                            "video": true,
                                            "data": true,
                                            "framerate": 30,
                                            "videoSize": {
                                            "minWidth": 320,
                                            "minHeight": 180,
                                            "maxWidth": 1280,
                                            "maxHeight": 720
                                            },
                                            "audioMuted": false,
                                            "videoMuted": false,
                                            "name": "shashank",
                                            "audioOnlyMode": false
                                        }
                                        
      • mRoomInfo: JSON Object containing Room information as shown below:
        
                                            {
                                                "allow_reconnect": true,
                                                "number_of_attempts": 3,
                                                "timeout_interval": 15,
                                                "activeviews": "view",
                                                "playerConfiguration": {
                                                "audiomute": true,
                                                "videomute": true,
                                                "bandwidth": true,
                                                "screenshot": true,
                                                "avatar": true,
                                                "pinned": true,
                                                "iconColor": -1237980,
                                                "iconHeight": 30,
                                                "iconWidth": 30,
                                                "avatarHeight": 200,
                                                "avatarWidth": 200
                                                },
                                                "forceTurn": false,
                                                "chat_only": false
                                            }
                                            
                                        
      • mAdvanceOptionInfo: JSON Array used to set advanced options like battery updates in the room as shown below:
        
                                        [
                                        {
                                        "id": "battery_updates",
                                        "enable": true
                                        },
                                        {
                                        "id": "notify-video-resolution-change",
                                        "enable": true
                                        }
                                    ]
                                    

        The method joinRoom() returns localStream which is stored globally and needs to be published in the Room after user is successfully connected to the Room ( onRoomConnected callback).

    • Setup local video stream
      To start a local video (that is to see yourself on the screen), you need to get enxplayerview instance from local stream and add this enxplayerview into your view which is defined in xml.

      
                                  EnxPlayerView localvideo = localStream.mEnxPlayerView
                                  moderator.addView(localvideo)
                              

      moderator is frameLayout in the VideoConferenceActivity xml.

    • Publish local stream
      Use enxRoom.publish(localStream) method to publish local stream to the connected roomAfter the user is connected to the Room, you can call the publish () method in the callback onRoomConnected(EnxRoom enxRoom, JSONObject roomMetaData)Once the local stream is published to the Room, all participants are notified with callback onStreamAdded(EnxStream stream)

      enxRoom.publish(localStream);
    • Subscribe remote stream
      So far, we have ensured that the user is connected to the Room and has published his/her local stream in the Room. Now the user must also receive media stream from other participants connected to the Room.They must subscribe to each stream individually to receive it.The publish () method triggers a callback onStreamAdded(EnxStream stream) notifying everyone that a new stream has entered the Room so to receive the stream you need to subscribe it using subscribe(remotestream) method.

      
                              enxRoom.subscribe(stream);
                              
    • Setup remote video stream
      EnableX SDK provides pre-defined Video Grid for playing all the Remote Streams received at the Client end point.The RecyclerView allows you to play the most active media streams (Active Talkers in the Room) in a rotating manner. The VideoConferenceActivity needs to implement EnxActiveTalkerViewObserver and set observer to handle active talker view by calling
      enxRoom.setActiveTalkerViewObserver(EnxActiveTalkerViewObserver enxActiveTalkerViewObserver)

      
                                      public class VideoConferenceActivity extends AppCompatActivity                    
                                      implements EnxActiveTalkerViewObserver{
                          
                                  @Override
                                      public void onActiveTalkerList(RecyclerView recyclerView) {
                          
                                          if (recyclerView == null) {
                                              participant.removeAllViews();
                                          } else{
                                              participant.addView(recyclerView);
                                          }
                                      }
                                  }
                                 

      Note: participant is frameLayout in the VideoConferenceActivity xml.

      We have now implemented a video conferencing application which allows users to create or join a video session, see and listen to each other.

      However, no video conferencing application is complete without the controls mentioned in the table below. While this blog focuses on the basic features to get you started and help you create a video conferencing app “quickly and easily”, you can still explore more features and become a Pro! I have mentioned some references towards the end of the blog.

      Let’s quickly sum up important control features in a video call:

      Feature API
      Mute Audio localStream.muteSelfAudio(true);
      Unmute Audio localStream.muteSelfAudio(false);
      Mute Video localStream.muteSelfVideo(true);
      Unmute Video localStream.muteSelfVideo(false);
      Switch Camera – Front and Rear localStream.switchCamera();
      Switch Audio Device (Earpiece/Speaker/Wired Headset/Bluetooth) subject to availability enxRoom.switchMediaDevice(“audio-device-name”);
  6. Build and Test on Device

    It’s time to test our application!

    • Go to Android Studio.
    • Make sure your Android device is plugged in
    • Click on Run to build the application on your device.

    Remember to build the application on two devices to start the video call.

    If you can call yourself from one device to another then, super! You just created a video-conferencing application with a little help from EnableX 😊

    There is so much more you can do with the EnableX Toolkit! Don’t stop here. Explore and build more!

    Check out more features on EnableX Android Documentation and find the reference code for this blog in Github Application Sample For Android.

    Happy Coding!

Avatar

Know more