Part 3: Handle Media Devices Using History State

UsuallyThe thereIVI aresystem allows the use of various Mediamedia devices available in an IVI.devices. The user can chooseselect a certainspecific device inwithin the Media context. He can leave the Mediamedia context and switch to e.g.navigation Navigation.or Onceother hefunctions. comesWhen backreturning to the Mediamedia scene, the correctlast selected Mediamedia device willmust be displayed.displayed correctly.

To achieve this withbehavior in Scene Composer we need toComposer, create a configuration similar configuration to the whatsettings we have already donemade for Navigation, MediaMedia, and Phone:Phone. WeSpecifically, willcreate need separateindividual states for our Media devices Radio, BluetoothBluetooth, and USB.USB, Weand set up two-way transitions between them (e.g. Radio ⇔ Bluetooth).

In addition, you will also need toa configure transitions between these states in both directions (from Radiofunction to Bluetooth, from Bluetooth to Radio etc).

Within these Media States we also have to keep track of the currently selected device within the media scene. To do this, use a History State so that when the user leaves the media context and returns, the device that was last selected is automatically restored.

This tutorial will explain how to set these up in detail.

 

Configure SubChart

The Media device.States Thisthat exist in Main_StateMachine are configured as SubCharts. Within the Media States configured as SubCharts, the States for Radio, Bluetooth, and USB are placed.

Converting a Media State to a Subchart

Double-click on Main_StateMachineSolution in the [ State Machines ] folder in the Solution Explorer.

The State Machine Editor will open and display the Main_StateMachine diagram. After selecting the Media State, select [ Convert to Subchart ] from the context menu.

The Media State will be handledconverted byto a HistorySubchart State.(the Add States for Media Devices Configure the States - OnEntry and OnExit Actions Insert Transitions Configure State Transitions Add History State Test the Configuration - Start the Player

---

Create a Sub Chart for Media

This chartSubchart will be created inside the Media State. Its starting point will be an Initial State, so drag and drop an initial state onto the Media State.

Additionally we will need to add separate states for Radio, Bluetooth and USB. In order to find enough space for these states, we could enlarge the media state using the resize handlesdisplayed in the cornerslower right of the selectedState).
media

state.

AThe more elegant way isoperation to create a subchart. Select theconvert Media State to SubChart is now complete.

To move to the SubChart, select Media State and double-click. To return to the original State Diagram from the SubChart, use the [Hierarchy Navigation Button] in the State/Transition view screen in the upper right of the State Machine Editor panel.

 

Adding an Initial State and pressStates

Double-click on the rightMain_StateMachine mouse button. Fromin the context[ menuState chooseMachines Convert] folder in the Solution Explorer. 

The State Machine Editor panel will be displayed.

After selecting the Media State, double-click to subchart.move

As youthis canis seeimmediately inafter the SubChart conversion, only the Subchart frame will be displayed.

Expand the size of the Subchart by dragging the Subchart frame handle with the mouse.

Expand it to a sufficient size to add the Initial State and States.

In the Subchart, place one Initial State and three States from the toolbar at the top right of the State Machine Editor,Editor.

aChange subchartthe "Media"names willof bethe created.three States you added to Radio, Bluetooth, and USB, respectively.

The newplacement structureof alsothe appearsbasic components is now complete. Continue to configure the OnEntry action and Transition settings.

 

Structure of each State

When transitioning to each State in the panelSubchart on(entering and exiting States), the leftcorresponding inscene must be made active or inactive. In addition, when each scene is made active or inactive, the Media Menu scene text must be set to be displayed or hidden accordingly.

Scene display settings

With the Radio State Machineselected, Editor.click

The inner state "Media" can also be renamed by selecting the name] in the lower left panel and changing the name in the properties panel (or using the keyboard shortcut F2).

This inner state "Media" can be accessed by double-clicking the initial state inof the State Machine Editor orpanel.

The Fusion panel for the Radio State will be displayed. Drag the [ On Entry Actions ] connector on the right of the Radio Fusion node and move the mouse.

A link will appear as you move the mouse, so release the left mouse button at the any location.

The [ Select Behavior ] dialog will be displayed. The selectable behaviors will be displayed by double-clickingcategory.
Select “Action > Transition > Transition Request” from the list and connect it to the top node.

You can also narrow down the list of behaviors in the panel.dialog search

field at the top of the dialog.

The nextTransition stepRequest is connected to add[Radio states> On Exit Actions].
Repeat the same process for the media[On devicesExit andActions] transitions between them intoof the subchart.Radio InFusion ordernode to haveconnect enoughthe spaceTransition Request Fusion node.

Make the following settings for the statestwo resizeTransition Requests that you have connected.
On Entry Actions RequestType Activate Identifier Media Radio scene On Exit Actions RequestType Deactivate Identifier Media Radio scene
Repeat the SubChartsame procedure to make similar settings for Bluetooth and USB State.
Phone State On Entry Actions RequestType Activate Identifier Media Bluetooth scene On Exit Actions RequestType Deactivate Identifier Media Bluetooth scene Media State On Entry Actions RequestType Activate Identifier Media USB scene On Exit Actions RequestType Deactivate Identifier Media USB scene

