Skip to main content

Overview

The Solution "Getting Started Controls" shows basic use cases with our Controls. Besides how to use the Controls themselves it shows how they can be connected with each other to implement basic HMI logic. The next pages represent a step-by-step tutorial of how a simple HMI can be created with the Controls. The actual sample Solution differs from the step-by-step tutorial because it shows advanced Controls too. In more detail it differs in the following points:

Screens

  • Phone (ScenePhone): A phone screen has been added which shows usage of advanced Controls.
  • Menu (SceneMenuTabs) : The menu bar has been extended because new screens have been added.
  • Options (SceneOptions): An options screen has been added which shows further usage of advanced Controls.
  • SoundOptions (SoundOptions): The sample solution includes a scene that uses Core controls to configure various audio-related settings. For more information about each Core control used in the scene, please refer to Core. The SoundOptions scene is configured as part of the SceneOptions.

    This Core Controls sample solution showcases a lightweight Control Set optimized for low-end devices. It includes only essential controls, enabling safe performance testing and validation on memory-constrained platforms.

Controls

  • BreadCrumb: The Options screen was mainly introduced to show how the BreadCrumb works. There are various subscreens in the options menu that can be accessed via the BreadCrumb. Further wise a state machine has been added just for the BreadCrumb which manages the transitions between the BreadCrumb scenes and the BreadCrumb actions.
  • Dynamic List: The phone screen consists of a dynamic list. It is important to know that in the Player some code had to be implemented that allows phone-book entries and adding them. By pressing the "Add Contact"-Button of the phone screen a input mask will appear that allows to pass contact data.
  • Drawer: The drawer is used two times in the sample. First of all the menu in the bottom of the screen appears as a drawer if the user hovers over the corresponding Control (at the bottom of the screen). To close the menu-drawer the "X"-Button in the right side of the menu has to be pressed. The second appearance of the Drawer Control is in the phone screen. The input mask after pressing the "Add Contact"-Button is realized as a drawer.
  • Roll: The time-options screen includes three rolls for setting the time (seconds, minutes and hours).
  • Keyboard: When clicking on of the time-rolls an on-screen keyboard appears which allows setting the time-values.

Transitions

Simple Transitions have been added to realize a better flow of scene switching. All the scenes have a "Slide"-Transition whereas the activated scene will slide from left to right into the correct position. An exception is the Options menu. The scenes of the options menu work similar except that they "Fade" instead of "Slide" (which has been realized via a "Variant").

The following pages represent the step-by-step tutorial of how a simple HMI can be realized with the Controls: