¿Cómo implementar la biblioteca YoutubePlayerView en Android?

Si está buscando mostrar videos de YouTube dentro de su aplicación sin redirigir a su usuario de su aplicación a YouTube, entonces esta biblioteca es muy útil para que la use. Con la ayuda de esta biblioteca, simplemente puede reproducir videos de YouTube con la ayuda de la identificación de video dentro de su aplicación sin redirigir a su usuario a YouTube. Ahora veremos la implementación de esta biblioteca en nuestra aplicación de Android. Tenga en cuenta que vamos a implementar este proyecto utilizando el lenguaje Java .     

Implementación paso a paso 

Paso 1: Crear un nuevo proyecto

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que seleccione Java como lenguaje de programación.

Paso 2: agregue el archivo jar dentro de la carpeta libs en Android Studio

Descargue el archivo jar desde el enlace aquí . Para agregar este archivo, abra su proyecto de Android en el modo » Proyecto » como se muestra en la imagen a continuación.

Import External JAR Files in Android Studio

Su nombre de proyecto> aplicación> libs

Nota: También puede consultar este artículo ¿Cómo importar archivos JAR externos en Android Studio?

Paso 3: ahora agregue la dependencia en su archivo build.gradle

Para agregar esta dependencia. Navegue hasta el nombre de su aplicación > aplicación > y podrá ver el archivo build.gradle . Dentro de ese archivo, agregue la dependencia en la sección de dependencias. 

implementación ‘com.pierfrancescosoffritti.androidyoutubeplayer:core:10.0.3’

Ahora haga clic en la opción «sincronizar ahora» que verá en la esquina superior derecha después de agregar esta biblioteca. Después de eso, estamos listos para integrar el reproductor de video de YouTube en la aplicación. 

Paso 4: trabajar con el archivo activity_main.xml

Ahora cambie la pestaña del proyecto en la esquina superior izquierda a Android. Después de eso, navegue a la aplicación> res> diseño> actividad_principal.xml . Dentro de esto, crearemos un botón simple que redirigirá a una nueva actividad donde reproduciremos nuestro video de YouTube. A continuación se muestra el fragmento de código XML para el archivo activity_main.xml .

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"
    tools:context=".MainActivity">
  
    <!--Button which is used to navigate 
        to video player screen-->
    <Button
        android:id="@+id/idBtnPlayVideo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Play Youtube Video"
        android:textColor="@color/white" />
</RelativeLayout>

Paso 5: crea una nueva actividad vacía

Ahora crearemos una nueva actividad donde mostraremos nuestro reproductor de videos de YouTube. Para crear una nueva actividad, vaya a la aplicación > Java > el nombre del paquete de su aplicación y haga clic con el botón derecho en él > Nuevo > Actividad > Actividad vacía > Asigne un nombre a su actividad y asegúrese de mantener su idioma como Java . Ahora su nueva actividad ha sido creada. (Aquí hemos dado el nombre de la actividad como VideoPlayerActivity ). 

Paso 6: implementar YoutubePlayerView dentro de la nueva actividad 

A continuación se muestra el código para el archivo activity_video_player.xml .

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".VideoPlayerActivity">
  
    <!--Youtube Player view which will
        play our youtube video-->
    <com.pierfrancescosoffritti.androidyoutubeplayer.core.player.views.YouTubePlayerView
        android:id="@+id/videoPlayer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:showFullScreenButton="false">
    </com.pierfrancescosoffritti.androidyoutubeplayer.core.player.views.YouTubePlayerView>
      
</androidx.constraintlayout.widget.ConstraintLayout>

Paso 7: trabajar con el archivo VideoPlayerActivity.java

Antes de trabajar con el archivo VideoPlayerActivity.java, echemos un vistazo a cómo obtener la identificación de video de cualquier video de YouTube. Abra YouTube y busque cualquier video que desee reproducir dentro de su aplicación. Reproduce ese video dentro de tu navegador. En la sección superior de su navegador, habrá una barra de direcciones donde podrá ver la URL de ese video. Por ejemplo, aquí hemos tomado la siguiente URL.

https://www.youtube.com/watch?v=vG2PNdI8axo

Dentro de la URL anterior, la identificación del video está presente en el extremo izquierdo, es decir, después del signo v = es su identificación de video. En el ejemplo anterior, la identificación del video será 

vG2PNdI8axo 

De esta manera, podemos obtener URL para cualquier video. Ahora g VideoPlayerActivity.java VideoPlayerActivity.java

Java

import android.os.Bundle;
import android.view.Window;
import android.view.WindowManager;
  
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
  
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.PlayerConstants;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.YouTubePlayer;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.listeners.AbstractYouTubePlayerListener;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.views.YouTubePlayerView;
  
public class VideoPlayerActivity extends AppCompatActivity {
    // id of the video 
    // which we are playing.
    String video_id = "vG2PNdI8axo";
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
          
        // below two lines are used to set our 
        // screen orientation in landscape mode.
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
                             WindowManager.LayoutParams.FLAG_FULLSCREEN);
  
        setContentView(R.layout.activity_video_player);
          
        // below line of code is 
        // to hide our action bar.
        getSupportActionBar().hide();
          
        // declaring variable for youtubeplayer view
        final YouTubePlayerView youTubePlayerView = findViewById(R.id.videoPlayer);
          
        // below line is to place your youtube player in a full screen mode (i.e landscape mode)
        youTubePlayerView.enterFullScreen();
        youTubePlayerView.toggleFullScreen();
          
        // here we are adding observer to our youtubeplayerview.
        getLifecycle().addObserver(youTubePlayerView);
          
        // below method will provides us the youtube player
        // ui controller such as to play and pause a video 
        // to forward a video
        // and many more features.
        youTubePlayerView.getPlayerUiController();
          
        // below line is to enter full screen mode.
        youTubePlayerView.enterFullScreen();
        youTubePlayerView.toggleFullScreen();
  
        // adding listener for our youtube player view.
        youTubePlayerView.addYouTubePlayerListener(new AbstractYouTubePlayerListener() {
            @Override
            public void onReady(@NonNull YouTubePlayer youTubePlayer) {
                // loading the selected video into the YouTube Player
                youTubePlayer.loadVideo(video_id, 0);
            }
  
            @Override
            public void onStateChange(@NonNull YouTubePlayer youTubePlayer,
                                      @NonNull PlayerConstants.PlayerState state) {
                // this method is called if video has ended,
                super.onStateChange(youTubePlayer, state);
            }
        });
    }
}

Paso 8: trabajar con el archivo MainActivity.java

Vaya al archivo MainActivity.java y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.java . Se agregan comentarios dentro del código para comprender el código con más detalle.

Java

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import androidx.appcompat.app.AppCompatActivity;
  
public class MainActivity extends AppCompatActivity {
    // variable for our button
    Button playBtn;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // Initialize our Button
        playBtn = findViewById(R.id.idBtnPlayVideo);
          
        // we have set onclick listener for our button
        playBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // we have declared an intent to open new activity.
                Intent i = new Intent(MainActivity.this, VideoPlayerActivity.class);
                startActivity(i);
            }
        });
    }
}

Paso 9: agregue permiso de Internet en el archivo de manifiesto

Navegue a la aplicación > archivo AndroidManifest.xml allí, debe agregar los siguientes permisos. 

<!–Para el uso de Internet–>
   

<usos-permiso android:name=”android.permission.INTERNET”/>
   

<usos-permiso android:name=”android.permission.ACCESS_NETWORK_STATE”/>

Junto con esto, podrá ver la sección de actividad dentro de la etiqueta de su aplicación que agrega la orientación de la pantalla de actividad de su reproductor de video al modo horizontal. 

<!–Aquí el nombre de mi actividad era VideoPlayerActivity–>

<actividad android:name=”.VideoPlayerActivity”

    android:screenOrientation=”paisaje”>

</actividad>    

A continuación se muestra el código para el archivo AndroidManifest.xml completo:

XML

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.gtappdevelopers.youtubeplayerview">
  
    <!--For internet usage-->
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
  
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.YoutubePlayerView">
        <!--Here my activity name was VideoPlayerActivity-->
        <activity android:name=".VideoPlayerActivity"
            android:screenOrientation="landscape">
        </activity>
        
        <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>

Salida: Ejecute la aplicación en un dispositivo real 

Consulte el proyecto en el siguiente enlace de GitHub: https://github.com/ChaitanyaMunje/YoutubePlayerView

Publicación traducida automáticamente

Artículo escrito por chaitanyamunje y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *