Forum Discussion

fry19's avatar
fry19
Binge Watcher
6 years ago

fieldToInterp for a top level component

I am trying to extend the Poster component this way:

 

<?xml version="1.0" encoding="utf-8" ?>

<component name="PosterWithFadeIn" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" extends="Poster" xsi:noNamespaceSchemaLocation="http://rokudev.roku.com/rokudev/schema/RokuSceneGraph.xsd">

  <children>
    <Animation
      id = "fadeIn"
      duration = "1"
      easeFunction = "linear" >

      <FloatFieldInterpolator
        key = "[ 0.0, 1.0 ]"
        keyValue = "[ 0.0, 1.0 ]"
        control="start"
        fieldToInterp = "????.opacity" />

    </Animation>
  </children>

</component>

The issue is that I have never seen any example that refers to the "main" component in an animation "fieldToInterp" attribute.

 

What shall I use? I tried "opacity", ".opacity", "m.top.opacity" and nothing works...

 

Thanks

Roku Developer Program

6 Replies

  • speechles's avatar
    speechles
    Roku Guru
    6 years ago
    <component name="PosterWithFadeIn" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" extends="Poster" xsi:noNamespaceSchemaLocation="http://rokudev.roku.com/rokudev/schema/RokuSceneGraph.xsd">

  <children>

        <Poster id="myPoster" loadheight="250" loadwidth="400" width="400" height="250" uri="" opacity="0.0" />
    
    <Animation
      id = "fadeIn"
      duration = "1"
      easeFunction = "linear" >

      <FloatFieldInterpolator
        key = "[ 0.0, 1.0 ]"
        keyValue = "[ 0.0, 1.0 ]"
        fieldToInterp = "myPoster.opacity" />

    </Animation>
  </children>

</component>

     


    ...

    the in brs:

    m.poster = m.top.findnode("MyPoster")
    m.animation = m.top.findnode("fadeIn")
    m.poster.uri = < uri >

    then during times when you want the animation and the poster to show use this:
    m.animation.control = "stop"
    m.animation.control = "start"

    stop it always before you start it. you can only start a stopped task.

    • fry19's avatar
      fry19
      Binge Watcher
      6 years ago

      speechlesUnfortunately this does not answer the question I am asking. The top component is already a Poster (<component ... extends="Poster"...>).

       

      In Brightscript I can simply access the "opacity" of the component by writing "m.top.opacity" and I want to access this very field in the animation. Not create another poster inside a Poster component.

       

      The solution you propose also has the issue that if you write <PosterWithFadeIn uri="xxxx"/> the attribute uri is applied to the main component, not the one you define inside (and that is true for every single attribute...). This is why I am extending from Poster...

       

      The question is to access the opacity field of the main component (or any other field for that matter) via the fieldToInterp attribute in the animation.

       

      • speechles's avatar
        speechles
        Roku Guru
        6 years ago
        <?xml version="1.0" encoding="utf-8" ?>

<component name="PosterWithFadeIn" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" extends="Poster" xsi:noNamespaceSchemaLocation="http://rokudev.roku.com/rokudev/schema/RokuSceneGraph.xsd">

  <interface>
            <field id="height" type="integer" value="0" alwaysNotify="true" onChange="OnChange" />
            <field id="width" type="integer" value="0" alwaysNotify="true" onChange="OnChange" />
            <field id="uri" type="integer" value="0" alwaysNotify="true" onChange="OnChange" />
            <field id="opacity" type="float" value="1.0" alwaysNotify="true" onChange="OnChange" />
            <field id="translation" type="array" value="[0, 0]" alwaysNotify="true" onChange="OnChange" />
          </interface>

  <children>

    <Poster id="idPoster" />

    <Animation
    id = "fadeIn"
    duration = "1"
    easeFunction = "linear" >

    <FloatFieldInterpolator
    key = "[ 0.0, 1.0 ]"
    keyValue = "[ 0.0, 1.0 ]"
    control="start"
    fieldToInterp = "idPoster.opacity" />

    </Animation>

  </children>

</component>

         

        Then in the BRS:

         

        Function OnChange()
    m.poster = m.top.findnode("idPoster")
    m.poster.height = m.top.height
    m.poster.width = m.top.width
    m.poster.opacity = m.top.opacity
    m.poster.uri = m.top.uri
            m.poster.translation = m.top.translation
End Function

         

  • T0's avatar
    T0
    Channel Surfer
    5 years ago

    In your component's init() function, set the id to some value, e.g.

    sub init()
    m.top.id = "fadingPoster"
end sub

     

    then set 

    fieldToInterp = "fadingPoster.opacity"

     

    • T0's avatar
      T0
      Channel Surfer
      5 years ago

      Actually, no, that doesn't work. You can set the id of the component to be animated in brightscript to have it match the interpolator's fieldToInterp value, but it only works if the component is a child. The animation code must do a search of the top level component's children, but ignores the top level component itself.

      Your best bet is to make the top level component a Group and replicate all the Poster fields you need.