kuito.
Commencer

Motion

A value that moves every frame: scroll offsets, gestures, animations. Read and write .value anywhere. Props and handlers that use a motion value run on the UI thread when the compiler can place them there, so moving it never waits for JavaScript and never re-renders a component. Use signal() for values components react to.

type

Utilisation

Dismiss and observe the keyboard

Ce type est utilisé par keyboard.frame

tsx
import { Box, Button, Text, VStack, keyboard } from 'kuito';

export default function KeyboardState() {
  keyboard.frame.value; // { screenX, screenY, width, height } or null

  // In a component, until it unmounts; elsewhere, until remove().
  keyboard.watch('didShow', (event) => console.log(event.frame.height, event.duration));

  return (
    <VStack>
      <Text>{keyboard.visible.value ? 'typing' : ''}</Text>
      {/* Rides on the keyboard. */}
      <Box translateY={keyboard.height.map((height) => -height)} />
      <Button onPress={() => keyboard.dismiss()}>Done</Button>
    </VStack>
  );
}

Déclaration du type

ts
export interface Motion<T> {
  get value(): T;
  /** A value moves there now; an animation (timing, spring, decay, ...) moves it there. */
  set value(next: T | Animation<T>);
  /**
   * Moves with `source` on the UI thread, with no code: a gesture's field
   * (`drag.x`), another motion value or a derived one. Null stops it.
   */
  follows(source: GestureSource | Readable<T> | null): this;
  /** A value computed from this one, on the UI thread. */
  map<U>(fn: (value: T) => U): Derived<U>;
}

Membres 3

NomTypeRequisDescription
valueTOuiA value moves there now; an animation (timing, spring, decay, ...) moves it there.
follows(source: GestureSource | Readable<T> | null) => Motion<T>OuiMoves with source on the UI thread, with no code: a gesture's field (drag.x), another motion value or a derived one. Null stops it.
map<U>(fn: (value: T) => U) => Derived<U>OuiA value computed from this one, on the UI thread.
follows — signatures de méthode

Signatures

ts
(source: GestureSource | Readable<T> | null): Motion<T>

Paramètres

NomTypeRequisDescription
sourceGestureSource | Readable<T>Oui—

Retourne

Motion<T>

map — signatures de méthode

Signatures

ts
<U>(fn: (value: T) => U): Derived<U>

Paramètres de type

NomContraintePar défaut
U——

Paramètres

NomTypeRequisDescription
fn(value: T) => UOui—

Retourne

Derived<U>

Généré depuis les déclarations TypeScript publiques : signatures, props et valeurs par défaut viennent de la source vérifiée, les descriptions de sa JSDoc. Aucune valeur par défaut n'est inventée.