开始入门
复制一个包含安装步骤和本插件的全Markdown指南的设置提示。
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-video-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/video-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.
安装
标题为“安装”您可以使用我们的 AI 助手设置来安装插件。将 Capgo 技能添加到您的 AI 工具中,使用以下命令:
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins然后使用以下提示:
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-video-player` plugin in my project.如果您更喜欢手动设置,请运行以下命令安装插件,并按照以下平台特定的说明进行操作:
bun add @capgo/capacitor-video-playerbunx cap sync导入
标题为“导入”import { VideoPlayer } from '@capgo/capacitor-video-player';API概述
标题为“API概述”initPlayer
标题为“initPlayer”初始化视频播放器
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.initPlayer({} as capVideoPlayerOptions);isPlaying
.isPlayingReturn if a given playerId is playing
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.isPlaying({} as capVideoPlayerIdOptions);play
playPlay the current video from a given playerId
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.play({} as capVideoPlayerIdOptions);pause
pausePause the current video from a given playerId
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.pause({} as capVideoPlayerIdOptions);getDuration
getDurationGet the duration of the current video from a given playerId
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.getDuration({} as capVideoPlayerIdOptions);getCurrentTime
Section titled “getCurrentTime”从给定 playerId 中获取当前视频的当前时间
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.getCurrentTime({} as capVideoPlayerIdOptions);setCurrentTime
Section titled “setCurrentTime”从给定 playerId 中设置当前视频的当前时间
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.setCurrentTime({} as capVideoTimeOptions);getVolume
Section titled “getVolume”从给定 playerId 中获取当前视频的音量
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.getVolume({} as capVideoPlayerIdOptions);setVolume
Section titled “setVolume”设置当前视频的音量
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.setVolume({} as capVideoVolumeOptions);getMuted
Section titled “getMuted”获取当前视频的静音状态
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.getMuted({} as capVideoPlayerIdOptions);setMuted
Section titled “setMuted”设置当前视频的静音状态
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.setMuted({} as capVideoMutedOptions);setRate
Section titled “setRate”设置当前视频的播放速度
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.setRate({} as capVideoRateOptions);getRate
Section titled “getRate”获取当前视频的播放速度
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.getRate({} as capVideoPlayerIdOptions);stopAllPlayers
Section titled “stopAllPlayers”停止所有正在玩的玩家
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.stopAllPlayers();showController
Section titled “showController”显示控制器
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.showController();isControllerIsFullyVisible
Section titled “isControllerIsFullyVisible”isControllerIsFullyVisible
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.isControllerIsFullyVisible();exitPlayer
Section titled “exitPlayer”退出玩家
import { VideoPlayer } from '@capgo/capacitor-video-player';
await VideoPlayer.exitPlayer();类型参考
类型参考capVideoPlayerOptions
类型参考:capVideoPlayerOptionsexport interface capVideoPlayerOptions { /** * Player mode * - "fullscreen" * - "embedded" (Web only) */ mode?: string; /** * The url of the video to play */ url?: string; /** * The url of subtitle associated with the video */ subtitle?: string; /** * The language of subtitle * see https://github.com/libyal/libfwnt/wiki/Language-Code-identifiers */ language?: string; /** * SubTitle Options */ subtitleOptions?: SubTitleOptions; /** * Id of DIV Element parent of the player */ playerId?: string; /** * Initial playing rate */ rate?: number; /** * Exit on VideoEnd (iOS, Android) * default: true */ exitOnEnd?: boolean; /** * Loop on VideoEnd when exitOnEnd false (iOS, Android) * default: false */ loopOnEnd?: boolean; /** * Picture in Picture Enable (iOS, Android) * default: true */ pipEnabled?: boolean; /** * Background Mode Enable (iOS, Android) * default: true */ bkmodeEnabled?: boolean; /** * Show Controls Enable (iOS, Android) * default: true */ showControls?: boolean; /** * Display Mode ["all", "portrait", "landscape"] (iOS, Android) * default: "all" */ displayMode?: string; /** * Component Tag or DOM Element Tag (React app) */ componentTag?: string; /** * Player Width (mode "embedded" only) */ width?: number; /** * Player height (mode "embedded" only) */ height?: number; /** * Headers for the request (iOS, Android) * by Manuel García Marín (https://github.com/PhantomPainX) */ headers?: { [key: string]: string; }; /** * Title shown in the player (Android) * by Manuel García Marín (https://github.com/PhantomPainX) */ title?: string; /** * Subtitle shown below the title in the player (Android) * by Manuel García Marín (https://github.com/PhantomPainX) */ smallTitle?: string; /** * ExoPlayer Progress Bar and Spinner color (Android) * by Manuel García Marín (https://github.com/PhantomPainX) * Must be a valid hex color code * default: #FFFFFF */ accentColor?: string; /** * Chromecast enable/disable (Android) * by Manuel García Marín (https://github.com/PhantomPainX) * default: true */ chromecast?: boolean; /** * Artwork url to be shown in Chromecast player * by Manuel García Marín (https://github.com/PhantomPainX) * default: "" */ artwork?: string; /** * DRM configuration for protected content (iOS: FairPlay, Android: Widevine) */ drm?: DrmOptions;}capVideoPlayerResult
类型参考:capVideoPlayerResultexport interface capVideoPlayerResult { /** * result set to true when successful else false */ result?: boolean; /** * method name */ method?: string; /** * value returned */ value?: any; /** * message string */ message?: string;}capVideoPlayerIdOptions
类型参考:capVideoPlayerIdOptionsexport interface capVideoPlayerIdOptions { /** * Id of DIV Element parent of the player */ playerId?: string;}capVideoTimeOptions
类型参考:capVideoTimeOptionsexport interface capVideoTimeOptions { /** * Id of DIV Element parent of the player */ playerId?: string; /** * Video time value you want to seek to */ seektime?: number;}capVideoVolumeOptions
类型参考:capVideoVolumeOptionsexport interface capVideoVolumeOptions { /** * Id of DIV Element parent of the player */ playerId?: string; /** * Volume value between [0 - 1] */ volume?: number;}capVideoMutedOptions
《capVideoMutedOptions》export interface capVideoMutedOptions { /** * Id of DIV Element parent of the player */ playerId?: string; /** * Muted value true or false */ muted?: boolean;}capVideoRateOptions
《capVideoRateOptions》export interface capVideoRateOptions { /** * Id of DIV Element parent of the player */ playerId?: string; /** * Rate value */ rate?: number;}SubTitleOptions
《SubTitleOptions》export interface SubTitleOptions { /** * Foreground Color in RGBA (default rgba(255,255,255,1) */ foregroundColor?: string; /** * Background Color in RGBA (default rgba(0,0,0,1) */ backgroundColor?: string; /** * Font Size in pixels (default 16) */ fontSize?: number;
/** * Get the native Capacitor plugin version * * @returns {Promise<{ id: string }>} an Promise with version for this device * @throws An error if the something went wrong */ getPluginVersion(): Promise<{ version: string }>;}DrmOptions
《DrmOptions》export interface DrmOptions { /** * FairPlay DRM configuration (iOS) */ fairplay?: FairPlayDrmOptions; /** * PlayReady DRM configuration */ playready?: PlayreadyDrmOptions; /** * Widevine DRM configuration (Android) */ widevine?: WidevineDrmOptions;}FairPlayDrmOptions
《FairPlayDrmOptions》export interface FairPlayDrmOptions { /** * The URL to fetch the FairPlay certificate */ certificateUrl?: string; /** * The URL to send the SPC and receive the CKC license (FairPlay license server URL) */ contentKeySpcUrl?: string;}PlayreadyDrmOptions
《PlayreadyDrmOptions》export interface PlayreadyDrmOptions { /** * The URL to fetch the PlayReady license */ certificateUrl?: string;}WidevineDrmOptions
WidevineDrmOptionsexport interface WidevineDrmOptions { /** * The URL to fetch the Widevine license */ certificateUrl?: string;}真实来源
真实来源本页面是根据插件生成的 src/definitions.ts当公共API上游更改时,请重新运行同步。
继续从开始
如果您正在使用开始 规划原生媒体和界面行为,连接它与 使用@__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-video-player Using @capgo/capacitor-video-player 为使用 @capgo/capacitor-video-player 的原生能力 使用 @capgo/capacitor-live-activities 为使用 @capgo/capacitor-live-activities 的原生能力 @capgo/capacitor-live-activities 为 @capgo/capacitor-live-activities 的实现细节 @capgo/capacitor-video-player 为 @capgo/capacitor-video-player 的实现细节, 使用 @capgo/capacitor-native-navigation 为使用 @capgo/capacitor-native-navigation 的原生能力