This is a sad story

I am a programmer, I have a long distance relationship with my girlfriend, so sad!!

During one video session, she suddenly said, “It’s been a long time since we went to the movies together…”

“Er… I think so. After all, it’s hard to watch a movie together because we live so far away.

Girlfriend “oh”, we fell into silence.

The video ends with a sad mood. Yeah, it’s been a long time since I’ve been with her.

It occurred to me that there are many apps for watching movies together. Looked for, not a few indeed, like the APP popularity of low light is very fire. I downloaded one and found it was quite interesting and could really solve the need to watch movies together.

So “pa” once, brainwave, coax girlfriend happy method has, oh yeah!! I can implement a demo myself!

As a quality programmer, given the spirit of professional exploration and experience in ZEGO architecture technology, it is quite possible to think of implementing a demo with a similar function.

Said to do, stay up all night small case, made a demo all night, the effect is as follows:

​

The front laid so long, I believe you are not to see me drying dog food (dog head to protect life). Now let’s take a look at how I implemented this “watch a movie together” function to please my girlfriend. The article is a bit long, but it is definitely dry. You can read it patiently.

Two, start preparing

Before we start implementing the movie-watching demo, we need to do some pre-development work:

01 Preparing for the Development Environment

The first step is to prepare the development environment. You need to ensure that the development environment meets the following requirements:

  • Android Studio 2.1 or later.
  • Android SDK 25, Android SDK build-tools 25.0.2, Android SDK platform-tools 25.x.x or later.
  • Android 4.1 or later, and support audio and video Android devices.
  • Android devices are already connected to the Internet.

02 Account Registration

After setting up the development environment, we need to go to ZEGO official website to register an account, enter the administrative console and create the application, and obtain the AppId and AppSign required for development.

For details on how to create an application, see this article: Console Creation Project Process.

Three, implementation process introduction

01 Interface Specifications

First, the API input and output specifications of ZEGO are analyzed. According to the API usage documentation, the call interface format is as follows:

​

Create ZegoExpressEngine single column object as a column, each parameter is detailed parse its role. Each interface describes its role and usage.

02 Watch movies together project development

Now everything is ready to go. Follow me to see how to realize the project of watching movies together.

The project is divided into two parts: the server for playing local movies and the client for streaming movies. Each section is described in detail below.

The maximum number of users is set at 3, and the server takes up one, so the client can only watch movies online for two people at a time (Mimi, make sure there is no third party between you two).

1. Server — implementation process of the movie server

  • Step 1: Create ZegoExpressEngine:
/** Define SDK engine object */ ZegoExpressEngine engine; /** Fill in appID and appSign */ long appID =; /** Please register and obtain from the official website. The format is 123456789L */ String appSign =; / * * 64 characters, please register through the website to receive, format for "0123456789012345678901234567890123456789012345678901234567890123" * / / * * create engine, use the test environment, GENERAL scenario access. * / engine = ZegoExpressEngine createEngine (appID appSign, true, ZegoScenario. GENERAL, getApplication (), null);Copy the code
  • Step 2: Enable the custom video collection function.
ZegoCustomVideoCaptureConfig videoCaptureConfig = new ZegoCustomVideoCaptureConfig(); / / select RAW_DATA type video frame data videoCaptureConfig bufferType = ZegoVideoBufferType. RAW_DATA; engine.enableCustomVideoCapture(true, videoCaptureConfig, ZegoPublishChannel.MAIN);Copy the code
  • Step 3: Set the custom video collection callback object and implement the corresponding method:
