Qt Safe Renderer Examples Monitor: Verifying the Rendering Output

C

Indicators: Creating Safety-Critical UI

The Indicators example demonstrates how you can use Qt Quick project and Qt Quick UI Forms (.ui.qml files) to create a UI that contains safety-critical UI elements, that is, QML types. The same UI can also contain non-safe UI elements but in the Indicators example, we have only safety-critical elements in the UI.

When you run Indicators on your host platform, its application window shows by default the content that is defined in the MainForm.ui.qml file. The Control UI window provides a set of controls for changing the state of the safety-critical elements in the main form, that is, gears and speed. The gear selector demonstrates transition animations over QML properties and state changes.

Enabling Qt Safe Layout Tool

In Qt Quick UI forms, you can add safety-critical UI elements to your UI by using safe QML types provided by Qt Safe Renderer. When you build the project, Qt Safe Layout Tool automatically generates the safe layout data for those safe QML types. In order to enable Qt Safe Layout Tool in your project, you must define the following variables in the project (.pro) file:

Variable	Description
CONFIG += qtsaferenderer	Both Qt Safe Layout Tool and Qt Resource Compiler Tool are automatically enabled. Alternatively, you can enable just Qt Safe Layout Tool.
CONFIG += qtsafelayouttool	Adds the Qt Safe Layout Tool's configuration to the project. Note: If you have defined CONFIG += qtsaferenderer, Qt Safe Layout Tool is already added to your project.
SAFE_QML	Defines .ui.qml files that contain safety-critical QML types.
SAFE_LAYOUT_PATH	Defines a path where the generated safe layout data is saved.

In the indicators.pro file, these variables are defined as follows:

CONFIG += qtsaferenderer
SAFE_QML = $$PWD/MainForm.ui.qml
SAFE_LAYOUT_PATH = $$PWD/layoutData
SAFE_RESOURCES += safeasset.qrc

When you build the Indicators project, the layout data will be generated in the layoutData folder under the Indicators project directory. The generated data is added to the safe resource file as defined in SAFE_RESOURCES.

Safety-Critical QML Types in UI Forms

Indicators has one .ui.qml form that contain safe QML types: MainForm.ui.qml. You can open the form to Qt Quick Designer by double-clicking the .ui.qml file.

In Qt Quick Designer, there are three safe QML types available: SafeText, SafeImage and SafePicture. Indicators contains only SafePicture QML types. ISO icons have been added for each safe picture.

In the .pro file, the used ISO icons are listed under ISO_ICONS as follows:

ISO_ICONS += \
    iso_grs_7000_4_2423 \
    iso_grs_7000_4_0238 \
    iso_grs_7000_4_0245 \

Project file also lists the generated iso-icons.qrc file under RESOURCES:

RESOURCES += qml.qrc \
    iso-icons.qrc

Running the Example

If you like to test the safe QML types yourself, you can add some new safe QML types to the Qt Quick UI forms in Indicators. The safe QML types behave just like any other QML types so you can add new types by dragging and dropping them to the form. Note that the background of the Indicators UI is black so you should remember to use some other color for new safe texts and pictures.

You can test your UI updates on the host platform simply by building and running the Indicators example:

Select Build > Run QMake.
Select Build > Build Project <a project name>.

To run the project, select Build > Run.

Example Files

Files:

Images:

Qt Safe Renderer Examples Monitor: Verifying the Rendering Output

Available under certain Qt licenses.
Find out more.