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" >
  1. How to implement different pages separately with some show/hide behaviour? Scenes?

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

  1. 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>

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