Salta al contenuto principale

Lettore video Plugin Capacitor

Riproduzione video nativa con sottotitoli, fullscreen 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 usare Video Player in Capacitor

Testa sul dispositivo

Scarica l'app Capgo, poi scansiona il QR code.

QR code per l'anteprima del plugin Video Player

Uso di @capgo/capacitor-video-player

Plugin Capacitor per riprodurre video nel player nativo.

Installa

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

bunx cap sync copia i code nativi del plugin nei tuoi progetti nativi. Eseguilo di nuovo dopo ogni aggiornamento del plugin.

Importa

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

API in breve

Metodo Descrizione
initPlayer Inizializza un video player.
isPlaying Restituisce se il playerId specificato è in riproduzione.
play Riproduce il video corrente tramite un playerId.
pause Mette in pausa il video corrente tramite un playerId.
getDuration Ottiene la durata del video corrente tramite un playerId.
getCurrentTime Ottiene il tempo corrente del video tramite un playerId.
setCurrentTime Imposta il tempo corrente per il seek del video tramite un playerId.
getVolume Ottiene il volume del video corrente tramite un playerId.
setVolume Imposta il volume del video corrente tramite un playerId.
getMuted Ottiene lo stato mute del video corrente tramite un playerId.
setMuted Imposta il mute del video corrente tramite un playerId.
setRate Imposta la velocità del video corrente tramite un playerId.
getRate Ottieni la velocità del video corrente tramite un playerId.
stopAllPlayers Ferma tutti i player in riproduzione.
showController Mostra il controller.
isControllerIsFullyVisible isControllerIsFullyVisible.
exitPlayer Esci dal player.
hidePlayer Nasconde l'interfaccia del player attualmente visualizzata senza interrompere la riproduzione (fullscreen nativo).
showPlayer Mostra nuovamente l'interfaccia del player precedentemente nascosta (fullscreen nativo).

Esempi

initPlayer()

Inizializza un video player.

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

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

isPlaying()

Return if a given playerId is playing.

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

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

play()

Riproduce il video corrente tramite il playerId specificato.

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

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

pause()

Metti in pausa il video corrente tramite un playerId.

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 tramite un playerId.

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 tramite un playerId.

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

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

La tabella sopra elenca i 19 metodi core. Listener, helper di versione e il contratto completo di ogni metodo sono documentati in repository GitHub.

Riferimento completo

Continua da Using @capgo/capacitor-video-player

Se stai usando Uso di @capgo/capacitor-video-player per pianificare il comportamento dei media nativi e dell'interfaccia, collegalo a @capgo/capacitor-video-player per i dettagli di implementazione in @capgo/capacitor-video-player, Per iniziare per i dettagli di implementazione nella guida introduttiva, Uso di @capgo/capacitor-live-activities per la funzionalità nativa nella pagina Uso di @capgo/capacitor-live-activities, @capgo/capacitor-live-activities per i dettagli di implementazione in @capgo/capacitor-live-activities, e Usando @capgo/capacitor-native-navigation per la funzionalità nativa in Usando @capgo/capacitor-native-navigation.

FAQ

FAQ del plugin Video Player

Come installo il plugin Video Player in un'app Capacitor?

Esegui "bun add @capgo/capacitor-video-player" (o "npm install @capgo/capacitor-video-player"), poi esegui "bunx cap sync" in modo che i progetti iOS e Android carichino il code nativo. Importalo da "@capgo/capacitor-video-player" nella code della tua app.

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

Sì. Video Player è un pacchetto Capacitor, quindi funziona con qualsiasi framework web in esecuzione su Capacitor, inclusi Ionic, React, Vue, Angular, Svelte e JavaScript puro.

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

I plugin Capgo seguono la major version di Capacitor: usa la major version del plugin che corrisponde alla tua major version 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 di code è pubblico su GitHub all'indirizzo https://github.com/Cap-go/capacitor-video-player/ e il pacchetto è gratuito su npm. Bug report e pull request sono i benvenuti.

Posso aggiornare code che usa Video Player senza passare per la revisione dell'App Store?

Installare o aggiornare il plugin modifica il code nativo, quindi serve una nuova build per lo store. Dopo, le modifiche a JavaScript, HTML e CSS che chiamano il plugin possono essere rilasciate subito con le live updates di Capgo.

Distribuisci aggiornamenti al Video Player senza attendere la revisione dell'app

Una volta incluso il plugin nel tuo store build, Capgo invia le modifiche a JavaScript, HTML e CSS tramite live updates in pochi minuti.

Inizia con Capgo