Integrate Video for Android

This tutorial guides how to add video features to a conference.

Start the video

Layout modification

Edit the main_activity.xml with the following items:

<LinearLayout ...>
    ...

    <!-- Step 3. Put the layout changes for the video step here -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:id="@+id/startVideo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="start video" />

        <!-- Step 3.2. This layout will be upgraded in the stop video step -->

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="300dp">

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1">

            <com.voxeet.sdk.views.VideoView
                android:id="@+id/video"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1">

            <com.voxeet.sdk.views.VideoView
                android:id="@+id/videoOther"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </LinearLayout>
    </LinearLayout>

    <!-- Step 4. ...

</LinearLayout>

2. Modify the interface linking in the MainActivity class in MainActivity.java:

  • New methods for MainActivity:
public void onStartVideo() {

}

private void updateStreams() {

}

// add onClickListener for onStartVideo()
@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    binding.startVideo.setOnClickListener(_view -> onStartVideo());
  • Add the following code to the onCreate method:
@Override
protected void onCreate(Bundle savedInstanceState) {
    ...

    //adding the startVideo in the flow
    add(views, R.id.startVideo);
    add(buttonsInConference, R.id.startVideo);
    add(buttonsNotInOwnVideo, R.id.startVideo);
}

3. Add the following logic to the application:

  • In updateViews enable and disable buttons based on the own video state.
private void updateViews() {
    ...

    if (null != current) {
        if (current.isOwnVideoStarted()) {
            setEnabled(buttonsInOwnVideo, true);
            setEnabled(buttonsNotInOwnVideo, false);
        } else {
            setEnabled(buttonsInOwnVideo, false);
            setEnabled(buttonsNotInOwnVideo, true);
        }
    }
}
  • Use the following implementation for onStartVideo:
public void onStartVideo() {
    VoxeetSDK.video().local().start()
            .then((result, solver) -> updateViews())
            .error(error());
}
  • Use the following implementation for updateStreams:
private void updateStreams() {
    for (Participant user : VoxeetSDK.conference().getParticipants()) {
        boolean isLocal = user.getId().equals(VoxeetSDK.session().getParticipantId());
        MediaStream stream = user.streamsHandler().getFirst(MediaStreamType.Camera);

        VideoView video = isLocal ? this.binding.video : this.binding.videoOther;

        if (null != stream && !stream.videoTracks().isEmpty()) {
            video.setVisibility(View.VISIBLE);
            video.attach(user.getId(), stream);
        }
    }
}
  • Add handlers for StreamAddedEvent and StreamUpdatedEvent.
@Subscribe(threadMode = ThreadMode.MAIN)
public void onEvent(StreamAddedEvent event) {
    updateStreams();
    updateViews();
}

@Subscribe(threadMode = ThreadMode.MAIN)
public void onEvent(StreamUpdatedEvent event) {
    updateStreams();
    updateViews();
}

Stop the video

1. To modify the layout, edit the main_activity.xml file, adding the following content for Step 3.2:

<LinearLayout ...>
    ...
    <LinearLayout ...>
        ...

        <!-- Step 3.2. This layout will be upgraded in the stop video step -->
        <Button
            android:id="@+id/stopVideo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="stop video" />

    </LinearLayout>
    ...
</LinearLayout>

2. Modify the interface linking in the MainActivity class in MainActivity.java:

  • New method for MainActivity:
public void onStopVideo() {

}

// add onClickListener for onStopVideo()
@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    binding.stopVideo.setOnClickListener(_view -> onStartVideo());
}
  • Add the following code to the onCreate method:
@Override
protected void onCreate(Bundle savedInstanceState) {
    ...

    //adding the stopVideo in the flow
    add(views, R.id.stopVideo);
    add(buttonsInConference, R.id.stopVideo);
	add(buttonsInOwnVideo, R.id.stopVideo);
}

3. Add the following logic to the application:

  • Use the following implementation for onLogin:
public void onStopVideo() {
    VoxeetSDK.video().local().stop()
            .then((result, solver) -> updateViews())
            .error(error());
}
  • Add a handler for the StreamRemovedEvent:
@Subscribe(threadMode = ThreadMode.MAIN)
public void onEvent(StreamRemovedEvent event) {
    updateStreams();
    updateViews();
}