kuito.
Loslegen

VideoRef

A Video's ref that also holds its state: signals for what the player is doing, and time and duration as motion values. Between the player's reports the UI thread moves time along at the player's rate, so a bound progress bar needs no onProgress. Called while a component sets up, which owns it, like ref(), and passed as the view's ref.

Typ

Verwendung

Seek a lesson video back to the beginning.

Dieser Typ wird verwendet von videoRef

tsx
// Seek a lesson video back to the beginning.
import { Button, Video, VStack, videoRef } from 'kuito';

export function Lesson() {
  const player = videoRef();
  return (
    <VStack flex={1}>
      <Video ref={player} src={{ uri: 'https://example.com/lesson.mp4' }} height={240} controls />
      <Button onPress={() => void player.current?.seek(0).catch(console.error)}>
        Restart lesson
      </Button>
    </VStack>
  );
}

Typdeklaration

ts
export type VideoRef = ElementRef<VideoHandle> & {
  readonly playing: ReadonlySignal<boolean>;
  readonly loaded: ReadonlySignal<boolean>;
  readonly buffering: ReadonlySignal<boolean>;
  readonly fullscreen: ReadonlySignal<boolean>;
  readonly pictureInPicture: ReadonlySignal<boolean>;
  readonly error: ReadonlySignal<string | null>;
  /** Seconds from the start. */
  readonly time: Motion<number>;
  /** Seconds; 0 until loaded, and for a live stream. */
  readonly duration: Motion<number>;
  /** Calls `listener` each time playback reaches the end. */
  watch(event: 'ended', listener: () => void): EventSubscription;
};

Mitglieder 10

NameTypErforderlichBeschreibung
currentVideoHandleJa—
playingschreibgeschütztReadonlySignal<boolean>Ja—
loadedschreibgeschütztReadonlySignal<boolean>Ja—
bufferingschreibgeschütztReadonlySignal<boolean>Ja—
fullscreenschreibgeschütztReadonlySignal<boolean>Ja—
pictureInPictureschreibgeschütztReadonlySignal<boolean>Ja—
errorschreibgeschütztReadonlySignal<string>Ja—
timeschreibgeschütztMotion<number>JaSeconds from the start.
durationschreibgeschütztMotion<number>JaSeconds; 0 until loaded, and for a live stream.
watch(event: "ended", listener: () => void) => EventSubscriptionJaCalls listener each time playback reaches the end.
watch — Methodensignaturen

Signaturen

ts
(event: "ended", listener: () => void): EventSubscription

Parameter

NameTypErforderlichBeschreibung
event"ended"Ja—
listener() => voidJa—

Rückgabe

EventSubscription

Generiert aus den öffentlichen TypeScript-Deklarationen: Signaturen, Props und Standardwerte stammen aus der geprüften Quelle, Beschreibungen aus deren JSDoc. Kein Standardwert ist erfunden.