VideoView

Explicación del concepto de VideoView.

LogoVideoView  |  Android DevelopersAndroid Developers
Fuente: developer.android

DEFINICIÓN

Hereda de SurfaceView.

Reproduce un archivo de video.

  • Una VideoView puede reproducir videos desde varias fuentes, desde resources hasta content providers.

  • Se encarga de controlar el tamaño del video, por lo que puede ser utilizada en cualquier tipo de layout.

  • Además ofrece opciones como escalado y tinte.

Información técnica

Esta información aparece en el enlace de arriba como información util.

En esta guía no la vamos a utilizar, sin embargo, se la dejo traducida para facilitarle la vida.

Estado

Una VideoView no mantiene su estado cuando pasa a segundo plano, en particular no almacena:

  • Posición de la reproducción actual.

  • Estado de la reproducción actual.

  • Pistas seleccionadas.

  • Subtitulos añadidos.

Las aplicaciones deben almacenar y luego recuperar estos datos en su propia Activity.onSaveInstanceState(Bundle) y Activity.onRestoreInstanceState(Bundle).

Audio

Tambien hay que tener en cuenta que el id de la sesión de audio (que se obtiene con getAudioSessionId()) puede cambiar después de restaurar el VideoView.

Por defecto, VideoView solicita el foco de audio con AudioManager#AUDIOFOCUS_GAIN. Para cambiar este comportamiento debe utilizar setAudioFocusRequest(int).

Los atributos de audio utilizados por defecto son AudioAttributes#USAGE_MEDIA y AudioAttributes#CONTENT_TYPE_MOVIE. Para modificarlos utilice setAudioAttributes(android.media.AudioAttributes).

USO DESDE XML

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>

<ScrollView 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">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_margin="15dp">
        <VideoView
            android:id="@+id/vvUrl"
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:layout_marginBottom="10dp"/>

        <View
            android:id="@+id/divider"
            android:layout_width="match_parent"
            android:layout_height="10dp"
            android:background="?android:attr/listDivider" />

        <VideoView
            android:id="@+id/vvProject"
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="100dp"/>
    </LinearLayout>
</ScrollView>

No se muestra nada en las VideoViews por que es necesario configurar la VideoView antes de poder hacer uso de ella.

CONFIGURACIÓN

Vamos a diferenciar la configuración entre la reproducción de un video local y uno online.

Video Online

Solicitar permiso de Internet

En primer lugar se debe ir al AndroidManifest.xml y solicitar permisos para el uso de Internet. Esto se hace con la siguiente línea de código:

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

<application>
.....

Código en kotlin

Después de eso hay que realizar varios pasos en MainActivity.kt, concretamente dentro del OnCreate:

  • Primero creo una variable del tipo VideoView y la relaciono con el id de mi View:

val vvUrl: VideoView = findViewById(R.id.vvUrl)

  • Después creo una instancia de la clase MediaController() con el contexto definido en su constructor:

val mcUrl = MediaController(this)

  • Ahora relacionamos nuestro MediaController con nuestra View y viceversa:

mcUrl.setAnchorView(vvUrl)
vvUrl.setMediaController(mcUrl)

  • Por último le indicamos a nuestra VideoView el recurso que queremos reproducir:

vvUrl.setVideoPath("https://mivideodeejemplo.com")

Video Local

Para reproducir un recurso local los pasos son los mismos, lo único que cambia es el VideoPath del final:

val vvProject: VideoView = findViewById(R.id.vvProject)
val mcProject = MediaController(this)
val path = "android.resource://" + packageName + "/" + R.raw.vid_ejemplo

mcProject.setAnchorView(vvProject)
vvProject.setMediaController(mcProject)

vvProject.setVideoURI(Uri.parse(path))

CODIGO

Con todo hecho, el código nos quedaría de la siguiente manera:

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>

<ScrollView 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">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_margin="15dp">
        <VideoView
            android:id="@+id/vvUrl"
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:layout_marginBottom="10dp"/>

        <View
            android:id="@+id/divider"
            android:layout_width="match_parent"
            android:layout_height="10dp"
            android:background="?android:attr/listDivider" />

        <VideoView
            android:id="@+id/vvProject"
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="100dp"/>
    </LinearLayout>
</ScrollView>
MainActivity.kt
package com.example.android.appdeejemplo

import android.net.Uri
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.MediaController
import android.widget.VideoView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val vvUrl: VideoView = findViewById(R.id.vvUrl)
        val mcUrl = MediaController(this)

        mcUrl.setAnchorView(vvUrl)
        vvUrl.setMediaController(mcUrl)

        vvUrl.setVideoPath("https://mivideodeejemplo.com")

        val vvProject: VideoView = findViewById(R.id.vvProject)
        val mcProject = MediaController(this)
        val path = "android.resource://" + packageName + "/" + R.raw.vid_ejemplo

        mcProject.setAnchorView(vvProject)
        vvProject.setMediaController(mcProject)

        vvProject.setVideoURI(Uri.parse(path))

    }
}
PreviousWebViewNextCalendarView

Last updated