Le Tutoriel de Android MediaPlayer et de VideoView

View more categories:

1- MediaPlayer

Android fournit un composant pour jouer de la musique, c'est MediaPlayer, MediaPlayer qui peuvent exécuter des fichiers audio et vidéo, le fichier source se trouve sur votre appareil ou à partir d'une URL.

Comme avec d'autres lecteurs de musique que vous connaissez, MediaPlayer fournit des méthodes pour contrôler la lecture audio/ vidéo, y compris le démarrage, l'arrêt, le rembobinage .....
Vous pouvez également appeler MediaPlayer à partir d'un service.

MediaPlayer est un composant qui n'a pas d'interface, il vous aide à lire un fichier de musique facilement, mais pour lire un fichier vidéo, vous devez le combiner avec SuffaceView pour afficher l'image.

2- VideoView

VideoView est un composant personnalisé disponible sur Android, c'est la combinaison de MediaPlayer et de SurfaceView qui vous aide à lire une vidéo plus facilement.
Lorsque vous utilisez VideoView, vous pouvez utiliser MediaController, cela est disponible dans Android qui sert à contrôler des médias (par exemple, le démarrage, l'arrêt, le rembobinage, la pause ...)
Si vous localisez VideoView et MediaController dans FrameLayout, vous pouvez obtenir l'interface comme ci- dessous:

3- Exemple avec MediaPlayer

L'exemple simple suivant utilise  MediaPlayer pour lire un fichier musical et certains contrôles de la lecture tels que la lecture, la pause, le rembobinage.
Créez un nouveau projet nommé  MediaPlayerTutorial:
Créez le dossier  raw afin de contenir les fichiers musicals.
Préparez un fichier musical, et le copiez, ensuite le collez dans le dossier  raw.
Ce sont les exemples de l'interface:
La conception de l'interface:
Définissez les méthodes qui seront appelées quand vous cliquez des boutons:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:paddingBottom="@dimen/activity_vertical_margin"
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   tools:context="org.o7planning.mediaplayertutorial.MainActivity">

   <Button
       style="?android:attr/buttonStyleSmall"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="&lt;&lt;"
       android:id="@+id/button_rewind"
       android:layout_marginLeft="60dp"
       android:layout_marginStart="60dp"
       android:layout_marginTop="81dp"
       android:layout_below="@+id/textView_currentPosion"
       android:layout_alignParentLeft="true"
       android:layout_alignParentStart="true"
       android:onClick="doRewind" />

   <Button
       style="?android:attr/buttonStyleSmall"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Start"
       android:id="@+id/button_start"
       android:layout_alignBottom="@+id/button_rewind"
       android:layout_toRightOf="@+id/button_rewind"
       android:layout_toEndOf="@+id/button_rewind"
       android:onClick="doStart" />

   <Button
       style="?android:attr/buttonStyleSmall"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Pause"
       android:id="@+id/button_pause"
       android:layout_alignBottom="@+id/button_start"
       android:layout_toRightOf="@+id/button_start"
       android:layout_toEndOf="@+id/button_start"
       android:onClick="doPause" />

   <Button
       style="?android:attr/buttonStyleSmall"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text=">>"
       android:id="@+id/button_fastForward"
       android:layout_alignBottom="@+id/button_pause"
       android:layout_toRightOf="@+id/button_pause"
       android:layout_toEndOf="@+id/button_pause"
       android:onClick="doFastForward" />

   <SeekBar
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/seekBar"
       android:layout_alignParentLeft="true"
       android:layout_alignParentStart="true"
       android:layout_alignParentTop="true"
       android:layout_alignParentRight="true"
       android:layout_alignParentEnd="true" />

   <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:textAppearance="?android:attr/textAppearanceLarge"
       android:text="&lt;Current Position>"
       android:id="@+id/textView_currentPosion"
       android:layout_marginTop="65dp"
       android:gravity="center"
       android:layout_below="@+id/textView_maxTime"
       android:layout_centerHorizontal="true" />

   <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:textAppearance="?android:attr/textAppearanceLarge"
       android:text="&lt;Max Time>"
       android:id="@+id/textView_maxTime"
       android:layout_below="@+id/seekBar"
       android:layout_alignParentRight="true"
       android:layout_alignParentEnd="true"
       android:layout_marginTop="38dp"
       android:layout_alignParentLeft="true"
       android:layout_alignParentStart="true"
       android:gravity="center" />
</RelativeLayout>
MainActivity.java
package org.o7planning.mediaplayertutorial;

import android.media.MediaPlayer;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.SeekBar;
import android.widget.TextView;

import java.util.concurrent.TimeUnit;

public class MainActivity extends AppCompatActivity {

   private TextView textMaxTime;
   private TextView textCurrentPosition;
   private Button buttonPause;
   private Button buttonStart;
   private SeekBar seekBar;
   private Handler threadHandler = new Handler();

   private MediaPlayer mediaPlayer;
   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);

       this.textCurrentPosition = (TextView)this.findViewById(R.id.textView_currentPosion);
       this.textMaxTime=(TextView) this.findViewById(R.id.textView_maxTime);
       this.buttonStart= (Button) this.findViewById(R.id.button_start);
       this.buttonPause= (Button) this.findViewById(R.id.button_pause);

       this.buttonPause.setEnabled(false);

       this.seekBar= (SeekBar) this.findViewById(R.id.seekBar);
       this.seekBar.setClickable(false);

       // ID of 'mysong' in 'raw' folder.
       int songId = this.getRawResIdByName("mysong");

       // Create MediaPlayer.
       this.mediaPlayer=   MediaPlayer.create(this, songId);
   }

   // Find ID of resource in 'raw' folder.
   public int getRawResIdByName(String resName)  {
       String pkgName = this.getPackageName();
       // Return 0 if not found.
       int resID = this.getResources().getIdentifier(resName, "raw", pkgName);
       return resID;
   }

   // Convert millisecond to string.
   private String millisecondsToString(int milliseconds)  {
       long minutes = TimeUnit.MILLISECONDS.toMinutes((long) milliseconds);
       long seconds =  TimeUnit.MILLISECONDS.toSeconds((long) milliseconds) ;
       return minutes+":"+ seconds;
   }


   public void doStart(View view)  {
       // The duration in milliseconds
       int duration = this.mediaPlayer.getDuration();

       int currentPosition = this.mediaPlayer.getCurrentPosition();
       if(currentPosition== 0)  {
           this.seekBar.setMax(duration);
           String maxTimeString = this.millisecondsToString(duration);
           this.textMaxTime.setText(maxTimeString);
       } else if(currentPosition== duration)  {
           // Resets the MediaPlayer to its uninitialized state.
           this.mediaPlayer.reset();
       }
       this.mediaPlayer.start();
       // Create a thread to update position of SeekBar.
       UpdateSeekBarThread updateSeekBarThread= new UpdateSeekBarThread();
       threadHandler.postDelayed(updateSeekBarThread,50);

       this.buttonPause.setEnabled(true);
       this.buttonStart.setEnabled(false);
   }

   // Thread to Update position for SeekBar.
   class UpdateSeekBarThread implements Runnable {

       public void run()  {
           int currentPosition = mediaPlayer.getCurrentPosition();
           String currentPositionStr = millisecondsToString(currentPosition);
           textCurrentPosition.setText(currentPositionStr);

           seekBar.setProgress(currentPosition);
           // Delay thread 50 milisecond.
           threadHandler.postDelayed(this, 50);
       }
   }

   // When user click to "Pause".
   public void doPause(View view)  {
       this.mediaPlayer.pause();
       this.buttonPause.setEnabled(false);
       this.buttonStart.setEnabled(true);
   }

   // When user click to "Rewind".
   public void doRewind(View view)  {
       int currentPosition = this.mediaPlayer.getCurrentPosition();
       int duration = this.mediaPlayer.getDuration();
       // 5 seconds.
       int SUBTRACT_TIME = 5000;

       if(currentPosition - SUBTRACT_TIME > 0 )  {
           this.mediaPlayer.seekTo(currentPosition - SUBTRACT_TIME);
       }
   }

   // When user click to "Fast-Forward".
   public void doFastForward(View view)  {
       int currentPosition = this.mediaPlayer.getCurrentPosition();
       int duration = this.mediaPlayer.getDuration();
       // 5 seconds.
       int ADD_TIME = 5000;

       if(currentPosition + ADD_TIME < duration)  {
           this.mediaPlayer.seekTo(currentPosition + ADD_TIME);
       }
   }

}
Exécutez l'application:

