roku-image-fader

Fades an image in roku scene graph


Keywords
ropm, brightscript, scenegraph, rokucommunity, components, animation, poster
License
MIT
Install
npm install roku-image-fader@0.1.0

Documentation

Roku Image Fader

Drop in component for fading between 2 posters.

build NPM Version

Installation

Using ropm

ropm install roku-image-fader

suggestion: use a shorter prefix:

ropm install if@npm:roku-image-fader

Usage

Follow these steps:

  1. Declare an image fader component
  2. Set uri

Declare an Image Fader component

In XML

without prefix:

  <rokuimagefader_ImageFader
      id="backgroundImage" />

using if prefix:

  <if_ImageFader
      id="backgroundImage"/>

In Brighterscript

without prefix:

  backgroundImage = createObject("roSGNode", "rokuimagefader_ImageFader")

using if prefix:

  backgroundImage = createObject("roSGNode", "if_ImageFader")

Using the image fader

Use the following properties:

property description
uri uri of next image
isAnimated controls if fade animation is applied
ShadeOpacity opacity for the shade overview
scaleMode same as poster.scaleMode
backgroundColor color of background between fades

callFunc convenience

As a convenience, you can do the following

image.callFunc("changeImage", uri, isAnimated)

This allows for setting of the uri, while providing an animation override.