Mulai
Copy sebuah prompt pengaturan dengan langkah instalasi dan panduan markdown lengkap untuk plugin ini.
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-youtube-player`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/youtube-player/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
Pasang
Bagian berjudul “Pasang”bun add @capgo/capacitor-youtube-playerbunx cap syncimport { YoutubePlayer } from '@capgo/capacitor-youtube-player';API Ringkasan
Ringkasan APIinitialize
Bagian Berjudul “initialize”Inisialisasi instance pemutar YouTube baru.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.initialize({ playerId: 'my-player', videoId: 'dQw4w9WgXcQ', playerSize: { width: 640, height: 360 }, privacyEnhanced: true});destroy
Bagian Berjudul “destroy”Hapus instance pemutar dan lepaskan sumber daya.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.destroy({} as PlayerIdOptions);stopVideo
Bagian Berjudul “stopVideo”Hentikan pemutaran video dan batalkan pengisian. Gunakan dengan hati-hati - pauseVideo() biasanya lebih disukai.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.stopVideo({} as PlayerIdOptions);playVideo
Bagian Berjudul “playVideo”Mainkan video yang sedang diatur atau dimuat. Status pemutar akhir akan menjadi PLAYING (1).
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.playVideo({} as PlayerIdOptions);pauseVideo
Judul bagian “pauseVideo”Tetapkan video yang sedang diputar ke mode diam. Status pemutar akhir akan menjadi PAUSED (2), kecuali sudah ENDED (0).
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.pauseVideo({} as PlayerIdOptions);seekTo
Judul bagian “seekTo”Pindah ke waktu tertentu dalam video. Jika pemutar dalam mode diam, tetap diam. Jika sedang bermain, terus bermain.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.seekTo({} as SeekToOptions);loadVideoById
Judul bagian “loadVideoById”Muat dan mainkan video berdasarkan ID YouTube-nya.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.loadVideoById({} as VideoByIdMethodOptions);cueVideoById
Judul bagian “cueVideoById”Tetapkan video berdasarkan ID tanpa memainkannya. Muat thumbnail dan siapkan pemutar, tetapi tidak meminta video sampai playVideo() dipanggil.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.cueVideoById({} as VideoByIdMethodOptions);loadVideoByUrl
Bagian berjudul “loadVideoByUrl”Muat dan mainkan video dengan URL lengkap.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.loadVideoByUrl({} as VideoByUrlMethodOptions);cueVideoByUrl
Bagian berjudul “cueVideoByUrl”Tandai video dengan URL tanpa memainkannya.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.cueVideoByUrl({} as VideoByUrlMethodOptions);cuePlaylist
Bagian berjudul “cuePlaylist”Tandai playlist tanpa memainkannya. Muat playlist dan siapkan video pertama.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.cuePlaylist({} as PlaylistMethodOptions);loadPlaylist
Bagian berjudul “loadPlaylist”Muat dan mainkan playlist.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.loadPlaylist({} as PlaylistMethodOptions);nextVideo
Bagian berjudul “nextVideo”Mainkan video berikutnya di daftar putar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.nextVideo({} as PlayerIdOptions);previousVideo
Bagian berjudul “previousVideo”Mainkan video sebelumnya di daftar putar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.previousVideo({} as PlayerIdOptions);playVideoAt
Bagian berjudul “playVideoAt”Mainkan video spesifik di daftar putar berdasarkan index.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.playVideoAt({} as PlayVideoAtOptions);Dinginkan suara pemutar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.mute({} as PlayerIdOptions);unMute
Bagian berjudul “unMute”Bisukanlah audio pemutar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.unMute({} as PlayerIdOptions);isMuted
Bagian berjudul “isMuted”Periksa apakah pemutar sedang bisu saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.isMuted({} as PlayerIdOptions);setVolume
Atur tingkat volume pemutar.Salin ke clipboard
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.setVolume({} as SetVolumeOptions);getVolume
Salin ke clipboardBagian berjudul “setVolume”
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getVolume({} as PlayerIdOptions);setSize
Bagian berjudul “setSize”Atur dimensi pemain dalam piksel.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.setSize({} as SetSizeOptions);getPlaybackRate
Bagian berjudul “getPlaybackRate”Dapatkan kecepatan pemutaran saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getPlaybackRate({} as PlayerIdOptions);setPlaybackRate
Bagian berjudul “setPlaybackRate”Atur kecepatan pemutaran.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.setPlaybackRate({} as SetPlaybackRateOptions);getAvailablePlaybackRates
Bagian berjudul “getAvailablePlaybackRates”Dapatkan daftar kecepatan pemutaran yang tersedia untuk video saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getAvailablePlaybackRates({} as PlayerIdOptions);setLoop
Bagian berjudul “setLoop”Aktifkan atau nonaktifkan pengulangan daftar putar. Ketika diaktifkan, daftar putar akan dimulai dari awal setelah video terakhir.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.setLoop({} as SetLoopOptions);setShuffle
Bagian berjudul “setShuffle”Aktifkan atau nonaktifkan pengacakan daftar putar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.setShuffle({} as SetShuffleOptions);getVideoLoadedFraction
Bagian berjudul “getVideoLoadedFraction”Dapatkan bagian dari video yang telah di-buffer. Lebih dapat diandalkan daripada getVideoBytesLoaded/getVideoBytesTotal yang sudah deprecated.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getVideoLoadedFraction({} as PlayerIdOptions);getPlayerState
Bagian berjudul “getPlayerState”Dapatkan status saat ini dari pemutar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getPlayerState({} as PlayerIdOptions);getAllPlayersEventsState
Bagian berjudul “getAllPlayersEventsState”Dapatkan status acara untuk semua pemain aktif. Bermanfaat untuk mengikuti beberapa instance pemain.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getAllPlayersEventsState();getCurrentTime
Bagian berjudul “getCurrentTime”Dapatkan posisi pemutaran saat ini dalam detik.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getCurrentTime({} as PlayerIdOptions);toggleFullScreen
Bagian berjudul “toggleFullScreen”Tetapkan mode layar penuh atau tidak.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.toggleFullScreen({} as ToggleFullScreenOptions);getPlaybackQuality
Bagian berjudul “getPlaybackQuality”Dapatkan kualitas pemutaran saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getPlaybackQuality({} as PlayerIdOptions);setPlaybackQuality
Bagian berjudul “setPlaybackQuality”Atur kualitas pemutaran yang disarankan. Kualitas aktual mungkin berbeda berdasarkan kondisi jaringan.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.setPlaybackQuality({} as SetPlaybackQualityOptions);getAvailableQualityLevels
Bagian berjudul “getAvailableQualityLevels”Dapatkan daftar kualitas yang tersedia untuk video saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getAvailableQualityLevels({} as PlayerIdOptions);getDuration
Bagian berjudul “getDuration”Dapatkan durasi video saat ini dalam detik.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getDuration({} as PlayerIdOptions);getVideoUrl
Bagian berjudul “getVideoUrl”Dapatkan URL YouTube.com untuk video saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getVideoUrl({} as PlayerIdOptions);getVideoEmbedCode
Bagian berjudul “getVideoEmbedCode”Dapatkan kode code untuk video saat ini. Mengembalikan kode iframe HTML code.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getVideoEmbedCode({} as PlayerIdOptions);getPlaylist
Bagian berjudul “getPlaylist”Dapatkan array ID video dalam daftar putar saat ini.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getPlaylist({} as PlayerIdOptions);getPlaylistIndex
Bagian berjudul “getPlaylistIndex”Dapatkan indeks video saat ini yang sedang diputar dalam daftar putar.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getPlaylistIndex({} as PlayerIdOptions);getIframe
Bagian berjudul “getIframe”Dapatkan elemen iframe DOM untuk pemutar. Hanya platform web.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.getIframe({} as PlayerIdOptions);addEventListener
Bagian berjudul “addEventListener”Tambahkan pemangku jawab untuk pemutar. Hanya platform web.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
YoutubePlayer.addEventListener({ playerId: 'my-player', eventName: 'onStateChange', listener: (event) => { console.log('Player state:', event.data); },});removeEventListener
Bagian berjudul “removeEventListener”Hapus pemangku jawab dari pemutar. Hanya platform web.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.removeEventListener({} as PlayerEventListenerOptions<TEvent>);Referensi Tipe
Bagian berjudul “Referensi Tipe”PlayerIdOptions
Bagian berjudul “PlayerIdOptions”export interface PlayerIdOptions { playerId: string;}SeekToOptions
Bagian berjudul “SeekToOptions”export interface SeekToOptions extends PlayerIdOptions { playerId: string; seconds: number; allowSeekAhead: boolean;}VideoByIdMethodOptions
Bagian berjudul “VideoByIdMethodOptions”export interface VideoByIdMethodOptions extends PlayerIdOptions { playerId: string; options: IVideoOptionsById;}VideoByUrlMethodOptions
Bagian berjudul “VideoByUrlMethodOptions”export interface VideoByUrlMethodOptions extends PlayerIdOptions { playerId: string; options: IVideoOptionsByUrl;}PlaylistMethodOptions
Bagian berjudul “PlaylistMethodOptions”export interface PlaylistMethodOptions extends PlayerIdOptions { playerId: string; playlistOptions: IPlaylistOptions;}PlayVideoAtOptions
Bagian berjudul “PlayVideoAtOptions”export interface PlayVideoAtOptions extends PlayerIdOptions { playerId: string; index: number;}SetVolumeOptions
Bagian berjudul “SetVolumeOptions”export interface SetVolumeOptions extends PlayerIdOptions { playerId: string; volume: number;}SetSizeOptions
Bagian berjudul “SetSizeOptions”export interface SetSizeOptions extends PlayerIdOptions { playerId: string; width: number; height: number;}SetPlaybackRateOptions
Bagian berjudul “SetPlaybackRateOptions”export interface SetPlaybackRateOptions extends PlayerIdOptions { playerId: string; suggestedRate: number;}SetLoopOptions
Bagian berjudul “SetLoopOptions”export interface SetLoopOptions extends PlayerIdOptions { playerId: string; loopPlaylists: boolean;}SetShuffleOptions
Bagian berjudul “SetShuffleOptions”export interface SetShuffleOptions extends PlayerIdOptions { playerId: string; shufflePlaylist: boolean;}ToggleFullScreenOptions
Bagian berjudul “ToggleFullScreenOptions”export interface ToggleFullScreenOptions extends PlayerIdOptions { playerId: string; isFullScreen: boolean | null | undefined;}Sumber Kebenaran
Bagian berjudul “Sumber Kebenaran”Halaman ini dihasilkan dari plugin’s src/definitions.ts. Re-run sinkronisasi ketika API publik berubah di atas.