Roku Developer Program

Developers and content creators—a complete solution for growing an audience directly.
cancel
Showing results for 
Search instead for 
Did you mean: 
dreamer2057
Level 7

Navigation. The Right Way

Hello! How right implement navigation?

I need

1) Custom Controls, which will be repeats in different part of application
2) Custom pages (for example videos, epg, settigns).
3) The animated behavior

Examples are too poor. If i right understand:

1) I should use components, described in xml/brs files, something like

<component name="MenuBar" extends="Group" >


2) How to implement different pages separately with some show/hide behaviour? Scenes?


scene = screen.CreateScene("GuideScene")
screen.show()


3) Again, i need to use components?


<LayoutGroup id = "menuBar" itemSpacings = "[85]" translation="[640,1000]" layoutDirection = "horiz" horizAlignment = "center" vertAlignment = "center" >
<Poster
id="testPoster"
uri="pkg:/images/mm_icons_guide.png"
width="0.0"
height="0.0"
translation="[0,0]"
opacity="1.0"/>
<Poster
id="testPoster4"
uri="pkg:/images/mm_icons_search.png"
width="0.0"
height="0.0"
translation="[0,0]"
opacity="0.2"/>
<Poster
id="testPoster5"
uri="pkg:/images/mm_icons_settings.png"
width="0.0"
height="0.0"
translation="[0,0]"
opacity="0.2"/>
</LayoutGroup>
<ParallelAnimation id = "ShowMenu" > <!--** ParallelAnimation id = "testParallelAnimation" repeat = "true" **-->
<Animation id = "testPosterAnimation" duration = "0.4" easeFunction = "linear" >
<Vector2DFieldInterpolator key= "[0, 1]" keyValue= "[ [640, 1000], [640, 620] ]" fieldToInterp="menuBar.translation" />
<FloatFieldInterpolator key= "[0, 1]" keyValue= "[ 0.2, 1]" fieldToInterp="menuBar.opacity" />
</Animation>
<Animation id = "testPosterBckgAnimation" duration = "0.4" easeFunction = "linear" >
<Vector2DFieldInterpolator key= "[0, 1]" keyValue= "[ [0, 870], [0, 490] ]" fieldToInterp="testPosterBckg.translation" />
<FloatFieldInterpolator key= "[0, 1]" keyValue= "[ 0.2, 1 ]" fieldToInterp="testPosterBckg.opacity" />
</Animation>
<Animation id = "testPosterSelectAnimation" duration = "0.4" easeFunction = "linear" >
<Vector2DFieldInterpolator key= "[0, 1]" keyValue= "[ [230, 910], [230, 530] ]" fieldToInterp="testPosterSelect.translation" />
<FloatFieldInterpolator key= "[0, 1]" keyValue= "[ 0.2, 1 ]" fieldToInterp="testPosterSelect.opacity" />
</Animation>
</ParallelAnimation>
Sincerely, Sergey Shoshin, software developer.
0 Kudos
1 Reply
dreamer2057
Level 7

Re: Navigation. The Right Way

The best navigation method in New Graph scene is manipulations of items in one main scene, as roku's says:


Engineering's Response:
So you can create the “illusion” of having multiple Scenes by selectively making the current “scene” invisible and replacing it (appending) another component, then “go back” when needed by removing/disappearing the component “scene” and making the original “scene” visible again (not unheard of for UI programming, in fact). Again, you probably want to use your Scene node as your “master control” node.


http://forums.roku.com/viewtopic.php?f=34&t=88621&start=90
Sincerely, Sergey Shoshin, software developer.
0 Kudos