4- Exemple de lire une vidéo avec VideoView

Maintenant, nous pouvons voir un exemple avec VideoView et MediaController situé à la surface de la vidéo. Vous pouvez prévisualiser les images dans l'exemple ci- dessous:
Créez un nouveau projet nommé  AndroidVideoView:
Créez un dossier  raw afin de comprendre des fichiers video.
Copiez & Collez des fichiers video mp4 dans le dossier  raw:
Design the Interface:
Faites glisser VideoView au centre (Center) de  FrameView.
Notez que FrameLayout n'a qu'une cellule pour contenir toutes les sous View, 9 sous-zones que vous voyez ci-dessus, ne sont que 9 zones de gravité (gravity).
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="org.o7planning.androidvideoview.MainActivity">

    <VideoView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/videoView"
        android:layout_gravity="center" />

</FrameLayout>
MainActivity.java
package org.o7planning.androidvideoview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.app.Activity;
import android.app.ProgressDialog;
import android.content.res.Configuration;
import android.media.MediaPlayer;
import android.media.MediaPlayer.OnPreparedListener;
import android.net.Uri;
import android.os.Bundle;
import android.util.Log;
import android.widget.MediaController;
import android.widget.VideoView;

public class MainActivity extends AppCompatActivity {


    private VideoView videoView;
    private int position = 0;
    private MediaController mediaController;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


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

