Autor Thema: FTUI version 3  (Gelesen 271483 mal)

Offline Adimarantis

  • Developer
  • Sr. Member
  • ****
  • Beiträge: 827
Antw:FTUI version 3
« Antwort #2865 am: 26 November 2022, 13:31:14 »
Die Lösung ist zwar irgendwo abgeschrieben, aber klappt gut.
Da ich zwei Tonnen abbilden muss, mit ftui-content in extra Datei

<ftui-grid-tile row="1" col="4" height="3" width="3">
  <header>Tonnen</header>
    <ftui-row>
<ftui-content file="abfall.html" Reading="Papier" Farbe="my-green" Icon="trash"></ftui-content>
  <ftui-content file="abfall.html" Reading="Restmuell" Farbe="gray" Icon="trash"></ftui-content>
</ftui-row>
      </ftui-grid-tile>
Raspberry 4 + HM-MOD-RPI-PCB (pivCCU) + RfxTrx433XL + 2xRaspberry 1
Module: 50_Signalbot, 52_I2C_ADS1x1x , 58_RPI_1Wire, (50_SPI_MAX31865)

Offline mkriegl

  • Jr. Member
  • **
  • Beiträge: 95
Antw:FTUI version 3
« Antwort #2866 am: 26 November 2022, 13:50:10 »
Danke für den Tipp mit ftui-badge. Genau das habe ich gesucht. Zur ersten Frage aber:

- Warum hüpft die Tonne auch beim Reading 11, ich bin davon ausgegangen, dass ich diesen Wert mit `.*` ausschließe

[class-name]="myAbfall:Papiertonne | map('`0|1`:hop,`.*`:')"

Offline mr_petz

  • Hero Member
  • *****
  • Beiträge: 1251
Antw:FTUI version 3
« Antwort #2867 am: 26 November 2022, 13:54:23 »
Gefällt mir Gefällt mir x 1 Liste anzeigen

Offline Adimarantis

  • Developer
  • Sr. Member
  • ****
  • Beiträge: 827
Antw:FTUI version 3
« Antwort #2868 am: 26 November 2022, 14:02:00 »
Farbproblem mit ftui-meter:

Ich habe bei ftui-meter das Problem, dass der Balken manchmal grau in grau dargestellt wird. Man kann also die Größe des Balkens schon erahnen - gezeichnet wird er - aber eben nicht mit der entsprechenden Farbe:
<ftui-meter [value]="HM_Sen_Wa_Od:level" [color]="HM_Sen_Wa_Od:level | step('80:primary, 60:warning, 30:alert')" min="0" max="100" >
</ftui-meter>

Das passiert unabhängig vom Wert. Schaut erst gut aus, dann neu laden und plötzlich grau. Mach ich was falsch oder ist das ein Bug?
Raspberry 4 + HM-MOD-RPI-PCB (pivCCU) + RfxTrx433XL + 2xRaspberry 1
Module: 50_Signalbot, 52_I2C_ADS1x1x , 58_RPI_1Wire, (50_SPI_MAX31865)

Offline mr_petz

  • Hero Member
  • *****
  • Beiträge: 1251
Antw:FTUI version 3
« Antwort #2869 am: 26 November 2022, 14:15:52 »
Wenn du kein min und max mitgiebst, dann scheint es zu funktionieren:
<ftui-meter [value]="HM_Sen_Wa_Od:level" [color]="HM_Sen_Wa_Od:level | step('30:alert, 60:warning, 80:primary')">
</ftui-meter>

Standard ist im meter min=0 und max=100

LG

Edit:
Man darf kein min="0" angeben sonst geht es nicht.
Mit min="-1" geht es....
also min>0 oder min<0 angeben...
« Letzte Änderung: 26 November 2022, 14:22:17 von mr_petz »

Offline Adimarantis

  • Developer
  • Sr. Member
  • ****
  • Beiträge: 827
Antw:FTUI version 3
« Antwort #2870 am: 26 November 2022, 14:34:57 »
Danke. Scheint zu klappen. Dann aber wohl trotzdem ein Bug...
Sollte ich das auf github melden?
Raspberry 4 + HM-MOD-RPI-PCB (pivCCU) + RfxTrx433XL + 2xRaspberry 1
Module: 50_Signalbot, 52_I2C_ADS1x1x , 58_RPI_1Wire, (50_SPI_MAX31865)

