iobroker ist mega- die Visualisierung ein Supergau

[sigi234]

@kaiserm

IQontrol
https://forum.iobroker.net/topic/22039/neuer-adapter-visualisierung-iqontrol

Material Design Widget
https://forum.iobroker.net/topic/26199/test-adapter-material-design-widgets-v0-1-x

[BBTown]

@kaiserm

ebenfalls einen Blick Wert: LoveLace
https://forum.iobroker.net/topic/22781/test-adapter-lovelace-v0-2-x

[Matthias321]

Ich würde dir auch zu Lovelace raten: simple und schnell einrichtbar. Ohne HTML Kenntnisse sieht das bei mir so aus nach 2 Tagen Einrichtung:

[kaiserm]

@Matthias321 Super. Genau so etwas einfaches suche ich. Schau ich mir mal an.

Vielen lieben Dank dafür.

[kaiserm]

Also am besten gefallen mir nach wie vor Metro Widget und Material Design Widget.

Aber ohne CSS Kenntnisse wohl eher ein absolutes NoGo

Sehr kompliziert das Ganze.

Wobei ich ja nicht mal groß mit dem Tablet steuern möchte.

Das mache ich z.B. mit Hue Dimmer Switches oder per Sprache.

Ich benötige eigentlich nur einen Schalter auf dem Tablett für Alle Lichter aus.

Es dient ansonsten wirklich nur zur Info (Licht, Türen, Fenster, Heizung, Wetter, ...)

Mit einfachen Mitteln (ohne IT Studium mit 25 jähriger Berufserfahrung) so etwas zu erstellen wäre Klasse.

So ungefähr muss es aussehen damit es gefällt.

Welche Metro Objekte werden denn in diesem Beispiel verwendet?

[HeliosFan]

@kaiserm

Am Besten template - basierend ...
Template wählen ...
Skin wählen ...
Schriftart und Farbe wählen ...

ein bischen mit der Maus klicken, paar Icons anpassen....
und fertig... warten bis das System daraus den fertigen Code generiert hat.

So ungefair ?
Leider hat sich noch niemand die immense Arbeit gemacht, so etwas zu programmieren .

Aber im Ernst, es gibt auf Youtube gute Anleitungen, wie man sich eine VIS baut. ( Muss ja nicht von "Schimmermedia" sein. Der Typ labert einfach zu viel )

[Jey Cee]

Naja es gibt Material UI das ist schon nah dran.

[kaiserm]

@HeliosFan Klar gibt es Youtube Videos. Aber die sind m.E. Lichtjahre von dem gewünschten Ergebnis entfernt.

[kaiserm]

@Jey-Cee Meinst Du wirklich? Sieht schon wesentlich anders aus als mein Favorit.

[Jey Cee]

Das war eigentlich auf @HeliosFan seine Aussage bezogen.

@kaiserm bitte doppel post vermeiden.

[dtp]

Ja, die Visualisierung ist aufwändig und kostet mitunter sehr viel Zeit. Ich habe da bestimmt schon weit über 200 Stunden reingesteckt. Und wenn man dann auch noch unterschiedliche Geräte mit unterschiedlichen Bildschirmformaten hat, wird's noch lustiger.

An dieser doch recht simplen Wetterseite habe ich z.B. locker 10 Stunden gesessen.

Und die Steuerseite für meine Heizung hat in Summe bestimmt 50 Stunden verschlungen.

Da sind zum Teil fünf und mehr Widgets übereinander gelegt, die dann je nach Info ein- und ausgeblendet werden bzw. ihre Farbe ändern.

Trotzdem bin ich soweit zufrieden. Vor allen Dingen, weil man extrem flexibel ist. Das, was du dir da z.B. als Ideal vorstellst, lässt sich durchaus realisieren. Es wäre jetzt z.B. kein so großer Aufwand, die Farben der Widgets entsprechend deinem obigen Ideal anzupassen. Aber du kannst nicht erwarten, dass man dir hier alles auf dem Präsentierteller serviert. Da ist einfach der Wille zum selbständigen Lernen gefragt.

Selbst kommerzielle Lösungen, wie z.B. der AIO CREATOR NEO von Mediola sind kein Plug & Play. Auch da muss man Zeit investieren.

[BBTown]

@kaiserm
Du wirst dich entscheiden müssen

• einfach nur schalten will -> nimm iQontrol
• weitere Beispiele von IQontrol
• soll so aussehen wie mein Favorit -> dann wirst Du Zeit investieren müssen

[Matthias321]

Wenn es auf mehreren Geräten laufen soll, Dan nimm etwas das responsive ist zB Lovelace.

[Peoples]

Ich finde IoBroker genial mit allen Features und allen Problemchen.

Ich habe auch weit mehr als 200 Stunden in meine Visualisierung gesteckt, bei mir wars so ich hatte im Homematic Forum mal einen Entwurf gesehen der mir gefallen hat, hab mir das dann "nachgebaut" und an meine Gegebenheiten und Wünsche angepasst. Was dann aber auch einschließt dass man die ganzen Buttons alle extra gestalten muss und das dautert eben.
Hier ein paar Auszüge vom Ergebnis:

Ich kann nur sagen dass es sich lohnt den die Möglichkeiten sind nahezu unbegrenzt!

[hans_999]

...
Falsch gepostet

[Bachmann77]

@Peoples

wow....sieht echt super aus...würdest Du einen Export zu Verfügung stellen?
Vielen lieben Dank vorab

[kaiserm]

@BBTown Das ich Zeit investieren muss ist schon klar... da habe ich schon viel davon investiert

[kaiserm]

Wenn mir irgendjemand ein Grundgerüst gemäß meiner Wunsch Visualisierung bereitstellen könnte wäre das mega gut.

Also was für Lampen, Fenster und Temperaturen.

Es fängt ja schon mit den Schriftgrößen an die man da irgendwie reincodieren muss ...

Ist mir bis jetzt alles noch zu hoch.

Ich denke ja das es sich bei meinem Wunschkandidaten um Metro handelt, oder etwa nicht

[Negalein]

@Peoples sagte in iobroker ist mega- die Visualisierung ein Supergau:

den die Möglichkeiten sind nahezu unbegrenzt!

Hallo People!

Wie hast du das mit den 2 Menüs in 1 View gemacht?

Könnt ich den View von System haben, damit ich mir das ansehen kann?

Danke

[Peoples]

@Negalein

Hab da einfach mehrere Links gemacht.

Hier das CSS:

.button_site_navigation_grey_200
    {
        height:94px;
    	width:200px;
    	line-height:94px;
        text-align:center;
        vertical-align:middle;
    	border:#85888a solid 3px;
        border-radius: 5px;
    	font-size:22px;
    	background: #0079FF;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#676a6e), to(#1f2122));
        background: -webkit-linear-gradient(0% 0%, 0% 100%, from(#676a6e), to(#1f2122));
        background: -moz-linear-gradient(center top, #676a6e, #1f2122);
        color:white;
    }
.button_site_navigation_blue_200
    {
        height:94px;
    	width:200px;
    	line-height:94px;
        text-align:center;
        vertical-align:middle;
    	border:#1a89c8 solid 3px;
        border-radius: 5px;
    	font-size:22px;
    	background: #0079FF;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#676a6e), to(#1f2122));
        background: -webkit-linear-gradient(0% 0%, 0% 100%, from(#676a6e), to(#1f2122));
        background: -moz-linear-gradient(center top, #676a6e, #1f2122);
        color:white;
    }

Hier der View-Export:
export.txt