Ich baue gerade mein Dashboard um und habe mir (mit Hilfe von ChatGPT) eine Custom Button Card bauen wollen, worauf Sonnenauf/untergang und Mondauf/untergang zu sehen sind.
Der nachfolgende Code funktioniert im Browser am PC, an dem ich das programmiert habe. Aber auf keinem meiner mobilen Geräte (alles Android).
Und zwar nicht nur in der Companion App, sondern auch nicht im Browser.
Dabei bin ich mir aber sicher, dass zwischenzeitlich die Icons angezeigt wurden. Danach habe ich dann die Textdarstellung der Sensoren gemacht und nun hab ich nur noch eine weiße Box. Interessant übrigens - keine Fehlermeldung oder anteilige Darstellung der Texte oder so → einfach eine leere Box.
Ich vermute, Dein custom_field Konstrukt, das HTML Code zurückgeben soll, überfordert die Möglichkeiten der custom-button-card. Das es im Desktop Browser funktioniert, liegt wahrscheinlich an der großzügigen Interpretation der Browser Engine, nicht am Funktionieren der Karte.
Bin dann aber nicht weiter gekommen, als es darum ging custom Icons zu nutzen.
Außerdem hatte der Code das Grid nicht richtig dargestellt. Ein Problem dass die KI dann übrigens auch hatte und deswegen mit der o.a. Lösung um die Ecke kam.
Alternativ bin ich auch dankbar für Lösungsansätze vier Sensoren mit jeweils dem dazugehörigen Icon darzustellen.
Ich denke, Deine Anforderung könnte man auch mit der custom-button-card umsetzen aber ich verspüre keinen Reiz, dies nachzubauen. Vielleicht findet sich einer.
Ich könnte Dir aber alternativ den Code einer Markdown Karte anbieten wo ich die Bilder entsprechend der Stati ändere. Das könnte man auch für die zweite Tabellenzeile machen, die bei mir statisch ist.
{# Define image filenames in a dictionary for better organization#}
{% set images = {
'door_locked': 'haustuerZUZU.jpg',
'door_unlocked': 'haustuerZUAUF.jpg',
'door_open': 'haustuerAUF.jpg',
'window_closed': 'fensterZU1.jpg',
'window_open': 'fensterAUF1.jpg'
} -%}
{% set door_state = states('sensor.nuki_haustur_door_security_state') | lower -%}
{# Determine the image for the door status based on its state #}
{% set tuerstatus =
images['door_locked'] if door_state == 'closed & locked' else
images['door_unlocked'] if door_state == 'closed & unlocked' else
images['door_open'] if door_state == 'open' else
None
-%}
{# Determine the image for the windows based on their state #}
{% set Oben = images['window_closed'] if (states('binary_sensor.fenster_oben') | lower) == 'off' else images['window_open'] -%}
{% set Mitte = images['window_closed'] if (states('binary_sensor.fenster_mitte') | lower) == 'off' else images['window_open'] -%}
{% set Unten = images['window_closed'] if (states('binary_sensor.fenster_unten') | lower) == 'off' else images['window_open'] -%}
<center>
<!--
<center><font size=4>Ist irgendwo ein Fenster auf ?</font></center><br>
-->
<table border = 0>
<tr>
<td width=60><img src="http://192.168.1.100:8123/local/{{tuerstatus}}" /></td>
<td width=40></td>
<td width=60><img src="http://192.168.1.100:8123/local/{{Unten}}" /></td>
<td width=5></td>
<td width=60><img src="http://192.168.1.100:8123/local/{{Mitte}}" /></td>
<td width=5></td>
<td width=60><img src="http://192.168.1.100:8123/local/{{Oben}}" /></td>
<tr>
<td><center><font size=3>Haustür</font><center></td>
<td width=5></td>
<td><center><font size=3>Unten</font><center></td>
<td width=5></td>
<td><center><font size=3>Mitte</font><center></td>
<td width=5></td>
<td><center><font size=3>Oben</font><center></td>
</tr>
</table>
</center>
EDIT: Verdammte Neugierde
Ich habe obigen Markdown Code in ChatGPT geworfen und gesagt “diesen Code will ich in einer custom-button-card”. Danach kamen 2 Iterationen KI Müll und dann sagte ich: "
Interessanterweise, verfolgt er auch Deinen Ansatz mit dem custom-field und es funktioniert, aha nicht schlecht. Ich habe aber nicht verglichen was bei Dir anders ist. Das kriegst Du schon hin.
Mal ganz abgesehen davon, dass custom_fields dafür gar nicht gedacht ist, diesen ganzen html-Code aufzunehmen, ist das was die KI da ausgespuckt hat, vor 12 Jahren, wo ich mit dem Webseiten-Scripten aufgehört habe schon hilflos veraltet gewesen.
Ich würde da 1. kein HTML einbauen und 2. schonmal lange keins das nicht den aktuellen Vorgaben entspricht… Ich glaube nen <br> war damals schon deprecated.
Auf Inline Styles würde ich auch verzichten. Du kannst in den custom_fields direkt CSS Formatierungen eintragen.
Kein Wunder das man damit Darstellungsprobleme bekommen kann.
Kann man nur hoffen, dass sich das nicht auch noch einer als Lösung kopiert, oder die KI den falschen Mist wieder aufsaugt und dem nächsten Unwissenden vorwirft…
