Triggers are events that cause an action to fire. Together, triggers and actions create interactions in Play.
There are three types of triggers: single, continuous, and event.
Single triggers fire their actions once, immediately.
Continuous triggers will fire their actions continuously (up to sixty times per second!) as a user interacts, interpolating the action based on the gesture.
Event triggers, like Single triggers, fire their actions immediately, but these triggers are only relevant to specific elements.
Below are Play’s triggers and the circumstances that will cause each trigger to fire.
Single Triggers
Tap
A Tap trigger fires when the user taps an object a given number of times with a given number of fingers.
Number of Taps: Choose between a single, double, or triple tap
Number of Fingers: Choose up to four fingers
Touch
A Touch trigger fires when the user’s finger makes or removes contact with an object.
State: Choose what event the trigger should register. Options include:
Touch Up: the user removes their finger from an object
Touch Down: the user’s finger first touches an object
Any Touch Event
Number of Finger: Choose up to four fingers
Long Press
A Long Press trigger fires when the user presses an object for an extended time.
State: Choose what event the trigger should register. Options include:
Press Began: the user touches the object for the exact selected duration
While Pressing: the user is actively pressing on an object (action occurs for duration of the press)
Press Ended: the user releases their press
Duration: Choose how long the user should hold down their finger before the long press begins firing. The default is 0.5 seconds.
Continuous Triggers
Pan
The Pan trigger detects drag gestures across an object.
State: Choose which drag behavior the trigger should detect. Options include:
Began: the user begins a pan gesture
While Panning: the user is actively panning across an object (action occurs for duration of the pan gesture)
Ended: the user releases their pan gesture
Direction: Choose to limit panning to certain directions, or select Any to detect all. Options include: Up, Down, Left, Right, Up & Down, Right & Left, or Any
Edge Pan
The Edge Pan trigger detects drag gestures starting from the edge of your iPhone.
State: Choose which drag behavior the trigger should detect. Options include:
Began: the user begins a pan gesture
While Panning: the user is actively panning (action occurs for the duration of the pan gesture)
Ended: the user releases their pan gesture
Edge: Choose which iPhone edge the pan should start. Options include: Top, Bottom, Left, and Right.
Scroll
The Scroll trigger detects scroll behavior within any page or container that scrolls.
State: Choose which scroll behavior the trigger should detect. Options include:
Scroll Drag Began: the user begins scrolling
While Scrolling: the user is actively scrolling (action occurs for duration of the scroll)
Scroll Drag Ended: the user lifts their finger after scrolling
Scroll Ended: the scroll decelerates to a complete stop
Status Bar Tapped: the user taps their device’s status bar
Direction: Limit detection to certain directions of scrolling, or select Any to detect all scrolling.
Scroll Range: Choose to only detect scrolling between a certain range of the container. Define the range using percent values in the From and To attributes that appear when Scroll Range is turned on.
Timer
A Timer trigger fires repeatedly at a given interval.
Interval: Set the number of seconds between each fire
Auto Start: Choose if the timer will start automatically when the page is opened. If this is turned off, it will wait for a Start Timer action
Repeat: Set the number of times the trigger should fire. Options include:
1 - 100x: set the exact number of repetitions
Continuous: run the timer indefinitely, or until a Stop Timer action is fired
Shake
A Shake trigger fires when the user shakes their device.
State: Choose whether the trigger should fire when the shake is first detected (Shake Began) or has stopped (Shake Ended)
Gyroscope
A Gyroscope trigger fires continuously as a user tilts their phone along an axis of rotation.
Axis: Choose the axis of rotation that will trigger the gyroscope. Options include:
X Axis: device is tilted towards or away from the user
Y Axis: device is tilted to the left or right
Z Axis: device is rotated clockwise or counterclockwise
Any Axis
From & To: Set the range, in degrees, that the Gyroscope will fire between
Auto Start: Choose if the gyroscope will automatically start measuring orientation when the page is opened. If this is turned off, it will wait for a Set Gyroscope action
Event Triggers
These triggers can be added to any object, but they’ll only work when placed on their specific element.
Event
Events trigger fire when a selected event occurs. There are four types of Event triggers: View, Variable, Device, and Custom. These triggers can only be attached to a page.
Type: View
A View Event trigger fires when the user opens or closes a page.
Event: Choose whether the trigger should fire when the page loads (On Page Load), the page appears (On Appear), or the page disappears (On Disappear)
Type: Variable
A Variable Event trigger fires when a variable is changed.
Variable: Select the variable for this trigger
Event: The only option at this time is On Change which will fire every time a variable's value is changed
Type: Device
A Device Event trigger fires when your device's keyboard hides or shows.
Event: Choose whether the trigger should fire when the native keyboard comes into view (On Keyboard Show) or when the keyboard closes (On Keyboards Hide)
Type: Custom
A Custom Event trigger fires when a defined event occurs, as triggered by another interaction.
Event: Select the Play event that the trigger should register. If no events exist, you can create a new event from the dropdown.
Slider Event
A Slider Event trigger fires when the user changes a slider’s value. This trigger only works when added to a slider element.
Event: Choose what event the trigger should register. Options include:
Slide Started: the user begins sliding the slider
While Sliding: the user is actively sliding the slider (action occurs for duration of the slide)
Slide Released: the user removes their finger from the slider
Value Changed: the user changes the slider’s value (this can happen multiple times within a slide)
Switch Event
A Switch Event trigger fires when the user toggles a switch on or off. This trigger only works when added to a switch element.
Event: Choose what event the trigger should register. Options include:
Switched On: the user flips the switch on
Switched Off: the user flips the switch off
Any Switch Event
Segmented Control Event
A Segmented Control Event trigger fires when the user selects a segment. This trigger only works when added to a segmented control element.
Event: Choose what event the trigger should register. Options include:
Any Segment Selected: the user selects any segment
Segment X Selected: the user selects a specific segment
Stepper Event
A Stepper Event trigger fires when the user changes the stepper value. This trigger only works when added to a stepper element.
Event: Choose what event the trigger should register. Options include:
Value Increased: the user tap on the stepper’s plus side
Value Decreased: the user tap on the stepper’s minus side
Any Stepper Event
Text Field Event
A Text Field Event trigger fires when the user interacts with a text field. This trigger only works when added to a text field element.
Event: Choose what event the trigger should register. Options include:
Focus Started: the user select the text field and opens the keyboard
While Typing: the user is actively typing (action occurs the whole time a user types)
Value Changed: the user changes the contents of the text field
Focus Ended: the user unfocuses the text field and closes the keyboard
Clear Pressed: the user presses the keyboard’s clear button
Picker Event
A Picker Event trigger fires when the user selects a value from a picker. This trigger only works when added to a picker element.
Event: Choose what event the trigger should register. Options include:
Value Selected: the user selects an option from the picker
Date Picker Event
A Date Picker Event trigger fires when the user selects a date or time from a picker. This trigger only works when added to a date picker element.
Event: Choose what event the trigger should register. Options include:
Day Changed: the user changes the date picker’s day value
Month Changed: the user changes the date picker’s month value
Time Changed: the user changes the date picker’s time value
[Year Changed]: the user changes the date picker’s year value
Any Date Picker Event
Map Pin Event
A Map Pin Event trigger fires when the user interacts with a pin on a map. This trigger only works when added to a map element.
Event: Choose what event the trigger should register. Options include:
Pin Selected: the user selects a pin
Pin Unselected: the user unselects a pin
Any Pin Event
Page Loader Event
A Page Loader Event trigger fires when a page is loaded into or removed from a page loader. This trigger only works when added to a page loader element.
Event: Choose what event the trigger should register. Options include:
Page Loaded: a page loader loads a page
Page Removed: a page loader removes its loaded page
Image Event
An Image Event trigger fires when an image is loaded (or fails to load) into an image element. This trigger only works when added to an image element.
Event: Choose what event the trigger should register. Options include:
On Load: an image element loads its contents
Load Failed: an image element fails to load its contents