Перейти к содержанию

Система распознавания жестов

Система распознавания жестов управляет жизненным циклом жестов в вашем приложении. Прикосновение может пройти через несколько фаз, пока приложение определяет намерения пользователя. Например, приложение должно определить, является ли прикосновение прокруткой, скольжением по виджету или касанием. Это может даже меняться в течение всего времени касания. Также может быть несколько одновременных прикосновений.

Система реагирования на прикосновения необходима для того, чтобы компоненты могли договариваться об этих сенсорных взаимодействиях без каких-либо дополнительных знаний об их родительских или дочерних компонентах.

Лучшие практики

Чтобы ваше приложение было удобным, каждое действие должно обладать следующими атрибутами:

  • Обратная связь/подсветка — показать пользователю, что происходит с его прикосновением, и что произойдет, когда он отпустит жест.
  • Возможность отмены — при выполнении действия пользователь должен иметь возможность прервать его в середине прикосновения, отведя палец в сторону.

Эти функции делают работу с приложением более комфортной, поскольку позволяют пользователям экспериментировать и взаимодействовать, не боясь ошибиться.

TouchableHighlight и Touchable.

Система ответчиков может быть сложной в использовании. Поэтому мы предоставили абстрактную реализацию Touchable для вещей, которые должны быть "касаемыми". Она использует систему ответчиков и позволяет вам настраивать взаимодействие с касанием декларативно. Используйте TouchableHighlight везде, где вы бы использовали кнопку или ссылку в Интернете.

Жизненный цикл ответчика

Представление может стать ответчиком прикосновения, реализовав правильные методы согласования. Есть два метода, чтобы спросить представление, хочет ли оно стать ответчиком:

  • View.props.onStartShouldSetResponder: evt => true, — Хочет ли это представление стать отвечающим при начале касания?
  • View.props.onMoveShouldSetResponder: evt => true, — Вызывается для каждого движения прикосновения к виду, когда он не является ответчиком: хочет ли этот вид "претендовать" на отзывчивость при касании?

Если представление возвращает true и пытается стать ответчиком, произойдет одно из следующих событий:

  • View.props.onResponderGrant: evt => {} — Представление теперь реагирует на события прикосновения. Это время, чтобы выделить и показать пользователю, что происходит.
  • View.props.onResponderReject: evt => {} — Что-то другое является ответчиком в данный момент и не будет его освобождать

Если представление отвечает, можно вызвать следующие обработчики:

  • View.props.onResponderMove: evt => {} — Пользователь перемещает палец.
  • View.props.onResponderRelease: evt => {} — Выполняется в конце касания, то есть "touchUp"
  • View.props.onResponderTerminationRequest: evt => true — Что-то другое хочет стать ответчиком. Должно ли это представление освободить ответчика? Возвращение true позволяет освободить
  • View.props.onResponderTerminate: evt => {} — Ответчик был взят из представления. Может быть взят другими представлениями после вызова onResponderTerminationRequest, или может быть взят ОС без запроса (происходит с центром управления/центром уведомлений на iOS).

evt — это синтетическое событие касания, имеющее следующую форму:

  • nativeEvent
    • changedTouches — Массив всех событий касания, которые изменились с момента последнего события
    • идентификатор — Идентификатор прикосновения
    • locationX — Положение X касания относительно элемента
    • locationY — Положение Y касания относительно элемента
    • pageX — Положение X касания относительно корневого элемента
    • pageY — Положение Y касания относительно корневого элемента
    • target — Идентификатор узла элемента, получающего событие касания
    • timestamp — Идентификатор времени касания, полезный для расчета скорости.
    • touches — Массив всех текущих касаний на экране

Захват обработчиков ShouldSet

onStartShouldSetResponder и onMoveShouldSetResponder вызываются по схеме пузырьков, где сначала вызывается самый глубокий узел. Это означает, что самый глубокий компонент станет ответчиком, когда несколько представлений вернут true для обработчиков *ShouldSetResponder. В большинстве случаев это желательно, поскольку это гарантирует, что все элементы управления и кнопки могут быть использованы.

Однако иногда родитель хочет убедиться в том, что он стал ответчиком. Это можно сделать с помощью фазы захвата. Прежде чем система ответчика поднимется из самого глубокого компонента, она выполнит фазу захвата, срабатывая on*ShouldSetResponderCapture. Поэтому, если родительский вид хочет предотвратить переход дочернего компонента в статус ответчика при запуске касания, он должен иметь обработчик onStartShouldSetResponderCapture, который возвращает true.

  • View.props.onStartShouldSetResponderCapture: evt => true,
  • View.props.onMoveShouldSetResponderCapture: evt => true,

PanResponder

Для более высокоуровневой интерпретации жестов посмотрите PanResponder.

Комментарии