Animation — Kuito Dokumentation

Verwendung

Overlay a now-playing caption

Dieser Typ wird verwendet von Blur

tsx

import { Blur, Image, Text, VStack } from 'kuito';

export default function NowPlaying() {
  return (
    <VStack flex={1}>
      <Image
        src="https://example.com/cover.jpg"
        position="absolute"
        top={0}
        left={0}
        right={0}
        bottom={0}
      />
      <Blur material="thin" position="absolute" bottom={0} left={0} right={0} padding={16}>
        <Text>Now playing</Text>
      </Blur>
    </VStack>
  );
}

Typdeklaration

export interface Animation<T = number> {
  /** Where it comes to rest; without one, the prop or transition says. */
  readonly target?: T | readonly number[];
  readonly __kuitoAnimation: AnimationSpec;
  readonly onEnd?: AnimationCallback;
  /**
   * The same animation toward `target`. Several numbers are snap points: a
   * release goes to the one nearest where the throw would land.
   */
  to<U extends number | string>(
    target: U | readonly number[],
  ): Animation<U extends number ? number : string>;
}

Mitglieder 3

Name	Typ	Erforderlich	Beschreibung
`target`schreibgeschützt	`T \| readonly number[]`	Nein	Where it comes to rest; without one, the prop or transition says.
`onEnd`schreibgeschützt	`AnimationCallback`	Nein	—
`to`	`<U extends number \| string>(target: U \| readonly number[]) => Animation<U extends number ? number : string>`	Ja	The same animation toward `target`. Several numbers are snap points: a release goes to the one nearest where the throw would land.

onEnd — Methodensignaturen

Signaturen

(finished: boolean): void

Parameter

Name	Typ	Erforderlich	Beschreibung
`finished`	`boolean`	Ja	—

Rückgabe

void

to — Methodensignaturen

Signaturen

<U extends number | string>(target: U | readonly number[]): Animation<U extends number ? number : string>

Typparameter

Name	Einschränkung	Standard
`U`	`string \| number`	—

Parameter

Name	Typ	Erforderlich	Beschreibung
`target`	`readonly number[] \| U`	Ja	—

Rückgabe

Animation<U extends number ? number : string>

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