Text Display Settings

With the Radio State usingselected, click [ Fusion ] at the resizebottom handlesleft of the selectedState Media_SubChartMachine state,Editor thatpanel.

The Fusion panel for the Radio State will be displayed. Drag the [ On Entry Actions ] connector on the right of the Radio Fusion node and move the mouse.

A link will appear whenas you move the mouse, so release the left mouse button at the any location.

The 'Select Behavior' dialog will appear. The available behaviors will be displayed in categories.
Select "Action > Property > Enable Rendering" from the list and connect it to the top node.

You can also narrow down the list of behaviors in the dialog by entering "Enable Rendering" in the search field at the top of the dialog.
Enable Rendering is selected.connected

---

Repeat

Addthe Statessame process for Mediathe Devices

[On

OurExit sampleActions] IVIof willthe provideRadio threeFusion Medianode Devices.to So,connect let'sthe addEnable Rendering Fusion node.

Make the following threesettings states intofor the subchart:two Bluetooth USB

---

ConfigureFollow the Statessame -procedure OnEntryto make similar settings for Bluetooth and OnExitUSB State. 

Phone State On Entry Actions TargetNode Scenes>Main Menu>OverlayLayout>Bluetooth Visible Enable On Exit Actions TargetNode Scenes>Main Menu>OverlayLayout>Bluetooth Visible Disable Media State On Entry Actions TargetNode Scenes>Main Menu>OverlayLayout>USB Visible Enable On Exit Actions TargetNode Scenes>Main Menu>OverlayLayout>USB Visible Disable

Adding a Transition

We havewill tonow configurecreate whata happenstransition whenbetween the states are entered and when they are exited. Our configuration here will be similar to what we did for Navigation, Media and Phone.

When a state is entered, we have tocreated activateso far.

Setting the respectiveInitial SceneState

with

We awill TransitionRequest. Whenset the state is exited, the Scene has to be deactivated again with a TransitionRequest.

Additionally, we want the Media_Menu Scene to display the currently active Media Device. This is also configured with an OnEntry and an OnExit Action.

Configure all States (Radio, USB and Bluetooth) in a similar way:

---

Insert Transitions

Now it's time to draw a transition from the Initial State to the Radio State, which is the initial state.

Double-click on Main_StateMachine in the [ State Machines ] folder in the Solution Explorer.

The State Machine Editor will appear. After selecting Media State, double-click on it and move it into the SubChart. Drag and drop [ Transition ] from the toolbar at the top of the panel to the Initial State in the Subchart.

The Transition will be ourconnected default media device. Connectto the statesInitial withState, and it will be ready to be placed.
While the Transition is ready to be placed, click on the Radio State.

The Initial State and Radio State will be connected by the Transition.
The direction of the Transition connection is from the Initial State to the Radio State.

With this setting, the transition to the Radio State has been configured as the initial state of the Media State (Subchart).

Transition settings between each State

Next, we will set up the transitions intobetween botheach directionsState (similarRadio, Bluetooth, USB).

From the toolbar at the top right of the State Machine Editor, drag the Transition and drop it onto the Radio State (the starting side of the transition).

The Transition (arrow) will appear on the State Machine Editor and be ready to whatbe wedragged.

did Extend the Transition (arrow) to the Bluetooth State (end of transition) and click.

The two states, Radio and Bluetooth, will be connected by an arrow.

With the added Transition selected, click [ Fusion... ] at the bottom left of the State Machine Editor panel.

The Fusion panel will open, and the Fusion diagram for Navigation,the MediaTransition will be displayed.
The Check Click Fusion node is connected to the connector (Condition) at the top right of the Transition Fusion node.

Select the Check Click Fusion node that is connected by default, and Phone) Betweenpress the 3Delete stateskey. Radio,

USBThe Check Click Fusion node will be deleted.

Drag the connector (Condition) at the upper right of the Transition Fusion node, move the mouse, and Bluetoothrelease wethe needleft transitionsmouse button at the any location.

The [Select Behavior] dialog will open.

Enter “Check Key Input” in boththe directions:search Double-click Check Key Input.

The Check Key Input Fusion node will be linked to the Condition connector of the Transition Fusion node.

Drag the connector (Actions) at the bottom right of the Transition Fusion node, move the mouse, and release the left mouse button at the any location.

The [Select Behavior] dialog will open.

Enter “Transition Request” in the search field at the top of the dialog.

The list of behaviors in the dialog will be narrowed down, and Action > Transition > Transition Request will be displayed.

Double-click Transition Request.

The Transition Request Fusion node will be linked to the Actions connector of the Transition Fusion node.

Make the following settings for the Transition Request Fusion node.

Clicking the upward-pointing arrow icon in the upper right of the Fusion panel will switch the display to the State.

Check Key fromInput

Radio toUSB from USB to Bluetooth from Bluetooth to Radio KeyCode Key_DownArrow

from RadioTransition toRequest RequestType Activate Identifier Scenes＞Media Bluetooth from Bluetooth to USB from USB to Radio








