Saltare al contenuto principale

Reproduzione video Plugin Capacitor

Riproduzione video nativa con sottotitoli, schermo intero e controlli completi

Installa

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

Guida

Come utilizzare il lettore di video in Capacitor

Testa sul dispositivo

Scarica l'app Capgo sullo Store, poi scansa il codice QR code.

Link QR di anteprima del plugin Video Player code

Usa @capgo/capacitor-video-player

Il plugin Capacitor per riprodurre video nel player nativo.

Installa

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

bunx cap sync Copia il plugin del player nativo code nei tuoi progetti nativi. Esegui nuovamente dopo ogni aggiornamento del plugin.

Importa

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

Vedi API in breve

Metodo Descrizione
initPlayer Inizializza un lettore di video.
isPlaying Restituisci se un playerId specificato è in riproduzione.
play Riproduci il video corrente da un playerId specificato.
pause Pausa il video corrente da un playerId specificato.
getDuration ottiene la durata del video corrente da un playerId specificato.
getCurrentTime ottiene il tempo corrente del video corrente da un playerId specificato.
setCurrentTime Imposta il tempo corrente per cercare il video corrente da un playerId specificato.
getVolume ottiene il volume del video corrente da un playerId specificato.
setVolume Imposta il volume del video corrente da un playerId specificato.
getMuted ottiene lo stato di silenzio del video corrente da un playerId specificato.
setMuted Imposta lo stato di silenzio del video corrente da un playerId specificato.
setRate Imposta il tasso del video corrente da un playerId specifico.
getRate Ottieni il tasso del video corrente da un playerId specifico.
stopAllPlayers Interrompi tutti i player in esecuzione.
showController Mostra il controller.
isControllerIsFullyVisible isControllerIsFullyVisible.
exitPlayer Esci dal player.
hidePlayer Nascondi l'interfaccia utente del player corrente senza interrompere la riproduzione (schermo intero nativo).
showPlayer Riattiva il player UI nascosto precedentemente (schermo intero nativo).

Esempi

initPlayer()

Inizializza un player di video.

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

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

isPlaying()

Verifica se un playerId specifico è in riproduzione.

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

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

play()

Riproduci il video corrente da un playerId specifico.

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

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

pause()

Interrompi il video corrente da un playerId specifico.

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

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

getDuration()

Ottieni la durata del video corrente da un playerId specifico.

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

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

getCurrentTime()

Ottieni il tempo corrente del video corrente da un playerId specifico.

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

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

La tabella sopra elenca le 19 metodologie di base. Gli ascoltatori e gli aiuti di versione, e il contratto completo di ogni metodo, sono documentati nel repository di GitHub.

Riferimento completo

Continua da Utilizzo di @capgo/capacitor-video-player

Se stai utilizzando Utilizzo di @capgo/capacitor-video-player per pianificare il comportamento dei media e dell'interfaccia nativa, connettilo con @capgo/capacitor-player-video per i dettagli di implementazione in @capgo/capacitor-player-video Getting Started per i dettagli di implementazione in Iniziare Utilizzare @capgo/capacitor-attività-viva per la capacità nativa in Utilizzare @capgo/capacitor-attività-viva @capgo/capacitor-attività-viva per i dettagli di implementazione in @capgo/capacitor-attività-viva, e Utilizzare @capgo/capacitor-navigazione-nativa per la capacità nativa in Utilizzare @capgo/capacitor-navigazione-nativa

FAQ

Domande frequenti sul plugin di riproduzione video

Come posso installare il plugin di riproduzione video in un'app Capacitor?

Esegui "bun add @capgo/capacitor-video-player" (o "npm install @capgo/capacitor-video-player"), quindi esegui "bunx cap sync" affinché i progetti iOS e Android acquisiscano il nativo code. Importalo da "@capgo/capacitor-video-player" nella tua app code.

Funziona @capgo/capacitor-video-player con React, Vue e Angular?

Sì. Il lettore di video è un pacchetto Capacitor, quindi funziona con qualsiasi framework web che esegue all'interno Capacitor, compresi Ionic, React, Vue, Angular, Svelte e JavaScript puro.

Quale versione di Capacitor supporta @capgo/capacitor-video-player?

I pacchetti Capgo seguono la versione maggiore di Capacitor: utilizza la versione maggiore del plugin che corrisponde alla tua versione maggiore di Capacitor (ad esempio plugin v8 con Capacitor 8). La tabella di compatibilità nel README di GitHub elenca le versioni mantenute.

È @capgo/capacitor-video-player gratuito e open source?

Sì. Il codice sorgente code è pubblico su GitHub all'indirizzo https://github.com/Cap-go/capacitor-video-player/ e il pacchetto è gratuito per l'installazione da npm. I segnalazioni di bug e le richieste di pull sono benvenute.

Posso aggiornare code che utilizza il lettore di video senza una revisione dell'App Store?

L'installazione o l'aggiornamento del plugin modifica il code nativo, quindi richiede una nuova costruzione dello store. Dopo di che, le modifiche JavaScript, HTML e CSS che chiamano il plugin possono essere spediti immediatamente con Capgo live updates.

Invia le modifiche del player video senza dover attendere la revisione dell'app.

Una volta che il plugin è presente nella tua build di store, Capgo le aggiornamenti in tempo reale inviano le tue modifiche JavaScript, HTML e CSS agli utenti in pochi minuti.

Inizia con Capgo