jf-roku/components/photos/PhotoDetails.xml

<?xml version="1.0" encoding="utf-8"?>
<component name="PhotoDetails" extends="JFScreen">
  <children>
    <Poster id="photo" width="1920" height="1080" loadDisplayMode="scaleToFit" />
    <Rectangle id="background" color="0x101010EE" height="120" width="500" Translation="[700, -150]" opacity="0">
      <Label id="status" font="font:MediumSystemFont" height="100" width="500" horizAlign="center" vertAlign="bottom" />
    </Rectangle>
    <Timer id="slideshowTimer" duration="5" repeat="false" />
    <Timer id="statusTimer" duration="2" repeat="false" />

    <Animation id="showStatusAnimation" duration="1" repeat="false">
      <FloatFieldInterpolator key="[0.0, 0.1]" keyValue="[0, 1]" fieldToInterp="background.opacity" />
      <Vector2DFieldInterpolator key="[0.1, 1]" keyValue="[[700, -150], [700, -5]]" fieldToInterp="background.translation" />
    </Animation>
    <Animation id="hideStatusAnimation" duration="1" repeat="false">
      <Vector2DFieldInterpolator key="[0.0, 0.9]" keyValue="[[700, -5], [700, -150]]" fieldToInterp="background.translation" />
      <FloatFieldInterpolator key="[0.9, 1]" keyValue="[1, 0]" fieldToInterp="background.opacity" />
    </Animation>

  </children>
  <interface>
    <field id="itemsNode" type="node" />
    <field id="itemsArray" type="roArray" />
    <field id="isSlideshow" type="bool" onChange="isSlideshowChanged" />
    <field id="isRandom" type="bool" onChange="isRandomChanged" />
    <field id="itemIndex" type="integer" value="-1" onChange="itemContentChanged" />
  </interface>
</component>