Building Pages in the OH 3 UI - Introduction

I’m taking a cut at expanding the Getting Started tutorial for Pages. I’m going to insert them here for public comment before submitting them as a PR. I don’t think the existing three pages are sufficient for getting started so I’m largely rewriting them but will leave them inline at the end until I’m certain that all their contents are covered elsewhere.

As usually, this is a Wiki (for now) so please correct anything wrong and add any content you think is missing and add a reply describing what you changed. I’ll convert it back to a regular post and close it once it has been migrated to github.

This page has been submitted to the official docs for review. You can find the PR at Getting started UI Pages by rkoshak · Pull Request #1503 · openhab/openhab-docs · GitHub and a prerendered version of this page at Pages - Introduction | v3 Documentation Preview.


openHAB 3 introduces a new user unified user interface called MainUI. Should you choose to, almost everything that can be configured in openHAB can be configured through MainUI. You’ve already seen how to create and configure Things and how create Items and build the semantic model. Later you will see how to create Rules.

In addition to the administration of openHAB, MainUI can be used as the interface you present to the users of your home automation.
You can find an example of the MainUI on the demo page.

Role Base Access

MainUI presents two different views to users based on whether and as what type of user they log in as. The two types of users are regular users and administrators.

Regular Users

Regular are users who have not logged in or users who have not been configured to be administrators. These users can see all of the interactive parts of the UI (i.e. Pages) and can open other apps (icon at the upper right hand corner of the screen) but they cannot see any of the administration user interfaces nor can they access the administration functions through the REST API.

Administration Users

These users have full access to all parts of openHAB. The list of menu options includes Settings, Developer Tools, and the Developer Sidebar. These are most of the parts of openHAB you have been interacting with thus far. Way back in First Steps the first thing you did was create an administration user.

User’s User Interface

Every openHAB deployment is unique. As such, every administrator of openHAB will want to create a custom interface for the users of their home automation. openHAB 3 provides a number of options for this:

Interface How the UI is Built Notes
Sitemaps A simple and basic way of declaratively defining a user interface; can be defined in .sitemap files or through MainUI Used by BasicUI and the phone apps by default
HABPanel Built graphically through the browser, uses a blocks type interface (e.g. the Windows 10 start menu) with much greater ability to customize. Also supported by the phone apps but not responsive so a separate UI will need to be created for each display size. Was originally made for fixed wall-mounted tablets.
HABot A chatbot interface to openHAB that allows users to talk to openHAB using natural language Requires use of the semantic model. A simplified natural text input box is also displayed on the Overview tab of the main UI’s home page if HABot is installed.
Pages User interface that is presented in MainUI itself Can be built in part automatically based on the (semantic) model and Item metadata.

To access the non-“Pages” user interfaces, if it’s installed, it will appear in the menu that pops up to the right when clicking on the small square icon in the upper right corner of MainUI.

The rest of this tutorial will focus only on “Pages”.

Next -> [Wiki] Building Pages in the OH 3 UI - Automatically Generated Overview Tabs

Next -> Pages - Overview Page
Previous <- Persistence | openHAB

4 Likes

Good introduction! Added some hyperlinks to other documentation and a link to the demo page to let it speak a bit more for the person who isn’t so familiar with OpenHAB.

1 Like