jptaszyk
(Johannes Ptaszyk)
October 24, 2020, 12:07pm
1
Hello everyone,
today I wanna address the openHAB apps for Android and iOS.
Some issues I do have with them:
Burger menu is not that great these days, since phones grow bigger and it is hard to reach
UI is not really modern anymore and does not feel nice
I created a quick mockup with what I would personally prefer:
I tried to get a modern look here and switched to a bottom navigation.
An additional thought I had while making this, that it would be pretty neat to add the same style to a widget, since our widgets look rather old as well
I would love to get your thoughts and we might be able to change things up
1 Like
I believe the apps currently use the Basic UI sitemaps.
The framework used by the new OH3 UI has mobile features too. I believe.
jptaszyk
(Johannes Ptaszyk)
October 24, 2020, 4:26pm
3
I mean it will still have to be implemented as native UI, doesn’t it?
Sitemaps are actually just a kind of markup language/dsl for building ui and elemtents.
The website and apps will still have to interpret them and render a UI.
And I think we could easily enhance the apps with something nice in the rendering section.
I did not take a look at OH 3 UIs by now to be honest.
hmerk
(Hans-Jörg Merk)
October 24, 2020, 4:37pm
4
You really should, as the new UI is completely different.
jptaszyk
(Johannes Ptaszyk)
October 24, 2020, 5:24pm
5
Can I see it anywhere in a demo or as screenshots?
wborn
(Wouter Born)
October 24, 2020, 5:46pm
6
These tutorials and wikis have many screenshots:
This Wiki topic’s goal is to serve as a working document, in order to provide an up-to-date tutorial for OH3 aimed at new users and novices. Everyone is welcome and encouraged to edit it, when we’re satisfied it will make its way to the official docs. You may reply for the specific purpose of improving the article are allowed, but please, this is NOT a support thread: if you’re stuck while reading this and are simply seeking support please open another thread. Thanks!
This tutorial has transit…
This Wiki topic’s goal is to serve as a working document, in order to provide an up-to-date tutorial for OH3 aimed at new users and novices. Everyone is welcome and encouraged to edit it, when we’re satisfied it will make its way to the official docs. You may reply for the specific purpose of improving the article are allowed, but please, this is NOT a support thread: if you’re stuck while reading this and are simply seeking support please open another thread. Thanks!
This tutorial has transit…
This Wiki topic’s goal is to serve as a working document, in order to provide an up-to-date tutorial for OH3 aimed at new users and novices. Everyone is welcome and encouraged to edit it, when we’re satisfied it will make its way to the official docs. You may reply for the specific purpose of improving the article are allowed, but please, this is NOT a support thread: if you’re stuck while reading this and are simply seeking support please open another thread. Thanks!
This tutorial has transit…
This Wiki topic’s goal is to serve as a working document, in order to provide an up-to-date tutorial for OH3 aimed at new users and novices. Everyone is welcome and encouraged to edit it, when we’re satisfied it will make its way to the official docs. You may reply for the specific purpose of improving the article are allowed, but please, this is NOT a support thread: if you’re stuck while reading this and are simply seeking support please open another thread. Thanks!
This tutorial has transit…
This Wiki topic’s goal is to serve as a working document, in order to provide an up-to-date tutorial for OH3 aimed at new users and novices. Everyone is welcome and encouraged to edit it, when we’re satisfied it will make its way to the official docs. You may reply for the specific purpose of improving the article are allowed, but please, this is NOT a support thread: if you’re stuck while reading this and are simply seeking support please open another thread. Thanks!
This tutorial has transit…
UPDATE: The most current information on this topic is now available at: User Interface Design Overview | openHAB . The following is kept for archival purposes only!
TOC:
I. Pages basics (this topic)
Concepts: UI components, pages & widgets
Sitemaps
Types of pages
Page editors, creating a page & adding widgets
II. Editing pages & widgets: general information
Configuring widgets
The system & standard libraries, default widgets (standalone, list items & cells), adding widgets from the model
W…
UPDATE: The most current information on this topic is now available at: User Interface Design Overview | openHAB . The following is kept for archival purposes only!
Configuring widgets
No matter which type of page you’re editing, the designer will feature black buttons beside most widgets, that open a contextual menu for the widget in question:
[image]
These menus will in most cases allow you to:
configure the documented parameters with a config sheet (“Configure Widget” or similar);
open th…
3 Likes
jptaszyk
(Johannes Ptaszyk)
October 24, 2020, 6:06pm
7
Thank you!
There does not seem to be any mobile/app layout. Or am I too dumb?
wborn
(Wouter Born)
October 24, 2020, 6:07pm
8
It looks nice on mobiles too! It’s just that the screenshots were made on a desktop.
jptaszyk
(Johannes Ptaszyk)
October 24, 2020, 6:38pm
10
I see, so we will not keep the native apps as they are anyways?
wborn
(Wouter Born)
October 24, 2020, 8:17pm
11
There’s already an issue/PR to integrate the new UI into the Android App:
opened 03:19PM - 30 Sep 20 UTC
Is your feature request related to a problem? Please describe.
openHAB 3 comes with a new UI that isn't supported by the...
enhancement
It’s all still very much work in progress so it remains to be seen what UI functionality is added/removed to/from the native Apps. The native apps still have added value over a PWA of course because integrations like Tasker on Android.
2 Likes
jptaszyk
(Johannes Ptaszyk)
October 25, 2020, 3:33pm
12
I see, maybe it would make sense to see if we can have the rendering code within the apps as well to prevent having to download html and css
system
(system)
Closed
December 6, 2020, 7:33am
13
This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.