        // Set the media controller buttons
        if (mediaController == null) {
            mediaController = new MediaController(MainActivity.this);

            // Set the videoView that acts as the anchor for the MediaController.
            mediaController.setAnchorView(videoView);


            // Set MediaController for VideoView
            videoView.setMediaController(mediaController);
        }


        try {
            // ID of video file.
            int id = this.getRawResIdByName("myvideo");
            videoView.setVideoURI(Uri.parse("android.resource://" + getPackageName() + "/" + id));

        } catch (Exception e) {
            Log.e("Error", e.getMessage());
            e.printStackTrace();
        }

        videoView.requestFocus();


        // When the video file ready for playback.
        videoView.setOnPreparedListener(new OnPreparedListener() {

            public void onPrepared(MediaPlayer mediaPlayer) {


                videoView.seekTo(position);
                if (position == 0) {
                    videoView.start();
                }

                // When video Screen change size.
                mediaPlayer.setOnVideoSizeChangedListener(new MediaPlayer.OnVideoSizeChangedListener() {
                    @Override
                    public void onVideoSizeChanged(MediaPlayer mp, int width, int height) {

                        // Re-Set the videoView that acts as the anchor for the MediaController
                        mediaController.setAnchorView(videoView);
                    }
                });
            }
        });

    }

    // Find ID corresponding to the name of the resource (in the directory raw).
    public int getRawResIdByName(String resName) {
        String pkgName = this.getPackageName();
        // Return 0 if not found.
        int resID = this.getResources().getIdentifier(resName, "raw", pkgName);
        Log.i("AndroidVideoView", "Res Name: " + resName + "==> Res ID = " + resID);
        return resID;
    }


    // When you change direction of phone, this method will be called.
    // It store the state of video (Current position)
    @Override
    public void onSaveInstanceState(Bundle savedInstanceState) {
        super.onSaveInstanceState(savedInstanceState);

        // Store current position. 
        savedInstanceState.putInt("CurrentPosition", videoView.getCurrentPosition());
        videoView.pause();
    }


    // After rotating the phone. This method is called.
    @Override
    public void onRestoreInstanceState(Bundle savedInstanceState) {
        super.onRestoreInstanceState(savedInstanceState);

        // Get saved position.
        position = savedInstanceState.getInt("CurrentPosition");
        videoView.seekTo(position);
    }

}
Exécution l'application:
Quelques remarques de l'utilisation du code:
Imaginez quand vous utilisez setAnchorView() pour attacher MediaController à VideoView:
Lecture de Video à URL:
Tout d'abord, vous devez déclarer l'autorisation d'accéder à Internet ( android.permission.INTERNET) dans AndroidManifest.xml:
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="org.o7planning.androidvideoview">

   <uses-permission android:name="android.permission.INTERNET"></uses-permission>

   <application
       android:allowBackup="true"
       android:icon="@mipmap/ic_launcher"
       android:label="@string/app_name"
       android:supportsRtl="true"
       android:theme="@style/AppTheme">



       <activity android:name=".MainActivity">
           <intent-filter>
               <action android:name="android.intent.action.MAIN" />

               <category android:name="android.intent.category.LAUNCHER" />
           </intent-filter>
       </activity>
   </application>

</manifest>
Java Code:
// Way 1:

String videoUrl="http://www.youtubemaza.com/files/data/366/Tom%20And%20Jerry%20055%20Casanova%20Cat%20(1951).mp4";        
Uri video = Uri.parse(videoUrl);
videoView.setVideoURI(video);


// Way 2:

String videoUrl="http://www.youtubemaza.com/files/data/366/Tom%20And%20Jerry%20055%20Casanova%20Cat%20(1951).mp4";    
videoView.setVideoPath(video);

View more categories: