Метод create

Метод create класса PanResponder принимает объект с функциями жеста. onStartShouldSetPanResponder решает, брать ли жест при касании. onMoveShouldSetPanResponder решает, брать ли жест при движении. onPanResponderGrant вызывается, когда View стал владельцем жеста. onPanResponderMove вызывается при движении; второй аргумент gestureState содержит dx и dy смещения от начала. onPanResponderRelease вызывается, когда палец оторвали. Результат содержит поле panHandlers для spread на View.

Синтаксис

const pan = PanResponder.create({
	onStartShouldSetPanResponder: () => true,
	onPanResponderMove: (_, gestureState) => {},
});

Параметры

Параметр	Описание
`onStartShouldSetPanResponder`	Возвращает `true`, если View должен стать responder при касании.
`onMoveShouldSetPanResponder`	Возвращает `true`, если View должен стать responder при движении.
`onPanResponderGrant`	Старт жеста, View получил responder.
`onPanResponderMove`	Движение пальца; в `gestureState` есть `dx` и `dy`.
`onPanResponderRelease`	Конец жеста, палец ушёл с экрана.

Пример

Давайте залогировать смещение при перетаскивании:

import { PanResponder } from 'react-native';

const pan = PanResponder.create({
	onMoveShouldSetPanResponder: () => true,
	onPanResponderMove: (_, gestureState) => {
		console.log(gestureState.dx, gestureState.dy);
	},
	onPanResponderRelease: () => {
		console.log('abcde');
	},
});

При движении в консоли меняются dx и dy, при отпускании появится 'abcde'.

Пример

Давайте повесить panHandlers на View с текстом:

import { useRef } from 'react';
import { View, Text, PanResponder } from 'react-native';

export default function App() {
	const pan = useRef(
		PanResponder.create({
			onStartShouldSetPanResponder: () => true,
			onPanResponderGrant: () => {},
			onPanResponderMove: () => {},
			onPanResponderRelease: () => {},
		}),
	).current;

	return (
		<View {...pan.panHandlers}>
			<Text>abcde</Text>
		</View>
	);
}

На экране 'abcde'; область реагирует на жест от grant до release.

Смотрите также

класс PanResponder,
который описывает назначение create
компонент View,
который принимает spread panHandlers
компонент Pressable,
который обрабатывает нажатие без перетаскивания
класс Value,
который хранит координату для анимации жеста