Building Pages in the OH3 UI: documentation draft (1/3)

Yes, it’s still undecided. The way things are now, you have a single implementation of a sitemap renderer for each platform: native apps for iOS and Android, and Basic UI for the web. If the main UI offers its implementation as well, and the mobile apps can show that UI (it’s planned), then you would have 2 implementations (a web-based in the main UI and the current native controls) on mobile, and 2 web implementations. So I guess it could become a bit confusing again… And there’s still a lot of work in other areas so even when it’s deemed necessary I don’t really consider it a priority. That can be discussed though.

am i being a muppet, the follow yaml doesnt display an icon

component: oh-label-cell
icon: oh:sun
title: window
item: BathroomWindow
slots: null

You´re right - syntax seems correct. It looks like a bug. You can open an issue for this here, so that @ysc can have a closer look:

Hello, i have a question.
Is it possible to switch to a page using rules?
I want to switch to a page (or open a popup) with a camera image when motion is detected.


1 Like

Hi all,
I have question about device with a webui build in
I wand to display these pages in a page (i can do this with profesional system)

Image URL

i get a empty screen

wrong syntax ? or not posible


@rlkoshak, @ysc
Dear both I really appreciate this early stage of documention. It helped me already a lot.
During this days I started to creat pages mainly with the User in focus, not an Admin. But then I realized, that setting visibility to Users means (at least for the moment) nothing.
Because when I logout from admin these are not getting displayed. And there is no option to setup users or I at least didn’t find it.

And If I got it it right …if I start now to transform my items from current config-file based to UI-config based setup - I have no option to use/see them as a user. Neither in Basic UI because they aren’t allocated to a sitemap anymore nor through the main UI, nor through the Android App.

But maybe my intention to get rid of the config files is anyway wrong.

I started to build up my setup from scratch and started with a ui based setup, but then i moved back to a file based setup. The main reason ist speed. I could copy an item set and change some things very quickly. So it setup my 15 plant sensors very fast what was not possible in the ui.

The nice thin is. If i want to move to the ui i could import my files very easily.

So your intention is not wrong, but maybe a thing for newbies

you can create users through the Karaf Console. There is currently no way to do so through the UI yet. This is briefly touched upon at [wiki] Getting Started with OH3: rewriting the tutorial - 2. First steps. I don’t know the specific commands but this link and what it links to should get you started.

BasicUI should be largely unchanged. I don’t think access to items its locked down based on user but I’ve not played with this aspect of OH 3 yet.

But the way this works has nothing to do with how the items are defined. It doesn’t matter if they are defined with .items files or though the ui.

Look into the model options that key you add equipment from thing and add points from thing. I find that a very rapid way to add lots of items.

Hi @ysc,

can you share the yaml of the echart in your post?


HI, I have a question :
Is it possible to capture the item.label and item.category in the UI?
I would like for example show in an UI the Item label and retrive the icon image as in BasicUI
I tried :

text: =items[props.item].label or items[props.item].category but it doesn’t work

I also have another question: Is it possible to use the custom icons (the ones in “icons\classic”) inside a OH-button ?


‘=props.item’ should return you the item name of your selected item in the widget-config

It needs a small workaround right now, like described here

Ahhhhh got it.
Thanks Rich as always your help and knowledge is really appreciated.

Thanks RGroll

I know it, I need the icon name and the label name … they are used in the standard widget-list therefore I suppose can be available also for the custom widget…

In my OH3 just work for the OH-iconset but not for the custom icon … I need to set up something on OH3?

Ok, understand. Which standard widget uses the item-label and the icon-name? Can’t remember seeing that. This would help me, digging a bit depper as I’m also interested in this. :slight_smile:

Hmm, its working for me for all icons that are stored in the mentioned path. I use *.svg files here and I did no extra settings in OH.
You could check the chrome dev tools (F12) and inspect the region, where the image should be, to see what the system is looking for.

That’s the point I use png, just look insperct with F12 and is looking for ?svg.
I tried with an svg file and it works.

I’ll add support for png custom icons after I finish with some other stuff :wink:

1 Like

There’s a user role but it’s not very much advertised, since anonymous users have the right to operate items by default anyway. It will get better.
But you can create a user without admin privileges - openhab:users add <userId> <password> user in the console.

Well… I lost it :disappointed: when I lost the demo instance I set up, sorry.

I had the idea for some time of adding an “expert mode” link to those screens, which would bring you to the “add items as textual definition” screen but it would be populated with items that would otherwise be created by checking the channels and editing the new item info in the forms underneath. That saves you from a lot of clicking around and lets you review quicker if you understand the items textual definition syntax. Probably not coming before 3.1 though.


Ok, understand. Which standard widget uses the item-label and the icon-name? Can’t remember seeing that. This would help me, digging a bit depper as I’m also interested in this. :slight_smile:

The std widget should be : oh-toggle-item for instance … I don’t know where to look for the std widget in OH3.

EDIT: Reordered the flow a little bit. I still feel like we will lose users if we go straight to the YAML so I moved it down to after the presentation of the Page types. I’m still not sure if flows but for me at least it gives me more context to understand the why and what of the YAML stuff. I added some screen shots and more words around the Overview page to further emphasize why to build the model.

Is the discussion of namespaces necessary for the user to understand? It’s not at all clear whether and why we need to know that and I recommend removing that information if it’s more of an implementation detail.