Monatsrückblick Januar/Februar 2026 ist online!

[sigi234]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

Was kann ich da machen - sieht ja unschön und unprofessionell aus :)))

Responsives Design
Zum Beispiel:
Material Design Widgets kann das.

[TG70]

@sigi234
Was heißt Responsives Design?

Ich habe gerade die kompletten Views auf HQWidgets umgestellt, da ich extreme Probleme
hatte, das beim Viewwechsel der on/off Status der Homematic Aktoren nicht korrekt angezeigt wurden.
Nur mit den HQWidgets sind diese nun korrekt dargestellt.

[sigi234]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

Was heißt Responsives Design?

Die View passt sich automatisch dem Endgerät an.

[Latzi]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

Was heißt Responsives Design?

schau mal unter https://de.wikipedia.org/wiki/Responsive_Webdesign

[TG70]

Was wäre ein Material Design Widget, mit dem ich einen Wert definieren kann.
Das heißt ich gebe hier einfach den Wert des Heizthermostates 22°C an das Wandthermostat weiter

[OliverIO]

@TG70
Überprüfe die Angaben im Reiter CSS-Allgemein.

1. Schau, das alle 'Elemente dieser Gruppe die gleichen width und height haben
   Die Knöpfe sehen ja auch alle gleich groß aus. Wenn nein, kannst du alle markieren und per Hand den Wert eingeben, so das alle auf den gleichen Wert gesetzt werden
2. Dann schaue, ob alle Elemente dieser Gruppe, die sich in der gleichen horizontalen
   Ebene befinden, den gleichen Wert bei top stehen haben
3. Alle Elemente, die exakt untereinander stehen sollen müssen auch bei left den gleichen Wert haben.

[sigi234]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

Was wäre ein Material Design Widget, mit dem ich einen Wert definieren kann.
Das heißt ich gebe hier einfach den Wert des Heizthermostates 22°C an das Wandthermostat weiter

Sollte so gehen.

[TG70]

@OliverIO sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

@TG70
Überprüfe die Angaben im Reiter CSS-Allgemein.

1. Schau, das alle 'Elemente dieser Gruppe die gleichen width und height haben
   Die Knöpfe sehen ja auch alle gleich groß aus. Wenn nein, kannst du alle markieren und per Hand den Wert eingeben, so das alle auf den gleichen Wert gesetzt werden
2. Dann schaue, ob alle Elemente dieser Gruppe, die sich in der gleichen horizontalen
   Ebene befinden, den gleichen Wert bei top stehen haben
3. Alle Elemente, die exakt untereinander stehen sollen müssen auch bei left den gleichen Wert haben.

Jep 1-3 habe ich natürlich alle gleich gesetzt, also auf px genau gleich. Ich arbeite fast immer mit der direkt Eingabe der Position mit px. Weil sich so die Widget schneller und korrekter positionieren lassen.

[TG70]

@sigi234 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

Was wäre ein Material Design Widget, mit dem ich einen Wert definieren kann.
Das heißt ich gebe hier einfach den Wert des Heizthermostates 22°C an das Wandthermostat weiter

Sollte so gehen.

Mit welchem Material Design Widget denn ?? Wie heißt das oder meinst du das kpl Material Design, was ich irgendwo mal gelesen habe ???

[sigi234]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

Mit welchem Material Design Widget denn ?? Wie heißt das oder meinst du das kpl Material Design, was ich irgendwo mal gelesen habe ???

https://forum.iobroker.net/topic/26925/test-adapter-material-design-widgets-v0-2-x

[TG70]

@sigi234 ... Genau den habe ich installiert. Du meinst diesen??

[sigi234]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

@sigi234 ... Genau den habe ich installiert. Du meinst diesen??

Ja, hast du ihn auch hinzugefügt?

[TG70]

@sigi234 Jep nutze auch schon einige Widget davon.
Mit welchen könnte ich die Temperatur Übergabe an das Wandthermostat realisieren ???

[sigi234]

@TG70 sagte in Trotz Zentrierung | Widgets nicht gleichmässig auf Endgerät:

@sigi234 Jep nutze auch schon einige Widget davon.
Mit welchen könnte ich die Temperatur Übergabe an das Wandthermostat realisieren ???

Vis-materialdesign-List

[TG70]

Vielen Dank für den Tipp mit dem Material Design. Ist jetzt echt gerade mit folgendem Widget:
Edit: Funktioniert mit diesem Widget leider doch nicht

[TG70]

Nein - nehme das wieder zurück. Leider ist auch mit dem genannte Material Design Widget auf dem iPhone die
Darstellung nicht korrekt

[TG70]

Hat niemand mehr eine Idee - meine Versuche den ganzen Vormittag führen alle zu keinem Erfolg.
In real sieht es noch viel schlimmer aus wie auf dem "Foto".
Das ist jetzt mit den Material-Design-Widget

[OliverIO]

@TG70
wenn die positions attribute alle gechecket sind und es trotzdem zu Verschiebungen kommt,
dann muss man sich das html layout anschauen. dann ist in der css-definition noch irgendetwas krumm
eigentlich verwendet vis ohne das material design immer nur absolute positionierung
wenn man das mal unter android mit angeschaltetem debugging testet, dann könnte man mit den chrome dev tools auch mal direkt drauf schauen

[TG70]

@OliverIO Danke für deine Rückmeldung

Komischerweise ist das erst bei der og. View aufgefallen.
Wie gesagt auf dem Windows Browsesr (Chrome/Firefox) ist der Versatz nicht zu sehen.
Nur auf den iOS Endgeräten.

Wie sieht die Standard CSS aus ?? Bzw. wo muss ich da genau schauen.
Leider habe ich aktuell kein Android Gerät hier im Haus. Nur iPad und iPhone ??

[OliverIO]

css sind die Formatvorlagen für HTML-Elemente.
Das Standard CSS gibt es daher nicht
Da kann man die die Größe, Farbe, Schrift, Ränder, und vieles mehr definieren.
da html-elemente ineinander verschachtelt sind, kann das recht komplex werden.
vis lässt uns diese angaben auf oberer widget-ebene definieren.
inneralb dessen ist dann der eigentliche widgetinhalt definiert.
da kann es immer wieder mal zu seiten effekten kommen.
Bei Geräte spezifischen Abweichungen, kann man eigentlich halt auch nur auf dem Gerät selbst nachschauen.

ich hatte so einen Fall jetzt aber auch noch nicht hier in vis