Offline mr_petz

  • Hero Member
  • *****
  • Beiträge: 1251
Antw:FTUI version 3
« Antwort #2871 am: 26 November 2022, 14:36:22 »
Kannst du machen, aber @setstate liest hier eigentlich immer mit....

LG

Offline setstate

  • Hero Member
  • *****
  • Beiträge: 4360
  • FHEM TabletUI
    • FHEM Tablet UI
Antw:FTUI version 3
« Antwort #2872 am: 26 November 2022, 20:07:54 »
ich bin schon seit Tagen auf der Suche nach den Gründen für das komische Verhalten beim ftui-meter. Besonders bei mir auf einem Android Tablet. Ich dachte schon, das verursachte die css Animation. Irgendwas passt aber immer nicht nicht.

Offline mkriegl

  • Jr. Member
  • **
  • Beiträge: 95
Antw:FTUI version 3
« Antwort #2873 am: 26 November 2022, 21:01:15 »
Weiß jemand an was es liegen kann, dass die Icons als "undefined" angegeben werden, wenn man den Link mit user:password öffnet? Ich starte mein Display im Kiosk Modus und dem Link:

http://user:password@192.168.xxx.xxx:xxxx/fhem/ftui/index.html

Angezeigt werden nur die PNGs beim Wetter, nicht aber die internen oder über "path" verwendeten openautomation SVGs
Öffne ich die Seite normal muss ich im Popup Benutzer und Passwort angeben und die Icons werden wie üblich angezeigt.

Oft starte ich das Display jetzt nicht neu, dass ich die Zugangsdaten angeben muss, hat mich aber doch verwundert

Offline mr_petz

  • Hero Member
  • *****
  • Beiträge: 1251
Antw:FTUI version 3
« Antwort #2874 am: 26 November 2022, 22:38:40 »
http://user:pass@ wird von Browsern nicht mehr unterstützt.
Vielleicht hilft dir das:
BasicAuthExpiry
https://mayach.de/fhem-eingeloggt-bleiben-basicauthexpiry/

LG
Gefällt mir Gefällt mir x 1 Liste anzeigen

Offline Medel

  • Full Member
  • ***
  • Beiträge: 141
Antw:FTUI version 3
« Antwort #2875 am: 27 November 2022, 00:24:36 »
Wie schafft man es die Beschriftung eines unsichtbaren Buttons unten anzuzeigen, also näher zu den zugehörigen Steuerelementen. Die Beschriftung ist der Schalter um die Automatik Ein- oder Auszuschalten.
Im Anhang ein Bildauszug. Hier mein Code aus dem Template:
<ftui-cell height="12%">
  <ftui-row align-item="bottom">
    <ftui-button fill=""
      (value)="{{device}}:auto toggle"
      [color]="{{device}}:Automatik | map('on: green, off: red')">{{name}}
    </ftui-button>
  </ftui-row>
  <ftui-row>
    <ftui-button (value)="{{device}}" states="auf" direction="vertical" color="current" fill="none">
      <ftui-icon name="angle-up" class="size-50%" height="90%"></ftui-icon>
    </ftui-button>
    <ftui-icon [name]="{{device}}:Status | map('0%:window-shutter-open, 50%:window-shutter-open, 100%:window-shutter')"
      [color]="{{device}}:Status | step('0: green, 50: yellow, 100: green')">
    </ftui-icon>
    <ftui-button (value)="{{device}}" states="zu" direction="vertical" color="current" fill="none">
      <ftui-icon name="angle-down" class="size-50%" height="90%"></ftui-icon>
    </ftui-button>
 </ftui-row>
</ftui-cell>

Offline mr_petz

  • Hero Member
  • *****
  • Beiträge: 1251
Antw:FTUI version 3
« Antwort #2876 am: 27 November 2022, 09:30:41 »
ich bin schon seit Tagen auf der Suche nach den Gründen für das komische Verhalten beim ftui-meter. Besonders bei mir auf einem Android Tablet. Ich dachte schon, das verursachte die css Animation. Irgendwas passt aber immer nicht nicht.

