Using VideoViews
You use VideoViews(android.widget.VideoView) to play videos. In this section, you create a simple app in which a video is served from a web URL and shown in a VideoView. You have the option to control the video with controls that you create or with a MediaController(android.widget.MediaController). The example app uses both methods. First we’ll look at the basics.
A VideoView layout is often simple. Listing 21.5 shows a typical example. The desire to show a full screen video is common. The Hour21VideoView project contains this source code.
Listing 21.5 VideoView Layout
1: <VideoView android:id="@+id/VideoView01" 2: android:layout_height="match_parent" 3: android:layout_width="match_parent"> 4: </VideoView>
Loading a Video
After you declare the VideoView, you need to give the view a video to play and start the video. A video may be read from a local file or from a remote server. In both cases, you can use the setVideoUri() method of VideoView. That method takes a URI as a parameter. Creating a URI from a string is typical. Listing 21.6 shows a Uri class being defined from a String and the resulting Uri being set to the VideoView in line 3.
Listing 21.6 Assigning a Video to a VideoView
1: String videoToPlay = "http://bffmedia.com/bigbunny.mp4"; 2: Uri videoUri = Uri.parse(videoToPlay); 3: videoView.setVideoURI(videoUri);
You could use the same code in Listing 21.6 for reading a file from the SD card. Line 1 would change to include the location of a file:
String videoToPlay= Environment.getExternalStorageDirectory()+ "/Android/data/com. bffmedia/videos/bigbunny.mp4";
Environment.getExternalStorageDirectory() refers to the location of the SD card.
Starting, Pausing, and Positioning a Video
For controlling a video, the VideoView includes methods called start(), pause(), and seekTo(). The start() and pause() methods start and stop the video. The seekTo() method positions the video at a specific location and is based on milliseconds. Calling seekTo() with 10,000 positions the video at the tenth second. You can get the current position and duration of the video with the methods getCurrentPosition() and getDuration(). To skip ahead 10 seconds in the video, you use the following:
mVideoView.seekTo(mVideo.getCurrentPosition + 10000);
Listening for the States of a VideoView
Two listeners are unique to a VideoView: onPreparedListener() and OnCompletionListener(). Videos do not start playing immediately. First, they are downloaded and buffered. That is where the onPreparedListener() comes in. You can do something in your user interface before the video begins. When it is ready, you can do something else. For example, you can show a progress bar before the video starts and then hide it in the onPreparedListener().
The onCompletionListener() triggers when the video is done playing. It is an opportunity to repeat the video, start a new video, or change the user interface to prompt the user about what to do next.
To demonstrate the use of VideoViews, in this section you create an app with two activities. In MainActivity.java, there is a VideoView, a pause/play button, and a full screen button. The play/pause button controls the video. The full screen button opens the second activity. That activity, VideoActivity.java, plays the video in full screen and attaches a MediaController that provides native controls. Both MainActivity.java and VideoActivity.java are in the Hour21VideoView project.
You’ll use the OnPreparedListener() to know when the video is ready to play. Until that time, you’ll show a progress bar.
Listing 21.7 shows how to show a video. The OnPreparedListener() code begins on line 6. If the video is ready, the progress bar is hidden and the video plays. This occurs on lines 8–10.
Listing 21.7 Showing a Video
1: final VideoView videoView = (VideoView) findViewById(R.id.videoView); 2: final ProgressBar progressBar = (ProgressBar) findViewById(R.id.progressBar); 3: String videoToPlay = "http://bffmedia.com/bigbunny.mp4"; 4: Uri video = Uri.parse(videoToPlay); 5: videoView.setVideoURI(video); 6: videoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener(){ 7: public void onPrepared(MediaPlayer mp) { 8: progressBar.setVisibility(View.GONE); 9: videoView.requestFocus(); 10: videoView.start(); 11: } 12: });
In MainActivity.java, you can implement a play/pause button. To control the video, you use the start() and pause() methods of the VideoView.
The full screen button opens the VideoActivity. The code for VideoActivity is similar to the MainActivity code, but a MediaController is implemented.
Listing 21.8 shows the onCreate() method of VideoActivity(). A MediaController is defined in line 5. On line 6, that MediaController is set as the anchor of the VideoView, and on line 9, the VideoView sets its MediaController to the defined MediaController. This code creates and shows the VideoView with a MediaController attached.
See Figures 21.6 and 21.7 to see how these two activities show videos.
Listing 21.8 Showing a Video with MediaController
1: protected void onCreate(Bundle savedInstanceState) { 2: super.onCreate(savedInstanceState); 3: setContentView(R.layout.activity_video); 4: VideoView videoView = (VideoView) findViewById(R.id.videoView); 5: MediaController mediaController = new MediaController(this); 6: mediaController.setAnchorView(videoView); 7: String videoToPlay = "http://bffmedia.com/bigbunny.mp4"; 8: Uri video = Uri.parse(videoToPlay); 9: videoView.setMediaController(mediaController); 10: videoView.setVideoURI(video); 11: videoView.start(); 12: }
Figure 21.6 VideoView with a custom pause button
Figure 21.7 VideoView with MediaController