Usage

Apply a pinch's change in scale.

This type is used by pinch

tsx
// Apply a pinch's change in scale.
import { Text, pinch, signal, type PinchChangeEvent } from 'kuito';

const fontSize = signal(17);

// Text size follows the pinch, between 12 and 34 points.
const resize = (event: PinchChangeEvent) => {
  fontSize.value = Math.min(34, Math.max(12, fontSize.value * event.scaleChange));
};

<Text fontSize={fontSize.value} gestures={[pinch({ onChange: resize })]}>
  Pinch to resize
</Text>;

Type declaration

ts
export type PinchOptions = Common & Callbacks<PinchEvent, PinchChangeEvent>;

Members 5

NameTypeRequiredDescription
disabledbooleanNoIgnores touches, like a disabled Pressable.
hitAreaHitAreaNoInsets of the area that takes touches: one for every edge, or by edge.
onStart(event: PinchEvent) => voidNoIt activated.
onChange(event: PinchChangeEvent) => voidNoIt moved, with the change since the last move.
onEnd(event: PinchEvent, success: boolean) => voidNoIt ended after activating: success is false when it was cancelled.
onStart — method signatures

Signatures

ts
(event: PinchEvent): void

Parameters

NameTypeRequiredDescription
eventPinchEventYes—

Returns

void

onChange — method signatures

Signatures

ts
(event: PinchChangeEvent): void

Parameters

NameTypeRequiredDescription
eventPinchChangeEventYes—

Returns

void

onEnd — method signatures

Signatures

ts
(event: PinchEvent, success: boolean): void

Parameters

NameTypeRequiredDescription
eventPinchEventYes—
successbooleanYes—

Returns

void

Generated from the public TypeScript declarations: signatures, props and defaults come from the checked source, descriptions from its JSDoc. No defaults are invented.