Skip to content

Architecture

Understanding the three-layer architecture of the CC2 device UI helps you design DataViews that behave exactly as expected and debug issues efficiently.


┌─────────────────────────────────────────────┐
│ DeviceUI Manager │
│ Owns the display and touch hardware. │
│ Draws widgets using OS graphics primitives. │
│ Manages system bar, navigation, modals. │
├─────────────────────────────────────────────┤
│ ApplicationUI Manager │
│ Parses DataView JSON. │
│ Registers pages with DeviceUI Manager. │
│ Updates widget values from MQTT messages. │
│ Sends uplink messages when user enters data │
├─────────────────────────────────────────────┤
│ MessageManager │
│ Selects active network (WiFi, BLE, etc.). │
│ Encodes/decodes MQTT JSON messages. │
│ Routes uplink and downlink traffic. │
└─────────────────────────────────────────────┘

The DeviceUI Manager acts like a window manager — it is analogous to a GUI desktop environment. It provides a consistent, well-defined framework for interaction that is independent of which DataView is currently active.

The ApplicationUI Manager is the DataView engine. It parses the DataView JSON files, creates and registers InfoPages and InfoWidgets with the DeviceUI Manager, and keeps them up to date as MQTT messages arrive.

The MessageManager handles all network communication, insulating the UI layers from the underlying transport.


The CC2 screen is divided into two areas. Only one area can be active at a time:

Graphical element Area Description
System bar Top strip Always visible except during DED modal dialogs. Shows current DataView name, system icons, and status indicators.
InfoPage Remaining screen Displays one page of InfoWidgets as defined by the active DataView.
DataEntryDialog (DED) Full screen A modal dialog that covers the entire screen to allow data entry. Replaces the InfoPage while open.

The CC2 has three tactile navigation buttons. Their behaviour depends on the current UI state:

Button On an InfoPage During a DED
Back Go to the previous page in the sequence Cancel — discard any entered data, close DED
Forwards Go to the next page in the sequence Accept entered data — proceed to next field/close
OK / Home Go to page id:"1" of the current app; if already there, go to the device home screen Confirm entry — accept the current value

OK/Home dual role

Pressing OK/Home on an InfoPage navigates to the first page (id "1") of the current DataView. If the user is already on page "1", it navigates to the device home screen — the top-level grid of all installed applications.

If a DataView is configured as the home DataView in allocdata, then its page "1" is the home screen. In that case the OK/Home button on page "1" returns to the same page.

Button events for rules

Buttons also fire press, release, dblclick, and longpress events. These can be used in the RuleMgr onButton rules to trigger custom actions without the user being on a specific page.

-> See Rules (RuleMgr)


By default, the device home screen shows a grid of icons — one per configured DataView. This can be overridden by naming one DataView with the id home in the allocdata. In that case, page "1" of that DataView becomes the home screen.