Перейти к основному содержимому

Триггеры действий

Триггеры действий представляют собой конкретные события, которые происходят при взаимодействии пользователя с приложением, такие как нажатие кнопки, выбор опции из выпадающего списка или загрузка новой страницы. Когда триггер действия вызывается одним из этих взаимодействий, он инициирует соответствующее действие — задачу или операцию, которая реагирует на событие.

В основном, триггеры действий - это 'слушатели' в вашем приложении, следящие за взаимодействиями пользователя и сигнализирующие, когда приложению пора ответить. Понимая и используя триггеры действий, вы можете создать более динамичный и удобный для пользователя опыт приложения.

Типы триггеров действий

Триггеры действий на уровне корня страницы и компонента

FlutterFlow предоставляет несколько триггеров действий, позволяющих реагировать на инициализацию страницы или компонента, а также на события, такие как нажатие клавиши.

Дополнительную информацию об этих триггерах см. на страницах Действия и жизненный цикл страницы и Действия и жизненный цикл компонентов.

Базовые триггеры

FlutterFlow предоставляет несколько базовых триггеров действий, которые могут быть легко добавлены:

  • По нажатию: Этот триггер активируется при нажатии пользователя на виджет. Например, вы можете использовать этот триггер для отображения сообщения Snackbar при нажатии на кнопку.
  • Двойное нажатие: Этот триггер активируется, когда пользователь быстро дважды нажимает на виджет. Типичный пример - увеличение изображения или фотографии при двойном нажатии на нее.
  • Долгое нажатие: Этот триггер активируется, когда пользователь нажимает и удерживает виджет в течение продолжительного времени. Обычное использование - показ дополнительных опций или контекстного меню, например, позволяющее пользователю удалить или переименовать файл при долгом нажатии на него.

Вот пример отображения сообщения по щелчку кнопки с использованием триггера По нажатию:

Триггеры действий на основе виджетов

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

  • При отправке: Активируется при нажатии кнопки отправки на виджете TextField, завершая ввод текста.
  • При загрузке страницы: Доступен на виджете страницы и активируется сразу после загрузки страницы, полезен для задач, таких как получение данных или обновление контента.
  • При встряхивании телефона: Специфичен для виджета страницы и реагирует на физическое встряхивание устройства, обычно используется в играх для действий, таких как бросок кубиков.
  • При выборе: Найден на виджетах Dropdowns, CheckboxGroups, Sliders, RadioButtons, ChoiceChips и RatingBars, этот триггер активируется при любом изменении выбора.
  • При свайпе страницы: Доступен на виджете PageView для активации действий при свайпе страницы.
  • При переключении: Доступен на виджете ToggleIcon, этот триггер реагирует каждый раз, когда переключатель активируется.
  • При завершении, при изменении: Специфично для виджета PinCode, эти триггеры активируются при завершении или изменении ввода пин-кода.
  • При изменении счетчика: Присутствует в виджете CountController, этот триггер реагирует на изменения счетчика.

Триггеры детектора жестов

Триггеры детектора жестов позволяют реагировать на жесты пользователя, такие как касания, перетаскивания, свайпы и масштабирование. Эти триггеры вызываются на основе конкретных жестов и позволяют добавлять действия в ответ на взаимодействия пользователя. Например, триггер onDoubleTap вызывается каждый раз, когда пользователь быстро дважды касается виджета, что может использоваться для переключения состояния «нравится» или масштабирования контента.

Эти триггеры доступны при добавлении действия на Container.

Этапы жизненного цикла

Жизненный цикл триггеров жестов включает четыре ключевых этапа: Начало, Обновление, Конец/Остановка и Отмена. Эти этапы определяют, как обнаруживаются и обрабатываются жесты, от начала взаимодействия до завершения или отмены. Понимание этого жизненного цикла - ключевой фактор для создания интуитивных жестовых взаимодействий в вашем приложении.

Жизненный цикл жеста касания

Жесты касания имеют более простой жизненный цикл, основанный в основном на обнаружении касаний и завершении или отмене. Вот как работает жизненный цикл жеста касания:

  1. Нажатие: Этот этап начинается, когда пользователь касается экрана, инициируя касание. Например: onTapDown активируется, когда пользователь касается экрана для начала касания.
  2. Отпускание: Жест касания завершается, когда пользователь убирает палец с экрана. Например: onTapUp активируется, когда пользователь завершает касание, убрав палец.
  3. Касание: После завершения обоих вышеуказанных действий, активируется onTap, указывающий на успешное завершение жеста касания.
  4. Отмена: Если пользователь слишком сильно двигает палец перед его отпусканием, касание отменяется, предотвращая выполнение действия. Например: будет вызвано onTapCancel, и onTap не будет активирован.

Вот как происходит жизненный цикл для жестов касания:

Жизненный цикл жеста касания

Жизненный цикл жеста перетаскивания

Жесты перетаскивания более сложны, включая непрерывное отслеживание движения по экрану. Жизненный цикл перетаскивания включает следующие этапы:

  1. Начало: Этот этап происходит, когда пользователь начинает перетаскивать простынь пальцем по экрану. Например: onHorizontalDragStart вызывается, когда начинается горизонтальное перетаскивание.
  2. Обновление: Во время перетаскивания отслеживается движение жеста, что позволяет захватывать данные в реальном времени, такие как положение указателя или значения дельты. Например: onHorizontalDragUpdate вызывается по мере того, как пользователь перетаскивает палец, позволяя приложению отслеживать прогресс перетаскивания.
  3. Конец/Остановка: Жест перетаскивания завершается, когда пользователь убирает палец, завершая взаимодействие. Например: onHorizontalDragEnd вызывается, когда пользователь завершает перетаскивание и убирает палец с экрана.
  4. Отмена: Если жест перетаскивания прерывается до завершения (например, другим жестом), он отменяется. Например: onHorizontalDragCancel вызывается, если перетаскивание прерывается до завершения.

Вот как происходит жизненный цикл для жестов перетаскивания:

Жизненный цикл жестов перетаскивания

Отмена жеста перетаскивания

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

Например, если горизонтальное перетаскивание прерывается до завершения перетаскивания (например, другим жестом), вместо onHorizontalDragEnd вызывается onHorizontalDragCancel.

Отмена жеста перетаскивания

Доступные триггеры детектора жестов

Ниже приведен полный список доступных триггеров детектора жестов в FlutterFlow для расширения возможностей жестовых взаимодействий.

[Здесь будет перечень доступных триггеров детектора жестов]