PanEvent — Kuito Documentação

Utilização

Dismiss a view with a pan.

tsx

// Dismiss a view with a pan.
import { Box, motion, pan, spring, type PanEvent } from 'kuito';

function Dismissible(props: { onDismiss: () => void }) {
  const drag = pan({ axis: 'y' }).release(spring());
  const y = motion(0).follows(drag.y);

  // Far enough, or thrown fast enough: dismiss instead of springing back.
  const decide = (event: PanEvent, success: boolean) => {
    if (success && (event.translationY > 160 || event.velocityY > 800)) props.onDismiss();
  };

  return <Box translateY={y} gestures={[pan({ axis: 'y', onEnd: decide }), drag]} height={300} />;
}

Declaração do tipo

export interface PanEvent extends PositionEvent {
  translationX: number;
  translationY: number;
  velocityX: number;
  velocityY: number;
}

Membros 11

Nome	Tipo	Obrigatório	Descrição
`translationX`	`number`	Sim	—
`translationY`	`number`	Sim	—
`velocityX`	`number`	Sim	—
`velocityY`	`number`	Sim	—
`x`	`number`	Sim	—
`y`	`number`	Sim	—
`absoluteX`	`number`	Sim	—
`absoluteY`	`number`	Sim	—
`state`	`number`	Sim	—
`numberOfPointers`	`number`	Sim	—
`pointerType`	`number`	Sim	—

Gerado a partir das declarações TypeScript públicas: assinaturas, props e predefinições vêm da fonte verificada, as descrições da sua JSDoc. Nenhuma predefinição é inventada.