Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: found and replaced Scene Graph with SceneGraph (no space)

...

Finally, let's put together all the examples we've seen previously in the tutorial, to create a typical Roku Scene Graph SceneGraph application. As with every application, this application has a purpose. And the purpose of this application is to present all the various node classes and design/development principles for Roku Scene GraphSceneGraph, to let you quickly select node classes and design ideas for your application.

...

The first "screen" consists of a categories list panel (a medium-size panel), and a category description panel (another medium-size panel), as part of the tutorial panel set. If you press the remote control OK or Right key, a full-size examples grid panel slides into view, and moves the two medium-size panels out of view (the Overhang node title also changes from Scene Graph SceneGraph Examples to the name of the example category as shown in this tutorial). If you select an example by pressing the remote OK key while the focus indicator is on the example image, you'll see the example in action as the examples grid panel is replaced by the example "screen". Pressing the Back key while in the example "screen" causes the examples "screen" to be replaced by the examples grid panel; pressing Back (or Left when the focus indicator is on a left-hand grid image) slides the examples grid panel off the screen and replaced with the original two medium-size panels.

...

Note that if you've gone through the Scene Graph SceneGraph XML Tutorial from the beginning to here, there is very little contained in SceneGraphTutorial.zip that you haven't seen before. What this application does is pull together all the various Scene Graph SceneGraph nodes, components, designs, and development principles into a single application. So to complete the tutorial, we only need to describe certain aspects of the scene component file, tutorialpanelsetscene.xml, and how it pulls together the entire application, along with the associated server XML files.

Looking at tutorialpanelsetscene.xml, you'll see that there is no <children> element XML markup to define Scene Graph SceneGraph nodes and components. Rather, tutorialpanelsetscene.xml is used only to create, manipulate, and remove components in the application scene graphSceneGraph, which are defined in the all the other XML component files in the application components directory.

...

The goal of a video-on-demand application is to allow a user to select a video for playback. Roku Scene Graph SceneGraph provides a wide variety of UI elements to allow a user to proceed from starting the application to actually playing the video in a variety of different ways, with many different custom UI designs possible. Note that all of the lists and grids, widgets, other built-in node classes, and custom markup components you create, can be used in virtually unlimited combinations and variations to design a unique user interface for your VOD application.

...

The runselectedexample() callback function is largely the endpoint for this tutorial application. The application was designed to show the built-in node classes and design principles of Roku Scene GraphSceneGraph, and the runselectedexample() function replaces the example grid panel (and panel set) with a "screen" showing a Roku Scene Graph SceneGraph example in action, after a user selects an item in the examples grid panel.

...

As described in Key Events Markup, the remote key press to handle is conditionalized, the actions to take for that key press are defined, then the function returns true to stop any further automatic handling of that key press (otherwise a Back key press could cause the entire application to exit). In this case, in the Back key press condition, we check if an example is currently running, by checking that the m.currentexample object we created for the example exists. If so, we delete it from the scene graph SceneGraph using removeChild(), and mark it as invalid so any further Back key presses will not meet the key press handling condition. Then we make the scene Overhang and PanelSet nodes visible again, and set the focus back on the examples grid panel.

And that's how you replace a new "screen" with an old "screen" in Roku Scene GraphSceneGraph...

What About The Dialog Node Examples?

...