Technical Blog | Build 1-on-1 video chat Android/Java app
Remote communication has become the most important part of communication after the pandemic. It's highly likely that it will play a significant role in the future too. Today's mobile applications often include voice or video calling functionality. But it's extremely complex and takes a lot of time to build. This is where Video SDK comes into the picture.
Video SDK is a platform that allows developers to create rich in-app experiences such as embedding real-time video, voice, real-time recording, live streaming, and real-time messaging.
Video SDK is available for JavaScript, ReactJS, React-Native, IOS, Android, and Flutter to be integrated seamlessly. Video SDK also provides a Pre-built SDK that enables the opportunity to integrate real-time communication with your application in just 10 minutes!
Let's create a one-to-one video calling app using Video SDK. But first, we need to create a Video SDK account and generate the token.
First of all, Your development environment should meet the following requirements:
Android Studio 3.0 or later.
Android SDK API Level 21 or higher.
A mobile device that runs Android 5.0 or later.
Letβs start by creating a new project. In Android Studio, create a new project with an Empty Activity.
Then, provide a name. We will name it as OneToOneDemo.
Add the repository to
settings.gradle file.Add the following dependencies in
build.gradle file.If your project has set , then set in the file to migrate your project to AndroidX and avoid duplicate class conflict.
In
/app/Manifests/AndroidManifest.xml, add the following permissions after </application>.We'll create two screens. The first screen will be
Joining screen that allows users to create/join the meeting, and another one is Meeting screen that will show participants like WhatsApp view.Our project structure would look like this.
You have to set as Launcher activity.
Create a new Activity named
JoinActivityThe Joining screen will include :
Create Button - Creates a new meeting.
TextField for Meeting Id - Contains the meeting Id you want to join.
Join Button - Joins the meeting with the
meetingId provided.In
/app/res/layout/activity_join.xml file, replace the content with the following.You need to create a field
sampleToken in JoinActivity that holds the generated token from the Video SDK dashboard. This token will be used in the Video SDK config as well as generating meetingId.On Join Button
onClick the event, it will navigate to MeetingActivity with token and meetingId.For the Create Button, under
createMeeting method we will generate meetingId by calling API and navigating to MeetingActivity with token and generated meetingId.Our App is completely based on audio and video commutation, that's why we need to ask for runtime permissions
RECORD_AUDIO and CAMERA. So, we will implement permission logic on JoinActivity.You'll get error, but don't worry. It will be solved automatically once you create .
We're done with the Joining screen now, and it is time to create the participant's view in the Meeting screen.
Create a new Activity named
MeetingActivity.In
/app/res/layout/activity_meeting.xml file, replace the content with the following.Copy required icons from and paste in your project's folder.
After getting the token and meetingId from
JoinActivity, we need to...Initialize VideoSDK
Configure VideoSDK with the token.
Initialize the meeting with required params such as
meetingId, participantName, micEnabled, webcamEnabled,participantId and map of CustomStreamTrack.Join the room with
meeting.join() method.We need to implement clicks for the following
Views:Mic Button
Webcam Button
Switch Camera Button
Leave Button
Add the following implementation:
To set up participant view, we have to implement all the methods of the
ParticipantEventListener Abstract Class and add the listener to Participant class using the addEventListener() method of Participant Class. ParticipantEventListener class has two methods :onStreamEnabled - Whenever a participant enables mic/webcam in the meeting, This event will be triggered and return Stream.onStreamDisabled - Whenever a participant disables mic/webcam in the meeting, This event will be triggered and return Stream.Add
MeetingEventListener for listening events such as Meeting Join/Left and Participant Join/Left.changeLocalParticipantView(isMiniView: Boolean) function first checks whether the video of a local participant is displayed as a MiniView or a LargeView.If the meeting has only one participant (local participant), then the local participant is displayed as LargeView.
When another participant (other than the local participant) joins,
changeLocalParticipantView(true) is called. As a result, the local participant is shown as MiniView, while the other participant is shown as LargeView.We need to release resources when the app is closed and is no longer being used. Override the
onDestroy with the following code:Tadaa!! Our app is ready. Easy, isn't it?
Install and run the app on two different devices and make sure that they are connected to the internet.
This app only supports 2 participants, it does not manage more than 2 participants. If you want to handle more than 2 participant then checkout our Group call example .
In this blog, we have learned what video SDK is, how to obtain an access token from the Video SDK Dashboard, and how to create a one-to-one video call app with the Video SDK.
Go ahead and create advanced features like screen-sharing, chat, and others. Browse Our Documentation.
To see the full implementation of the app, check out this GitHub Repository.
If you face any problems or have questions, Please join our Discord Community.
Like this project
0
Posted Nov 6, 2023
In this article, I wrote about how to build a 1-on-1 video Android app with Java using the Video SDK with proper SEO and meta tags.
Technical Blog | Build a Live Streaming App in React JS
Social Media Strategy for Business and Organization
Boost traffic to 15k/m in 3 months using AI + Human content
Blog Writing | Build vs Buy video KYC Infrastructure