Repeat the above steps 1 to 11 to set the following five transitions.

The RequestType for all of these is Activate (default).

TheTransition

resulting subchartCheck Key Input＞KeyCode Transition Request>Identifier Bluetooth to USB
Key_DownArrow Scenes＞Media USB USB to Radio Scenes＞Media Radio Radio to USB

Key_UpArrow

Scenes＞Media USB

USB to Bluetooth Scenes＞Media Bluetooth Bluetooth to Radio Scenes＞Media Radio








When all settings are complete, the screen will look aslike follows.the one below.

With the above settings, the scene that is displayed when a transition occurs from each scene in the subchart has been set.

---

ConfigureChecking Statethe Transitionsscreen transition

TheUse userthe should be ablePlayer to navigatecheck fromthe screen transition.

Click the [ Play selected scenario ] icon on the toolbar to start the Player.

Three windows will open, and you can see that the simulation display, one mediaof devicethe windows, displays the “Navi Title” and “Navigation” text, and that the initial transition has occurred to the otherMain usingMenu and Navigation scenes.
Pressing the right arrow key on the keyboard switches the text on the screen, and “Media Title”, “Radio Title”, and “Radio” are displayed in the simulation display, and the transition to the Media Menu scene (Subchart) is performed.

Pressing the up and down arrow key.keys Thison canthe bekeyboard configuredswitches the text on the screen, and the transition to the “Radio”, “Bluetooth”, and “USB” scenes in the transitionsSubchart (similaris performed sequentially.

Close the CGI Panel and exit the Player.

All three windows that were open will close.

In addition to navigatingthe switching between the Navigation, Phone and Media scenes set in Part 2, we were able to confirm that it is also possible to switch between the Radio, Bluetooth and Phone).

USB

Allscenes, clockwisewhich transitionsare subcharts. However, at present, even if you switch to a scene placed in a subchart in the Media scene, when you transition back to the Navigation or Phone scene (namedusing *_next)the left and right directional keys) and then return to the Media scene, the Radio scene, which is always set as the initial scene of the Media scene, will be configured for Key_DownArrow and all counter-clockwise transitions (named *_prev) will be configured for Key_UpArrow.displayed.

scene

---

that was displayed immediately before, you can do this by placing a History State in the Subchart.

 

Configure History State

AddPlacing the History State

When

youDouble-click saveon yourMain_StateMachine solution and startin the player[ now,State youMachines can] switchfolder from Navigation to Media usingin the Key_RightArrow.Solution UseExplorer. the

Key_DownArrowThe toState changeMachine Editor will appear.
After selecting the Media Device.State, Usedouble-click to move it into the Key_RightArrowSubChart.

to navigate to Phone. If you now press the Key_LeftArrow to go back to Media, you will see that "Radio" is selected again, although you have chosen a different device earlier.

To handling such use cases, you need to replace

Select the Initial State of the Media_SubChart with a History State. Open the Media_SubChart in the State Machine Editor, select the Initial StateSubchart and press the deleteDelete key.

The Initial State in the Subchart will be deleted. Drag and itsdrop transition[ History State ] from the toolbar at the top of the panel into the Subchart.

The History State will be placed in the Subchart.
Drag and drop [Transition] from the toolbar at the top of the panel into the Subchart.

The Transition will be connected to the Initial State, and it will be ready to be placed. While the Transition is ready to be placed, click on the Radio State.

The History State and Radio State will be deleted.connected Now, drag and drop a History State intoby the Media_SubChart.Transition.

Draw a transition from

Checking the History State to the Radio State, our default Media Device.
The History State will remember which state was active last time and perform thescreen transition

to the correct Media Device.

---

Test the Configuration - Start

Use the Player

Saveto yourcheck solutionthe andscreen transition.

Press the [Play selected scenario...] icon on the toolbar to start the player.Player.

After the Player is opened,and you can see that the simulation display shows “Navi Title” and “Navigation” text, and that the initial transition has occurred to the Main Menu and Navigation Scene.scenes.
When Pressing

Press the Key_RightArrow,right arrow key on the transitionkeyboard once.

The text “Media Title”, “Radio Title” and “Radio” will appear, and you will be taken to the Media Menu scene is(Subchart).
performed Press the down arrow key on the keyboard once.

The text on the screen will change, and the“Bluetooth selectedTitle” deviceand is“Bluetooth” will appear. Press the defaultright devicearrow "Radio".key Ifon youthe keyboard once, and then press the Key_DownArrowleft toarrow changekey once.

On the selectedsimulation mediadisplay, device,“Phone USBTitle” will be thedisplayed, selectedand device.then

Key_LeftArrow. The “Media SceneTitle” shouldwill be visibledisplayed again,again.

displayingIn this case, “Bluetooth” will be displayed. Close the USBCGI device.Panel Thisand meansexit the Player.

All three windows that were open will close.

By replacing the Initial State in the Subchart with the History State, you can see that the Historyscene Statetransition isin working,the itSubchart has broughtbecome usa backstate tothat remembers the recentlystate selectedof device.the previous transition.