Neuer ioBroker-Blog online: Monatsrückblick März/April 2026

[CyberMicha]

Hi zusammen,
bisher nutze ich nur auf meinem Galaxy S10 eine Visualisierung im Hochformat.
Wenn ich jetzt daher gehen möchte und auch für Querformat und ein weiteres Gerät ( Tab S5e ) welche haben möchte, lege ich dann pro "Art" ein Projekt an oder komplett alle views ein zweites mal? Letzteres wird dann ja richtig aufwändig, da ich zig views habe

Wie geht man da am Besten vor?

Nachtrag: Und wie gehe ich vor wenn ich auf View xy bin und da auch bleiben will wenn ich das Geräte ins Querformat drehe? Wenn ich alle default Haken rausnehme ruft die App nicht den richtigen View auf.

LG Michael

[Peoples]

@CyberMicha sagte in Visualisierung bei mehreren Geräten:

Wie geht man da am Besten vor?

Ich würde ein zweites Projekt machen ist schon der Übersichtlichkeit halber leichter

Nachtrag: Und wie gehe ich vor wenn ich auf View xy bin und da auch bleiben will wenn ich das Geräte ins Querformat drehe? Wenn ich alle default Haken rausnehme ruft die App nicht den richtigen View auf.

Wie sollte IoBroker merken dass du dein Tablet drehst, bzw. wissen welche View du darstellen willst. Vielleicht kann man via einem in Vis integrierten Code die Auflösung auslesen und so den Trigger für einen Seitenwechsel erstellen.
Aber so einfach geht das nicht.

[CyberMicha]

@Peoples sagte in Visualisierung bei mehreren Geräten:

e IoBroker merken dass du dein Tablet drehst, bzw. wissen welche View du darstellen willst. Vielleicht kann man via einem in Vis integrierten Code die Auflösung auslesen und so den Trigger für einen Seitenwechsel erstellen.
Aber so einfach geht das nicht.

So hätte ich mir das gedacht. Ein Skript im View o.ä. das registriert wenn sich die Auflösung ändert und dann den aktuellen View hernimmt und das Gegenstück für Hoch / Querformat aufruft.

Generell merkt es ioBroker ja schon.

[Homoran]

@CyberMicha sagte in Visualisierung bei mehreren Geräten:

Ein Skript im View o.ä. das registriert wenn sich die Auflösung ändert

dazu ist die default-Funktion von vis da.
der View, der der aktuellen Auflösung am nächsten kommt wird geöffnet.
1080*1920 ist eben nicht 1920x1080

Beim drehen des Tablets wird dann der andere View aufgerufen

[CyberMicha]

@Homoran
Ja das ist mir ja klar.

Hier vielleicht nochmal eine andere Erklärung. Vielleicht reden wir auch aneinander vorbei :)

Ich habe 2 Views im Hochformat. Nennen wir sie H_main und H_main2.
Dazu gibt es analog Q_main und Q_main2.
H hat eine Auflösung von 712x1138 und Q 1138x712

Bin ich nun im View H_main und drehe das Gerät, wird der Q_main aufgerufen, da beide als Default eingestellt sind und die Auflösung entsprechend passt.

Bin ich im View H_main2 und drehe das Gerät wird ebenfalls der Q_main aufgerufen, obwohl ich eigentlich den Q_main2 haben möchte.

[ioBroker-lover]

@CyberMicha ich suche derzeit nach einer Lösung für genau das von dir beschriebene Anwendungsszenario.
Jeder view im Hochformat soll ein Pendant im Querformat haben, das automatisch beim Drehen aufgerufen wird.
Ich habe gesehen, dass man über die Objects den Standard-View manipulieren kann. Vielleicht kann man darüber etwas basteln. Man müsste jedoch auch alles wieder zurücksetzen, damit man nicht immer einen anderen Standard nach der Bedienung hat.

Hast du schon eine Lösung gefunden?
Über die ioBroker App kann man ja einen Standard-View für Hochformat und Querformat setzen. Aber eben nur einen.. Inwiefern diese Setting mit dem "default" Haken in der vis interagiert, habe ich noch nicht ganz verstanden.

[sigi234]

@ioBroker-lover

iQontrol
Jarvis

[Segway]

@ioBroker-lover

JARVIS

[ioBroker-lover]

@sigi234 @Segway
Danke für eure Tipps, ich möchte das Ganze aber schon gerne im vis realisieren, da ich die Anpassbarkeit der Oberfläche sehr mag.
Nur für diese Funktion zu einer anderen Visualisierung zu wechseln, wäre es mir da nicht wert.

[Segway]

