View Course Path

How to play a Video File in Android Studio using VideoView – Full Code Tutorial and Explanation

What will you learn?

  1. How to use a VideoView element to play videos on your Android app. If needed, you can read more about the VideoView widget in detail before proceeding.

Note: Find the full code of the project towards the end of the post. Read the entire post for further clarification and explanations.


Building the Interface of our Video Player Android app

Of all our apps that we have created up until now, you will see that this has the simplest of interfaces. We need two elements in our Activity.

Start with an Empty Activity

Next, drag and drop a button and then a VideoView. If you don’t want to keep adjusting, and make the app work for all devices and orientations, drop in a LinearLayout before you drop your elements. If you have forgotten why we are using the LinearLayout here, then give this article a quick read. It tells us about the different layouts in Android Studio and which ones to use when.

Components Used:

  1. Layouts > LinearLayout
  2. Widgets > Button
  3. Images > VideoView

Here’s a screenshot of the Interface we have built. You’ll find the full code in the XML file towards the end of the article.

Attaching a function to the button

Once you highlight the button, a list of its properties comes up on the right-hand side. Once here, find the label ‘onClick‘ and in the input value, write down playVideo. This is a custom function that we will create in the MainActivity.java file.

Screenshot of our User Interface

Adding our video file in the Android App

This is just like how we did in our tutorial for playing an audio file using the MediaPlayer class. Firstly, on the left-hand side of our Android Studio, make sure we are on the PROJECT sidebar and under Android. From here, you have to go to app > res > raw. If, for whatever reason, you don’t have the raw directory, then right-click on the res folder and create a new directory with ‘raw’ as its name.

Once here, just right-click on the ‘raw‘ directory and click on ‘Reveal in Finder‘ if on MacOs and ‘Show in folder‘ if on Windows. I may be wrong about the Windows part, though, but you can figure it out.

This is the folder where you paste your video file. 

Alternatively, if you copy your video file, you can right-click on the raw directory and click on paste. I find the drag and drop method to be more comfortable, though.

Just like when you are adding your audio file, remember to give a unique name with the extension and all of it in small cases.

Coding the functionality of the video player android app

Now here is the exciting part; this isn’t like how we coded our Audio Player file. It’s a bit different.

Step 1: Creating objects to our classes

We first create a new object of a class in the AppCompatActivity class.

VideoView vid;
MediaController m;

Step 2: Connecting our object with our elements

Next, we have to connect this object with the VideoView we used in building the user interface.
We do this inside the onCreate function by the following code.

vid = (VideoView)findViewById(R.id.videoView);

Step 3: Playing the video

We first create the function playVideo.

public void playVideo(View v) { //Your code here }

In that function, we are setting a new MediaController.

m = new MediaController(this);

Next, we are getting the path of our video file. So go ahead and declare a new variable of data type String. To find the path of the video file, right-click on it and hit on Copy path address. And paste this address inside double-quotes. You can use this method, but we will use an alternative way.

String path = "/Users/aasemjs/AndroidStudioProjects/VideoPlayDemo/app/src/main/res/raw/trial.MOV";

An alternative way of doing this by the following code. It means the same thing, and either of the ways can be used.

String path = "android.resource://com.aasemjs.videoplaydemo/"+R.raw.trial;

Now, all we need to do is to set a new Uri and parse the string that we defined above. We set the videoUri in this set, and the file is ready to play.

Uri u = Uri.parse(path);

vid.setVideoURI(u);

vid.start();

Next, we need to deploy the app to our target device and watch the magic happen. For any confusion, refer to the full code below.

Check out some more of our tutorials on Android.

1 Play an Audio File using MediaPlayer class.

2 Simple Calculator App

3 Weight Conversion app

4 Study about different Layouts in Android and which one to use when.

The full code for our UI in the VideoPlayer App

The full code for the main functionality in the VideoPlayer App

Remember to change your package name at the beginning of the code!

Related courses for this will be up soon!

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

6 comments

  1. hello, i would like to ask since i’m not sure if I understood correctly. If I were to put the android:resource file instead of the sourcepath can I play the video still on my phone?

    1. also is it possible for the video to play right away once you open the application? I was thinking of making an app where you click a button that will redirect you to another activity that contains the video and the video will immediately play

      1. As soon as the application starts running, the code snippet in onCreate gets executed. So you need to place the code from (playVideo) over there.

        So you need to place the code in the onCreate function of your other activity.

    1. You need to troubleshoot this. Unfortunately, there’s no way for me to figure out why your video won’t run. Try these tips:

      1. Check if you added the video to the correct directory.
      2. Check that you named it appropriately as well. All small cases with the proper extension.
      3. Check whether you mentioned the correct address of the video into the path.
      4. Make sure you changed the package name when copy-pasting the full code into your Android Studio.

      If nothing works, then make a copy of your code on github and forward the link here. I’ll be glad to take a look at it!