/ / a callback object itself as a custom video acquisition SDK. SetCustomVideoCaptureHandler (new IZegoCustomVideoCaptureHandler () {@ Override public void OnStart (ZegoPublishChannel channel) {onStart(ZegoPublishChannel channel) {onStart(ZegoPublishChannel channel) {onStart(ZegoPublishChannel channel) {onStart(ZegoPublishChannel channel) { } @override public void onStop(ZegoPublishChannel channel) {Override public void onStop(ZegoPublishChannel channel) {Override public void onStop(ZegoPublishChannel channel) { }});Copy the code
  • Step 4: Select the movie to play and set the room ID. Then log in to the room and will receive a custom video capture callback notification to start collecting:
/** create user */ ZegoUser user = new ZegoUser("user1"); /** engine. LoginRoom ("room1", user);Copy the code
mZegoMediaPlayer.setVideoHandler(new IZegoMediaPlayerVideoHandler() { @Override public void onVideoFrame(ZegoMediaPlayer  zegoMediaPlayer, ByteBuffer[] byteBuffers, int[] ints, ZegoVideoFrameParam zegoVideoFrameParam) { } }, ZegoVideoFrameFormat.RGBA32);Copy the code
  • Step 5: When the client sends a notification to start playing the movie, start pushing the stream (movie stream), preloading the movie, and start playing the start().
/ * * * / engine start pushing flow startPublishingStream (" stream1 ");Copy the code
mZegoMediaPlayer.loadResource(path, new IZegoMediaPlayerLoadResourceCallback() { @Override public void onLoadResourceCallback(int code) { if (code == 0) { mZegoMediaPlayer.start(); if (callback ! = null) { callback.onLoadResourceCallback(code); }}}});Copy the code
  • Step 6: call send video frame method sendCustomVideoCaptureRawData provide video frame data to the SDK.
ZEGO SDK int totalDataLength = byteBuffers[0]. Capacity (); if (tempByteBuffer == null || tempByteBuffer.capacity() ! = totalDataLength) { tempByteBuffer = ByteBuffer.allocateDirect(byteBuffers[0].capacity()).put(byteBuffers[0]); } else { tempByteBuffer.clear(); tempByteBuffer.put(byteBuffers[0]); } ZegoSDKManager.getInstance().getStreamService().sendCustomVideoCaptureRawData(tempByteBuffer, tempByteBuffer.capacity(), zegoVideoFrameParam);Copy the code
  • Step 7: When the client has no audience in the room or the server quits playing the room, the user will receive the custom video collection callback notification to stop the collection.

2, client – pull streaming film client implementation process

First of all, the client for playing movies has the following functions:

  • A, B audience’s movie pull render, movie play \ pause.
  • Push and pull flow of audience audio and video at A and B ends, flip switch of camera and switch of microphone.
  • Send and receive real-time messages from audience’s rooms at A and B ends.

Next, we will introduce the specific functions mentioned above:

(1) Process introduction for movie playing function

  • The audience at end A successfully logs in to the room through the RoomID set in the background. If the entered RoomID does not exist, it will judge that end A is the first person in the room and exit the room, indicating that the room does not exist. Or if the room is full, the login fails and a message is displayed indicating that the room is full.

    * Click the movie play button setRoomExtraInfo() to notify the message

    * Background mobile phone receives the callback of onRoomExtraInfoUpdate() to play the movie

    * The audience terminal will receive the push stream of movie playing and obtain the push stream StreamID for pulling stream playing

  • Terminal B enters the playing room by entering RoomID to perform the pull-flow display of the movie:

/** * Start pull stream, set the remote pull stream render view, use the SDK default view mode, Geometric scaling of filling the entire View * below play_view for UI interface SurfaceView/TextureView/SurfaceTexture object * / engine. StartPlayingStream (" stream1 ",  new ZegoCanvas(play_view));Copy the code
  • AB audience can use setRoomExtraInfo(String roomID,String Key,String Value, NULL) to play/pause the video media.
  • AB audience can use setRoomExtraInfo(String roomID,String Key,String Value, NULL) to play/pause the video media.

Watch a movie together setRoomExtraInfo

  1. key: roomInfo
  2. Value: 0, 1, 2, or 3
  3. 0: load start movie
  4. 1: The movie is playing
  5. 2: The movie is paused
  6. 3: The room has been closed

(2) For the process of audio and video push and pull flow

  • Push and pull stream via ZEGO audio and video service
  • After entering the room at end A, the audience will stream to ZEGO audio and video cloud service. They need to generate unique StreamID by themselves, and then start to preview and stream. After the audience at the B end enters the room, they will receive the stream update notification from SDK, from which the audience at the B end is selected to StreamID for pulling stream
  • After entering the room, the audience of end B will stream to ZEGO audio and video cloud service. They need to generate unique StreamID themselves, and then start to preview and stream. At the same time, StreamID, the audience flow at the A end, was selected for pulling flow
  • Audience at the AB end can control their own camera flipping, camera on/off, and microphone on/off:
Front Specifies whether to use a front-facing camera. True: Use a front-facing camera. False indicates to use the rear camera expressEngine. UseFrontCamera (front); // Enable/Disable camera enable Whether to enable the camera. True: Enable the camera. False indicates close camera expressEngine. EnableCamera (enable); Enable Whether to enable the microphone. True: Enables the microphone. False indicates mute microphone (closed) expressEngine. MuteMicrophone (! enable);Copy the code

Both are related to push and pull flows. Take the flow of user A pulling user B as an example, and the flow is shown as follows:

​

For more detailed implementation process, please refer to the official audio and video implementation process.

(3) Send and display of real-time chat messages in the room

  • AB audience can send messages in the room;
  • Call the sendBroadcastMessage interface to send broadcast messages to b-end viewers in the same room. The length cannot exceed 1024 bytes. Sent via onIMSendBroadcastMessageResult callback get news results;
// Send a broadcast message, Each login user in room will receive this message by onIMRecvBroadcastMessage callback the sender will not receive the callback 】 engine. SendBroadcastMessage (roomID, MSG, New IZegoIMSendBroadcastMessageCallback () {/ * * send broadcast messages result callback processing * / @ Override public void onIMSendBroadcastMessageResult (int ErrorCode, long messageID) {// Successful or failed handling of sending message results}});Copy the code
  • Implement onIMRecvBroadcastMessage callback in IZegoEventHandler. After the sender successfully sends a broadcast message, other users in the same room receive related information, including message content, message ID, sending time, and sender information.
Public void onIMRecvBarrageMessage(String) ** @param roomID * @param messageList Specifies the list of received messages RoomID, ArrayList<ZegoBarrageMessageInfo> messageList){// Handle messages sent by other users}Copy the code
  • Send The received message is displayed on the UI.

Iv. Effect presentation (download demo source code)

01 Play the renderings of the movie terminal

​

(Movie player)

02 Viewer-side renderings

​

(Moviegoers)

​

(Schematic diagram of movie playing)

The attached demo is for everyone to experience and watch the movie together. There are two parts. The installation password is 1:

1) Server Demo: movie server

2) Client demo: Watch movies together

The installation method is as follows:

1) Start server demo first, select movie to set room ID;

2) The client demo enters the movie room by entering the set room ID.

Source code download: Baidu network disk please input extraction code (password: QREP)

Five, the conclusion

Newton once said: I can see far, because I stand on the shoulders of giants!

Based on the audio and video functions of ZEGO technology, it is very simple to develop a demo of “Watch movies together” after some operation. Generally speaking, it is very simple to achieve.

Ways to make your long-distance girlfriend happy are at hand. Take action and experience the fun of audio and video development.