@ioBroker-lover
Ich persönlich hab gar nicht so viel Zeit für jedes Endgerät ne angepasste Vis zu hinterlegen also PC, Handy, Tablet und dann noch Hoch und Querformat!
Da kommt mir Jarvis grad recht!

Aber klar wenn du das so brauchst dann musst du diesen Weg gehen

[dtp]

Also mit der ioBroker App für iOS ist der Wechsel von Quer- ins Hochformat für jedes Gerät individuell einstellbar. Sprich, ich kann für mein iPhone hier zwei andere Startviews festlegen, als z.B. für mein iPad.

Ich habe das aber nicht umgesetzt, sondern nutze auf meinem iPhone nur Views im Hochformat und auf meinem iPad nur Views im Querformat. Das zu ändern, wäre teilweise schon sehr viel Aufwand, insbesondere bei den eingebunden Diagrammen. Meine vis-Projekte haben derzeit jeweils so ca. 30 einzelne Views mit zum Teil zig Widgets, die stets so angeordnet sind, dass sie die zur Verfügung stehende Fläche voll ausnutzen (ich mag keine Leerräume).

[CyberMicha]

@iobroker-lover said in Visualisierung bei mehreren Geräten:

hte das Ganze aber schon gerne im vis realisieren, da ich die Anpassbarkeit der Oberfläche sehr mag.
Nur für diese Funktion zu einer anderen Visualisierung zu wechseln, wäre es mir da nicht wert.

Sehe ich auch so. vis hat halt superviele Möglichkeiten.
Bisher hab ich leider noch keine Lösung gefunden. Wundert mich auch, dass hier nicht mehr Fragen danach kommen.

[ice987]

@cybermicha

Versuche mal in einer View alle Widgets nach dem Schema (Höhe in px, Breite in %) umzubauen:

Spoiler

[{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"Test"},"style":{"left":"0px","top":"150px","height":"20px","width":"100%"},"widgetSet":"basic"}]

Das was du vorhast geht easy

[CyberMicha]

@ice987 said in Visualisierung bei mehreren Geräten:

[{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"Test"},"style":{"left":"0px","top":"150px","height":"20px","width":"100%"},"widgetSet":"basic"}]

Verstehe ich nicht? Die Höhe ist ja auch variabel.

[ice987]

@cybermicha
Die Höhe der vis view? Da gibst du nichts ein. Auflösung: nicht definiert

Schick doch mal einen Printscreen einer „einfachen“ view

[dtp]

@ice987 said in Visualisierung bei mehreren Geräten:

Das was du vorhast geht easy

Selbst, wenn beide Geräte (Smartphone und Tablet) komplett andere Seitenverhältnisse haben (z.B. Smartphone 16:10 und Tablet 4:3)? Dann hat man ja in dem einen Gerät extrem viel leere Fläche, wenn der Screen beim anderen gut gefüllt ist.

Ich habe so z.B. bei meinem iPhone und meinen iPad jeweils im Hoch- und im Querformat komplett unterschiedliche Ansichten mit an die Auflösung des jeweiligen Geräts angepasster Position und Größe der einzelnen Widgets. Wüsste auch nicht, wie man das sinnvoll automatisiert bekommt.

Nehmen wir mal die nachfolgende Ansicht auf meinem iPhone mit einem Dialog-Widget, das zwei untereinander angeordnete Diagramme zeigt.

Wie soll man das ohne spezielle Anpassung der Widgets vernünftig auf einem Tablet dargestellt bekommen? Und auch für das Querformat auf dem iPhone würde ich hier einen komplett anders aufgebauten View mit zwei nebeneinader angeordneten Diagrammen benötigen.

[ice987]

@dtp

Die view müsste entsprchend gefüllt werden, dass nur die Breite jeweils automatisch mit width = 100% variiert/angepasst werden kann

[OliverIO]

weiß das nicht so genau, aber kann man nicht durch das beschreiben eines states den view wechseln?

über den folgenden code kann man erkennen, ob das gerät gedreht wurde.
auch nicht ausprobiert, nur im internet gesucht.

wenn man so etwas in das skript tab einträgt, dann müsste sich die view dann automatisch ändern

window.addEventListener("orientationchange", function() {
    // Announce the new orientation number
    alert(window.orientation);
}, false);

[ice987]

@oliverio

Das müsste ich mal ausprobieren. Ich habe folgenden Code ausprobiert um die Breite eines Widgets auszulesen, ohne Trigger:

<script>
document.getElementById("w00935").innerHTML = window.innerWidth ;
</script>

Leider habe ich es noch nicht geschafft, so was als Binding einzusetzen, mit welchem dann Abhängigkeiten zwischen der Breite und Höhe eines Widgets errechnet werden könnten...