@blackpixel/framer-remotelayer
v2.0.0
Published
A Framer module for creating an interactive Apple TV remote for tvOS prototypes.
Downloads
3
Readme
RemoteLayer Framer Module
The RemoteLayer module allows you to instantly generate an interactive Apple TV remote for your tvOS app prototypes. You can choose your preferred styling, alignment, animation and button highlight color. All buttons (and swipes on the touchpad) can be configured to perform your own supplied actions.
Installation
NPM Installation
$ cd /your/framer/project
$ npm i @blackpixel/framer-remotelayer
Manual Installation
Copy / save the RemoteLayer.coffee
file into your project's modules
folder.
Adding It To Your Project
In your Framer project add the following:
// If you manually installed
RemoteLayer = require 'RemoteLayer'
// Else
RemoteLayer = require '@blackpixel/framer-remotelayer'
myRemote = new RemoteLayer
Assigning Actions to Buttons
myRemote = new RemoteLayer
menuAction: -> <action>
homeAction: -> <action>
micAction: -> <action>
playPauseAction: -> <action>
volumeUpAction: -> <action>
volumeDownAction: -> <action>
clickAction: -> <action>
swipeUpAction: -> <action>
swipeDownAction: -> <action>
swipeLeftAction: -> <action>
swipeRightAction: -> <action>
API
new RemoteLayer
Instantiates a new instance of RemoteLayer.
Available options
myRemote = new RemoteLayer
align: <string> ("left" || "center" || "right")
margin: <number>
fromBottom: <number>
gloss: <boolean>
transition: <string> ("fade" || "pop")
hide: <boolean>
autoHide: <boolean>
highlightColor: <string> (hex or rgba)
Setting autoHide
implicitly sets hide
to true.
Returns
Layer
(Object): A newly instantiated Framer Layer.
myRemote.show()
Show the RemoteLayer instance.
myRemote.hide()
Hide the RemoteLayer instance.
myRemote.align(align, margin, fromBottom)
Useful if you wish to change the remote location some time after initialization.
Arguments
align
(String): One of ("left" || "center" || "right")margin
(Number): Layer margin valuefromBottom
(Number): Distance from bottom of screen
myRemote.hidden
readonly
Returns
(Boolean): Whether or not the RemoteLayer is currently hidden
Website: blackpixel.com · GitHub: @bpxl-labs · Twitter: @blackpixel · Medium: @bpxl-craft