interactions

The interactions module and related APIs provide read only information about the document's interactive prototype mode, including:

Since: XD 19

Example

// Get all interactions in the entire document (grouped by triggering node)
var allInteractions = require("interactions").allInteractions;

// Get interactions triggered by the selected node
var nodeInteractions = selection.items[0].triggeredInteractions;

// Get all interactions leading to a particular artboard
var artboard = ...
var interactionsToArtboard = artboard.incomingInteractions;

// Print out details of one particular interaction
var interaction = ...
console.log("Trigger: " + interaction.trigger.type + " -> Action: " + interaction.action.type);

See Interaction documentation below for an example of what an Interaction object looks like.

Typedefs

Typedef Interaction

An interaction consists of a Trigger + Action pair and is attached to a single, specific scenenode.

Property Type Description
trigger !Trigger User gesture or other event which will trigger the action.
action !Action Action that occurs.

Example:

{
    trigger: { 
        type: "tap"
    },
    action: {
        type: "goToArtboard",
        destination: /* Artboard node */,
        preserveScrollPosition: false,
        transition: {
            type: "dissolve",
            duration: 0.4,
            easing: "ease-out"
        }
    }
}

Note: Interaction objects are not plain JSON – they may reference scenenodes (as seen above) and other strongly-typed objects.

Typedef Trigger

Event which triggers an interaction.

Property Type Description
type string One of the trigger types listed below.
"tap"

When the user clicks or taps on a scenenode.

"drag"

When the user drags or swipes a scenenode. Can only trigger a goToArtboard action with the autoAnimate transition style.

"time"

Once a set amount of time elapses (this trigger type only exists on Artboard nodes). Additional Trigger properties:

Property Type Description
delay number Delay time in ms.
"voice"

When the user speaks a specific voice command. Additional Trigger properties:

Property Type Description
speechCommand string Phrase the user speaks to trigger this command.

Typedef Action

Action performed when the trigger occurs. Current action types are:

Property Type Description
type string One of the action types listed below.
"goToArtboard"

Navigate the entire screen to view a different artboard. Additional Action properties:

Property Type Description
destination !Artboard Artboard to navigate to.
transition !Transition Animation style with which the view transitions from the old Artboard to the new one.
preserveScrollPosition boolean If both Artboards are taller than the viewport, attempts to keep the user's current scroll position the same as in the outgoing artboard.
"overlay"

Displays a second artboard overlaid on top of the current one. Additional Action properties:

Property Type Description
overlay !Artboard Artboard to show on top.
transition !Transition Animation style in which the second Artboard transitions into view. Only certain transition types are allowed for overlays.
overlayTopLeft !{x:number, y:number} Position of the overlay Artboard, in the current/base Artboard's coordinate space.
"goBack"

Reverse the last "goToArtboard" or "overlay" action, replaying in reverse whatever transition it used.

"speak"

Speak with audio output to the user. Additional Action properties:

Property Type Description
speechOutput string Phrase to speak to the user.
locale string Locale determines the pronounciation and accent of the digital voice. Includes both language and region (e.g. "en-us").
voice string "Persona" of the digital voice to use. Available personas vary by locale.

Typedef Transition

Animation style with which "goToArtboard" and "overlay" actions transition from/to Artboards.

Property Type Description
type string One of: "autoAnimate", "dissolve", "push", "slide", "none"
fromSide string (If type = "push" or "slide"). One of: "L", "R", "T", "B"
duration number Length of animation in seconds.
easing string One of: "linear", "ease-in", "ease-out", "ease-in-out", "wind-up", "bounce", "snap"

interactions.homeArtboard : ?Artboard

The starting Artboard seen when the interactive prototype is launched.

Kind: static property of interactions Read only: true

See: Artboard.isHomeArtboard


interactions.allInteractions : !Array<!{triggerNode: !SceneNode, interactions: !Array<!Interaction>}>

Returns a collection of all interactions across the entire document, grouped by triggering scenenode. Each entry in this array specifies a triggerNode and the result of getting triggerNode.triggeredInteractions.

May include interactions that are impossible to trigger because the trigger node (or one of its ancestors) has visible = false.

Note: currently, this API excludes all of the document's keyboard/gamepad interactions.

Kind: static property of interactions Read only: true

results matching ""

    No results matching ""