[FTUI3] Entwicklung Thermometer/Thermostat

[Ronny1979]

Bei mir auch, läuft jetzt mit Touch eingaben.

Danke

Gruß Ronny

[C0mmanda]

Hallo,

erstmal vielen Dank für dieses tolle Widget!
Frage: Ist es möglich an den Zoom-Settings Anpassungen oder Einstellungen vorzunehmen?

Problem: Ich habe ein recht kleines Tablet und 11 Thermostaten, also begrenzt Platz.
Wenn ich die Temperatur einstellen möchte ohne has-zoom, dann verdecke ich mit meinem Finger den
Temperaturwert, klar.
Mit der Einstellung has-zoom ist meine Tile aber zu klein, heißt der Soll-Wert wandert aus dem Tile heraus.

Damit man sieht was gemeint ist ein BIld anbei.
Vielleicht ist es möglich den Soll-Wert einen Tick kleiner einzustellen, oder z.B. die Option das die Skala nicht
mitzoomt (muss ja eig. nicht sein?!) und damit innerhalb der Tile etwas mehr Platz hat...
Ich hoffe man versteht was ich meine...

Gruß
Sascha

[mr_petz]

Ich habe das ZoomValue jetzt Benutzerdefiniert gestaltet.
Position left von der Mitte betrachtet, top von Thermostattop und die Zoomsize des Value.
Einfach einen css-Eintrag oder einen style-Eintrag erstellen.
Hier die Standardwerte:

Code Auswählen Erweitern


--thermostat-zoom-value-left: 45%;
--thermostat-zoom-value-top: -7%;
--thermostat-zoom-value-size: 2.4em;


Die Ticks lasse ich so wie sie sind, damit der Zoomeffect sichtbar ist.

LG mr_petz

Edit:
Datei anlegen:
Legst du einfach im themes Ordner an und bennenst sie user.css
Da kannst du all deine styles bzw. class reinschreiben.
Diese wird nach/bei einem Update nicht überschrieben!

im ftui bindest du sie auf deiner Hauptseite so im head unter dem ftui.css <link> ein:

Code Auswählen Erweitern

<link href="themes/user.css" rel="stylesheet">

Das wars...

[C0mmanda]

Ich habe das ZoomValue jetzt Benutzerdefiniert gestaltet.
Position left von der Mitte betrachtet, top von Thermostattop und die Zoomsize des Value.
Einfach einen css-Eintrag oder einen style-Eintrag erstellen.
Hier die Standardwerte:

Code Auswählen Erweitern


--thermostat-zoom-value-left: 45%;
--thermostat-zoom-value-top: -7%;
--thermostat-zoom-value-size: 2.4em;


Die Ticks lasse ich so wie sie sind, damit der Zoomeffect sichtbar ist.

LG mr_petz

Klasse! Löst mein Problem perfekt!
Mangels Wissen wie ich das in die css einbaue hab ich es per style-Eintrag eingebaut.
Vielen Dank!

Würde da gern noch eine Frage stellen:
Ich hab es immerhin hinbekommen in der css die Größen der Icons+Werte von Batterie, Ventil und Luftfeuchte zu ändern.
Das hat ja aber keinen Bestand wenn ich "updates" einspiele.
Hast du den entscheidenen Tipp wie ich das dauerhaft / Updateresistent ändern kann?

Danke!

Gruß
Sascha

[juemuc]

Hallo,
das Modul ist super. Ich konnte fasst alle meine Wünsche umsetzen. Jetzt ist nur noch ein Punkt offen 
Ich würde gerne den Farbkreis etwas "dicker" darstellen. Mit class="size-3" werden aber nur die "Ticks" größer. Was muss ich ändern, damit der Farbkreis zur "Tick-Größe" passt (s. Bilder)
Hier noch meine Definition:

Code Auswählen Erweitern

        <ftui-thermostat unit=" °C" size="85" min="7.5" max="28.0" class="size-3"       
              has-old-style has-arc-tick movegradient="3.5"
              lowcolor="0,0,255" mediumcolor="170,0,170"
              style="--thermostat-value-size:25px;--thermostat-value-color:white; ;--thermostat-temp-size:20px; bold)"
              [value]="FBDECT_FB_10971_0220184:desired-temp | part(1)"
              (value)="FBDECT_FB_10971_0220184:desired-temp"
              [temp]="FBDECT_FB_10971_0220184:temperature | part(1)">
        </ftui-thermostat>


