スタートガイド
インストール手順と、このプラグインの完全な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-thumbnails`
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-thumbnails/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アシストによるセットアップでプラグインをインストールできます。以下のコマンドを使用して、お使いのAIツールに Capgo のスキルを追加してください:
bunx 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-thumbnails` plugin in my project.手動セットアップを希望する場合は、以下のコマンドを実行してプラグインをインストールし、下記のプラットフォーム別の手順に従ってください:
bun add @capgo/capacitor-video-thumbnailsbunx cap syncインポート
「インポート」セクションimport { CapgoVideoThumbnails } from '@capgo/capacitor-video-thumbnails';クイックスタート
「クイックスタート」セクションimport { CapgoVideoThumbnails } from '@capgo/capacitor-video-thumbnails';
const result = await CapgoVideoThumbnails.getThumbnail({ sourceUri: 'file:///path/to/video.mp4', time: 5000, quality: 0.8});console.log('Thumbnail URI:', result.uri);console.log('Dimensions:', result.width, 'x', result.height);よくある落とし穴
「よくある落とし穴」セクション- ネイティブ同期: 実行
bunx cap syncプラグインのアップグレード後。 - 信頼できる情報源: 信頼
src/definitions.tsGitHub リポジトリ内。
API の概要
「API 概要」セクションgetThumbnail
「getThumbnail」セクション動画ファイルの指定した時間位置からサムネイル画像を生成します。
import { CapgoVideoThumbnails } from '@capgo/capacitor-video-thumbnails';
const result = await CapgoVideoThumbnails.getThumbnail({ sourceUri: 'file:///path/to/video.mp4', time: 5000, quality: 0.8});console.log('Thumbnail URI:', result.uri);console.log('Dimensions:', result.width, 'x', result.height);型リファレンス
「型リファレンス」セクションVideoThumbnailsOptions
「VideoThumbnailsOptions」セクションビデオのサムネイルを生成するためのオプション。
export interface VideoThumbnailsOptions { /** * The URI of the video file. Can be a local file path or a remote URL. * For local files, use file:// protocol or absolute path. * For remote files, use http:// or https:// protocol. */ sourceUri: string;
/** * The time position in milliseconds from which to extract the thumbnail. * Defaults to 0 (first frame). */ time?: number;
/** * Quality of the generated image, from 0.0 (lowest) to 1.0 (highest). * Defaults to 1.0. */ quality?: number;
/** * HTTP headers to include when fetching remote video URIs. * Only applicable for remote URLs. */ headers?: Record<string, string>;}VideoThumbnailsResult
「VideoThumbnailsResult」セクションサムネイル生成の結果。
export interface VideoThumbnailsResult { /** * The local URI path to the generated thumbnail image. * This can be used directly in img tags or Image components. */ uri: string;
/** * Width of the generated thumbnail in pixels. */ width: number;
/** * Height of the generated thumbnail in pixels. */ height: number;}Source of Truth
「Source Of Truth」セクションこのページはプラグインの src/definitions.tsから生成されています。upstream で公開 API が変更されたら、再度 sync を実行してください。
Getting Startedの続きを進める
「Getting Started からの続き」セクション使用している場合 スタートガイド ネイティブメディアとインターフェースの挙動を計画するには、次と連携させてください @capgo/capacitor-video-thumbnails を使用する 「@capgo/capacitor-video-thumbnails の使用」のネイティブ機能については、 @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-video-player @capgo/capacitor-video-player. の実装の詳細については