Ich habe auch mal bissl gespielt. Das liegt wohl doch an der 0.4s in der transition. Nimmt man nur die 0.4s raus oder schreibt stattdessen 0s geht es.???
Oder wird [color] zu spät (0.4s) übergeben??? Es reicht ja schon in der Browserconsole das aus- und anschalten der mask und dann wird auch der color gesetzt... und es scheint ja nur bei gesetzten min="0" sich so zu verhalten...
Gibt es alternativen für das linear transitition?

LG

Offline setstate

  • Hero Member
  • *****
  • Beiträge: 4360
  • FHEM TabletUI
    • FHEM Tablet UI
Antw:FTUI version 3
« Antwort #2877 am: 27 November 2022, 10:49:23 »
@Medel: Das geht aktuell nicht. Button kann aktuell nur "size", da wird aber die Schrift auch mit kleiner. Ich müsste dem Button noch ein "height" Attribute spendieren, dann würde das gehen. ich schaue mal ...

<ftui-button fill="" margin="0 0 -1em 0"
oder in pixel

<ftui-button fill="" margin="0 0 -10px 0"
« Letzte Änderung: 27 November 2022, 11:28:57 von setstate »

Offline mr_petz

  • Hero Member
  • *****
  • Beiträge: 1251
Antw:FTUI version 3
« Antwort #2878 am: 27 November 2022, 13:22:11 »
@setstate

Wenn du in der updateBar() das als Zwischenlösung angibst:
this.bar.style[direction] = value===0 ? (value + 0.1) + '%': value + '%';
dann geht es sofort.
Es scheint vielleicht transition mit width=0% im bar ein Problem zu haben wenn value beim initialisieren den Wert 0 hat???
Und wie gesagt, mit min="-1" geht es auch sofort (ohne der Änderung)...

LG

Edit:
Oder es liegt an deiner scale() Berechnung...
Wenn ich da so definiere:const value = scale(limitedValue, this.min, this.max, 0.1, 100);
geht es auch...

Wenn du magst kann ich dir den meter zu transform:translate umbauen.. Bsp:
https://codepen.io/mcraiganthony/pen/waaeWO
Hier funktioniert es sofort auch bei wert 0...

OK habs mal gemacht (unsortiert..):
.progress-bar {
  border-radius: var(--meter-border-radius, 1em);
  overflow: hidden;
  transform: translateZ(0);
  height: 1em;
  transition: all 400ms ease-out;
  background: var(--meter-bar-color, var(--color-base, #20639b));
  position:relative;
  top:0;
  left:0;
  right:0;
  bottom:0;
}
hier brauchst du eigentlich auch kein ::before mehr...

Achso.. und allen noch einen schönen 1.Advent :D
« Letzte Änderung: 27 November 2022, 17:31:20 von mr_petz »

Offline Adimarantis

  • Developer
  • Sr. Member
  • ****
  • Beiträge: 827
Antw:FTUI version 3
« Antwort #2879 am: 27 November 2022, 20:48:52 »
Ebenfalls einen schönen 1. Advent.

Ich hätte da noch ein Thema mit ftui-knob.
Das nutze ich um den aktuellen Stromverbrauch des Hauses zu visualisieren. Damit da jetzt eine einigermassen sinnvolle Darstellung erfolgt, wollte ich "max" auf 3000 Watt begrenzen.
Nur leider steht dann bei einem größeren Verbrauch (wenn halt mal kurzfristig mehr zusammenkommt) eben auch genau 3000 als Zahl dort. Ich habe bei mir schon Peaks von 10000 Watt gehabt (Waschmaschinen+Spülmaschine+Ofen+Herdplatten - kommt vor...). Bei max=10000 wird aber die graphische Darstellung sinnfrei.

Ich würde es jetzt passender finden, wenn die Zahl immer die Realität wiederspiegeln würde, auch wenn die graphische Darstellung am Maximum angekommen ist.
Meinungen?
Raspberry 4 + HM-MOD-RPI-PCB (pivCCU) + RfxTrx433XL + 2xRaspberry 1
Module: 50_Signalbot, 52_I2C_ADS1x1x , 58_RPI_1Wire, (50_SPI_MAX31865)

 

decade-submarginal