Viele Grüße
Jürgen

[mr_petz]

ok, du kannst jetzt die arc-größe (hatte es eigentlich extra so gemacht, dass die Ticks rausschauen) beeinflussen mit dem style Bsp.:
Hinterer (grauer)

Code Auswählen Erweitern


--thermostat-arc-bg:10;


Fill (farbiger)

Code Auswählen Erweitern


--thermostat-arc-fill:11;


LG mr_petz

Edit: Hier sind bei dir noch paar Fehler drin:

Code Auswählen Erweitern


              style="--thermostat-value-size:25px;--thermostat-value-color:white; ;--thermostat-temp-size:20px; bold)"


Korrektur (auch durch Hinweis von @OdfFhem):

Code Auswählen Erweitern


              style="--thermostat-value-size:25px; --thermostat-value-color:white; --thermostat-temp-size:20px;"


[OdfFhem]

Korrektur:

Hinweis zur Korrektur:

- mit dem style-Attribut können CSS-Eigenschaften festgelegt werden ... ok, keine wirklich neue Erkenntnis
- "bold" stellt eine fehlerhafte Angabe dar, da Wert ohne Eigenschaft nicht erlaubt
- also bold weglassen   oder   font-weight:bold   verwenden

[juemuc]

Passt prima.
Wann kommt das Modul in den FTUI3-Update-Prozess? Ich hatte es erst vergessen neu herunterzuladen 

Viele Grüße
Jürgen

[mr_petz]

Wann kommt das Modul in den FTUI3-Update-Prozess? Ich hatte es erst vergessen neu herunterzuladen 

Naja, ich denke da ist noch viel Testkram wie ZWave drin (suche noch Tester) und wenig kommentiert und mit meinen bescheidenen Kenntnissen umgesetzt...

Gerade eben noch hinzugefügt Bsp.:

Code Auswählen Erweitern


  --thermostat-tick-height:16px;

Länge der Ticks (wenn nicht angegeben, dann wird es auto. gesetzt)

Code Auswählen Erweitern


  --thermostat-tick-radius:50px;

Kreisgröße der Ticks (wenn nicht angegeben, dann wird es auto. gesetzt)

LG

[juemuc]

ok. Danke für die Info. Mit ZWAVE kann ich leider nicht helfen.

Viele Grüße
Jürgen

[juemuc]

Hi mr_petz,

ich habe noch eine Frage zu "battery". Wenn das Reading einen Wert mit % enthält, wird das Batterie-Icon mit diesem Prozentwert angezeigt. Enthält das Reading einen Wert ohne das %-Zeichen, wird dies auch im Thermostat nicht angezeigt (nur der Wert). Dafür blinkt aber die Batterie bei einem zu niedrigen Wert.
Kann man dies kombinieren? Die Batterie soll ab einem Wert x blinken und das % wird angezeigt?

Viele Grüße
Jürgen

[grossmaggul]

Ich weiß es jetzt nicht genau, aber gibt es beim Thermostat nicht auch das unit="" Tag? In Deinem Fall also unit="%"

[mr_petz]

@grossmaggul
unit ist für´s value.
Edit: wobei man das auch mit append() erreicht...

@juemuc
Dein Anliegen verstehe ich noch nicht ganz....

LG

[juemuc]

Hi mr_ Petz,

aktuell übergebe ich für [battery] ein Reading welches eine Zahl ohne %-Zeichen enthält. Somit wird im Widget neben dem Batterie-Icon auch nur diese Zahl angezeigt. Gleichzeitig blinkt das Batterie-Icon bei einem Wert von 10.
Übergebe ich ein Reading was auch das %-Zeichen enthält, wird zwar das Icon angezeigt, aber es blinkt nicht mehr. Dafür hat der Wert nun als Einheit das %-Zeichen.

Viele Grüße
Jürgen

[mr_petz]

Ah ok jetzt habe ich es verstanden...
Schaue ich mir an...

LG