Saltar al contenido principal

Reproductor de video plugin de Capacitor

Reproducción de video nativa con subtítulos, pantalla completa y controles completos

Instalar

bun add @capgo/capacitor-video-player bunx cap sync
npm, pnpm o yarn
  • npm install @capgo/capacitor-video-player
  • pnpm add @capgo/capacitor-video-player
  • yarn add @capgo/capacitor-video-player

Guía

Cómo usar el Reproductor de Video en Capacitor

Probar en dispositivo

Descarga la aplicación Capgo, luego escanea el código QR code.

Video Player plugin preview QR code

Usando @capgo/capacitor-video-player

El plugin Capacitor para reproducir video en reproductor nativo.

Instalar

bun add @capgo/capacitor-video-player
bunx cap sync

bunx cap sync copiar el code nativo del plugin en tus proyectos nativos. Ejecútalo de nuevo después de cada actualización del plugin.

Importar

import { VideoPlayer } from '@capgo/capacitor-video-player';

Vista general del API

Método Descripción
initPlayer Iniciar un reproductor de video.
isPlaying Devuelve si un playerId dado está reproduciendo.
play Reproducir la video actual desde un jugador de video determinado.
pause Pausa el video actual desde un playerId determinado.
getDuration Obtenga la duración de la video actual desde un playerId dado.
getCurrentTime Obtenga la hora actual del video actual desde un jugador de playerId determinado.
setCurrentTime Establecer el tiempo actual para buscar el video actual desde un jugador de video dado.
getVolume Obtenga el volumen del video actual desde un jugador dado.
setVolume Establezca el volumen del video actual a partir de un jugador dado.
getMuted Obtenga el estado de silencio del video actual desde un jugador dado.
setMuted Establezca el estado de silencio del video actual a partir de un jugador dado.
setRate Establezca la velocidad del video actual desde un jugador dado.
getRate Obtenga la velocidad del video actual desde un jugador dado.
stopAllPlayers Detenga todos los jugadores que estén reproduciendo.
showController Muestre el controlador.
isControllerIsFullyVisible isControllerIsFullyVisible.
exitPlayer Salir del jugador.
hidePlayer Oculte la interfaz de usuario del jugador actual sin detener la reproducción (pantalla completa nativa).
showPlayer Mostrar de nuevo un jugador de video previamente oculto (pantalla completa nativa).

Ejemplos

initPlayer()

Inicializar un reproductor de video.

import { VideoPlayer } from '@capgo/capacitor-video-player';

const result = await VideoPlayer.initPlayer({ mode: 'fullscreen' });
console.log(result);

isPlaying()

Devolver si un playerId dado está reproduciendo.

import { VideoPlayer } from '@capgo/capacitor-video-player';

const result = await VideoPlayer.isPlaying({ playerId: 'player-id-123' });
console.log(result);

play()

Reproducir el video actual desde un playerId dado.

import { VideoPlayer } from '@capgo/capacitor-video-player';

const result = await VideoPlayer.play({ playerId: 'player-id-123' });
console.log(result);

pause()

Pausar el video actual desde un playerId dado.

import { VideoPlayer } from '@capgo/capacitor-video-player';

const result = await VideoPlayer.pause({ playerId: 'player-id-123' });
console.log(result);

getDuration()

Obtener la duración del video actual desde un playerId dado.

import { VideoPlayer } from '@capgo/capacitor-video-player';

const result = await VideoPlayer.getDuration({ playerId: 'player-id-123' });
console.log(result);

getCurrentTime()

Obtener el tiempo actual del video actual desde un playerId dado.

import { VideoPlayer } from '@capgo/capacitor-video-player';

const result = await VideoPlayer.getCurrentTime({ playerId: 'player-id-123' });
console.log(result);

La tabla anterior muestra los 19 métodos básicos. Los ayudantes de escucha y versión, y la completa contratación de cada método, se documentan en el GitHub repositorio.

Referencia completa

Sigue adelante desde el uso de @capgo/capacitor-video-player

Si estás utilizando Usando @capgo/capacitor-video-player Para planificar el comportamiento de medios y interfaz nativa, conecta con @capgo/capacitor-video-player para el detalle de implementación en @capgo/capacitor-video-player Getting Started para el detalle de implementación en Getting Started Usando @capgo/capacitor-live-activities para la capacidad nativa en Usando @capgo/capacitor-live-activities @capgo/capacitor-actividades en vivo para los detalles de implementación en @capgo/capacitor-actividades-en-vivo, y Usando @capgo/capacitor-navegación-nativa para la capacidad nativa en Usando @capgo/capacitor-navegación-nativa.

FAQ

Preguntas Frecuentes del plugin de Reproductor de Video

¿Cómo instalo el plugin de Reproductor de Video en una aplicación Capacitor?

Ejecuta "bun add @capgo/capacitor-video-player" (o "npm install @capgo/capacitor-video-player"), luego ejecuta "bunx cap sync" para que los proyectos iOS y Android capturen el code nativo. Importa desde "@capgo/capacitor-video-player" en tu aplicación code.

¿Funciona @capgo/capacitor-video-player con React, Vue y Angular?

Sí. El Reproductor de Video es un paquete Capacitor, por lo que funciona con cualquier framework web que se ejecute dentro de Capacitor, incluyendo Ionic, React, Vue, Angular, Svelte y JavaScript puro.

¿Qué versión de Capacitor soporta @capgo/capacitor-video-player?

Capgo plugins siguen la versión mayor de Capacitor: utiliza la versión mayor del plugin que coincida con tu versión mayor de Capacitor (por ejemplo, plugin v8 con Capacitor 8). La tabla de compatibilidad en el README del GitHub lista las versiones mantenidas.

¿Es gratuito y de código abierto @capgo/capacitor-video-player?

Sí. El código fuente de code está público en GitHub en https://github.com/Cap-go/capacitor-video-player/ y el paquete es gratuito para instalar desde npm. Se aceptan informes de errores y solicitudes de cambios.

Can I update code that uses Video Player without an App Store review?

Instalar o actualizar el plugin cambia el code nativo, por lo que necesita una nueva compilación de la tienda. Después de eso, los cambios en JavaScript, HTML y CSS que llaman al plugin pueden enviarlos instantáneamente con Capgo actualizaciones en vivo.

Envía cambios del reproductor de video sin esperar a la revisión de la tienda

Una vez que el plugin esté en tu tienda de construcción, Capgo actualizaciones en vivo envían cambios en JavaScript, HTML y CSS a los usuarios en minutos.

Inicia con Capgo