This guide will walk you through the steps for adding a Kaltura video player to your Android mobile application, using the Kaltura Player. The library is a super-collection of all Kaltura Playkit libraries, which include the Player, Kaltura Analytics, and various Providers that can access the Kaltura Backend. Using the Kaltura Player library makes it easier to take advantage of all player capabilities.
In this Kotlin tutorial, you’ll learn how to import the Kaltura Player SDK, find the necessary credentials, and load the player with your Entry ID of choice. Because the player is focused on performance and giving you the simplest integration possible, it does not contain a UI. That being said, this guide will show you how to listen to events in order to manage the player state, as well as examples for adding play/pause buttons and a slider to the player.
If you prefer to see a Java sample, click here.
If you’re looking for the iOS guide, click here.
You’ll need two things:
- Your Kaltura Partner ID, which can be found in the KMC under Settings>Integration Settings
- Any video entry, which can be found in the KMC as well.
Begin by creating a new project in Android Studio. For this guide we chose the Fullscreen Activity Preset, to make it simpler to view the player in full-screen:
FullScreenActivity.kt comes pre-loaded with functions for showing and hiding the Action Bar and the Controls menu, to achieve the full-screen functionality.
Depending on your Compile Settings, you might get an error about Invoke-customs or supported release versions. In that case should add java 1.8 to your compile options in build.gradle
In your build.gradle add the Kaltura-Player dependency:
FullScreenActivity.kt, import the following:
Static variables in Kotlin are placed in the Companion Object, which acts as an inner singleton class that gives access to its members as direct members of the class.
In our Companion Object, we’ll declare the log-tag and Partner ID:
For starters you’ll need the ID of the entry, or video, that you want to display in the player. You can find this in the KMC under Content.
You’ll need an object for the Player, and you’ll also need to hold onto the Player State (for playing and pausing):
Create a new function called
loadPlaykitPlayer. This function will:
- Set configuration and behavior (auto-play set to True)
- Initialize the player
- Create a view that is determined by the size of the player using
fullscreen_contentobject that was created by the Fullscreen preset
- Load the media entry inside the player using OVP Provider Object
- Use built in Log object to document an error if loading the entry fails
- Set the global Player to the new one if nothing fails
The provider helps the player access the Kaltura backend. The entryId is checked against the API, and there is an option to pass a Kaltura Session, which is always recommended when creating a player. If your application doesn’t already generate a Kaltura Session, read this to learn more.
Create a function called
apply keyword in Kotlin will run the code block and pass the receiver, or in this case,
Create another function called
addPlayerStateListener. It sets the state of the player any time it changes and logs the state change.
Let’s put all the pieces together. In the
onCreate function, you’ll need to call the functions we just created:
We removed the
setOnTouchListner for the button, and ended up with something that looks like this:
If you run the app now, you should see the player, and your video should start automatically. If you turn off the screen lock, you’ll see that the video becomes fullscreen and that the buttons disappear. Notice however that you have no way of pausing the video. We’ll need play and pause buttons.
The Fullscreen project has already created two buttons for us. In this example we removed one of the buttons and called the other one playPauseButton. We also turned it into an imageButton (instead of text) so that we can use proper images from the Exo image library that we imported earlier.
addPlayPauseButton sets the button to rely on Player state in order to know which image to show. Meaning if the video is playing, the button should show a pause icon, and when the button is clicked, the video pauses and the image turns to a play icon.
We made a few other changes to the activity XML, like turning the view into a
LinearLayout. See full XML: