ESP8266 WiFi Color Display mit FHEM verwenden

[kingmathers]

Hallo,

Ich habe das ESP8266 WiFi Color Display Kit von ThingPulse gekauft. Es besteht aus einem ESP8266 mit Wemos D1 Mini und einem 2.4″ ILI9341 Touchscreen. Es gibt dazu ein paar Beispielprojekte von Thingpulse (Wetterstation und Spotify Remote), ich wollte das ganze aber natürlich mit FHEM nutzen.

Ich habe mir den Quellcode von der Wetterstation angeschaut und das ganze etwas abgeändert, sodass es stattdessen Informationen vom FHEM Server anzeigen und Daten an FHEM senden kann. Dazu habe ich (basierten auf den Beispielprojekten von Thingpulse) eine FHEM-Anwendung erstellt.

Text und einfache Symbole kann man recht leicht anzeigen und auch auf Touch Events reagieren, entweder mit der Anzeige von einem anderen Bildschirm oder mit dem Senden von Befehlen an FHEM. Basic Auth und CSRF Token werden unterstützt, SSL und Zertifikate aktuell nicht.

Bei mir zeigt der Bildschirm Daten von meiner Solaranlage an und kann die Waschmaschine starten. Ein vereinfachtes, einfarbiges FHEM Logo für den Ladebildschirm habe ich ebenfalls integriert.

Den Code werde ich bei Interesse gerne bereitstellen, ein paar Anpassungen muss ich aber noch vornehmen.

Update: Code ist jetzt bei GitHub verfügbar: ESP8266 FHEM Display

[PeMue]

Hallo,

ist das das Display von locutus' Wetterstation? Cool wäre, abwechselnd das Wetter bzw. Daten von FHEM darstellen zu können. Und: ja, ich bin an Deinem Quellcode interessiert  .

Gruß Peter

[CarstenF]

Finde es auch sehr spannend und melde auch mal Interesse an Deinem Projekt.


Gesendet von iPhone mit Tapatalk

[kingmathers]

Hallo,

ist das das Display von locutus' Wetterstation? Cool wäre, abwechselnd das Wetter bzw. Daten von FHEM darstellen zu können. Und: ja, ich bin an Deinem Quellcode interessiert  .

Gruß Peter

Die Bauteile sind mit dieser Wetterstation quasi identisch.

Ich muss meinen Code noch ein bisschen aufräumen, danach werde ich ihn hochladen.

[PeMue]

Die Bauteile sind mit dieser Wetterstation quasi identisch.

diese meinte ich, danke für den Link.

Gruß Peter

[kingmathers]

Cool wäre, abwechselnd das Wetter bzw. Daten von FHEM darstellen zu können.

Das sollte gut möglich sein. Die Wetterstation definiert 5 Bildschirme (screens), die nacheinander angezeigt werden. Meine FHEM screens basieren auf dem gleichen Prinzip und ersetzen die der Wetterstation. Prinzipiell kann man die FHEM screens natürlich auch im Anschluss an die Wetter screens (oder davor oder zwischendrin) anzeigen.

Man müsste dann nur anpassen, wie auf ein Touch Event reagiert wird. Die Wetterstation geht bei einem Touch Event zum nächsten Screen, der FHEM Hauptscreen reagiert nur wenn der "Start Button" gedrückt wird. Aber das ist natürlich jetzt nur so wie ich es angepasst habe, natürlich kann man das an seinen Bedarf anpassen.

[kingmathers]

Ein kleines Update: Ich habe die FHEM Funktionalität (Kommunikation mit dem Server) in eine eigene Arduino Library gepackt und auf Github gestellt. Sobald das ganze auch in der Arduino IDE über den Library Manager installiert werden kann, werde ich dafür nochmal einen eigenen Post erstellen. Im Moment ist es nur über Github verfügbar:

https://github.com/kingmathers313/FHEM_Arduino

Über folgenden Code kann die eingebundene Library dann in Arduino genutzt werden um mit einem FHEM Server über HTTP zu kommunizieren:

Code Auswählen Erweitern


FHEM fhemclient("http://192.168.1.1:8083/fhem", "User", "Password");
String result = fhemclient.LoadFromServer("{SomeSub()}");


Vielleicht hat ja sonst noch irgendjemand Verwendung dafür.

Den Code für die Wetterstation mit Anzeige der Infos wie auf den Fotos zu sehen lade ich hoch sobald die Library bei Arduino verfügbar ist. Das sollte noch maixmal ein paar Tage dauern.

Grüße,
Philipp

[kingmathers]

Den Code habe ich jetzt auf Github bereitgestellt. Voraussetzung ist unter anderem meine FHEM Library, welche in Arduino verfügbar ist.

Angepasst werden müssen in settings.h die WLAN Einstellungen (SSID und Password) sowie die FHEM Einstellungen (Server, ggfs. User und Password).

In der Datei ESP8266_FHEM_Display.ino sind die  Zeilen 281 und 282 anzupassen:

Code Auswählen Erweitern

Status1 = fhemclient.LoadFromServer("{ESP8266GetResponse2()}");   //first 3 lines
Status2 = fhemclient.LoadFromServer("{ESP8266GetResponse()}");  //second 2 lines, with Start button

Bei ESP8266GetResponse() und ESP8266GetResponse2() handelt es sich um subs, die ich in 99_myUtils definiert habe. Theoretisch kann dort auch irgendetwas anderes eingesetzt werden (ReadingsVal/Value etc.), es sollte nur einen Rückgabewert liefert, welcher dann angezeigt wird.

In Zeile 357-359 kann der Text der 3 Buttons angepasst werden und in Zeilen 228, 234 und 240 kann der jeweils an FHEM zu sendende Befehl angepasst werden.

Den gesamten Code, der sich auf die Wetterstation bezieht (Kommunikation mit dem Wetterdienst, entsprechende Icons, Anzeige der verschiedenen Bildschirme etc.) habe ich komplett entfernt, da ich nur Daten aus FHEM anzeigen möchte. Ebenso habe ich die Farben verändert (es können nur 4 gleichzeitig verwendet werden) um das FHEM Logo in grün darstellen zu können. Die Datums/Uhrzeitanzeige habe ich ebenfalls für meine Wünsche angepasst (Zeitzone wird nicht angezeigt)

Daher würde ich folgende Vorgehensweise empfehlen:
1. Nur Daten aus FHEM: Mein Projet benutzen und entsprechend anpassen
2. Daten aus FHEM + Wetterstation: Wetterstation von ThingPulse benutzen (Github) und benötigten Code aus meinem Projekt rüberkopieren. Folgender Code aus meinem Projekt kann z.B. zum Anzeigen von Text verwendet werden:

Code Auswählen Erweitern

void Draw(int16_t x, int16_t y, String text, const char *font, uint16_t color, TEXT_ALIGNMENT alignment)
{
gfx.setFont(font);
gfx.setColor(color);
gfx.setTextAlignment(alignment);
gfx.drawString(x, y, text);
}

Mit Hilfe meiner FHEM Library lässt sich der Text ja relativ einfach aus FHEM laden, sodass mit beiden zusammen das Anzeigen von Text aus FHEM recht überschaubar wird.

Über Feedback oder Beteiligung würde ich mich sehr freuen. Bei Fragen stehe ich ebenfalls gerne zur Verfügung, bin aber auch kein Arduino Experte und habe nur begrenzt Zeit. Wo und wann ich helfen kann, werde ich dies aber gerne tun!

Viel Spaß beim ausprobieren,
Philipp

[Markus.]

Klasse Sache...

Kannst Du mal ein Beispiel deiner MyUtils Subs posten?

Gruß

Markus

[kingmathers]

Code Auswählen Erweitern


sub SomeSub
{
  my $response = Value("WaschmaschineDummy");
  $response = "Waschmaschine\nStatus: " . $response;
  return $response;
}

Beispielsweise so. Es ist halt wichtig, eine Variable zu definieren (my $response) und diese am Ende zurückzugeben (return $response). Zwischendrin kann alles mögliche hinzugefügt werden, z.B. mit ReadingsVal oder Value. Mit "\n" wird ein Zeilenumbruch realisiert. Wenn der STATE der Waschmaschine "fertig" ist kommt dabei also zurück:

Code Auswählen Erweitern

Waschmaschine
Status: fertig

Alternativ dazu kann man auch direkt die einzelnen Werte abfragen und dann Text mit Arduino hinzufügen. Also im Projekt, Zeile 282 statt

Code Auswählen Erweitern

Status2 = fhemclient.LoadFromServer("{ESP8266GetResponse()}");
kann man natürlich auch hier direkt mit Value etc. Werte aus FHEM abfragen:

Code Auswählen Erweitern

Status2 = "Waschmaschine\nStatus: " + fhemclient.LoadFromServer("{Value(\"WaschmaschineDummy\")}");
Hier ist darauf zu achten, dass Anführungszeichen den Textanfang und -ende signalisieren. Daher muss, um Anfühungszeichen im Text selbst zu verwenden, vorher ein \ eingefügt werden (ecape character).

Beides liefert das gleiche Ergebnis, ich finde es jedoch einfacher, die Sachen in myUtils zu verändern als immer eine neue Software über Arduino auf den ESP zu spielen.

Ich hoffe, Du kommst damit ein bisschen weiter.

Grüße,
Philipp

[Markus.]

Ja vielen Dank

Ich hab noch so ein Wemos Shield TFT Touch

https://wiki.wemos.cc/products:d1_mini_shields:tft_2.4_shield

Irgendwie bekomme ich damit den Sketch nicht ans laufen. Die Lötjumper auf der Rückseite sind alle offen.
Dieses Board hat MOSI / MISO Anschlüsse. Hast du da eine Idee wie man das ans laufen bekommt. Laut seriall Log macht er
die WLAN Verbindungaber zeigt auf dem Display nichts an. Kann es sein, das ich die FHEM Readings erst richtig eintagen muss im Sketch?

Gruß

Markus

[kingmathers]

Kannst du denn irgendeinen Text (der nicht von FHEM kommt) auf dem Bildschirm anzeigen oder kannst du Text von FHEM ins Serial Log schreiben?

Du musst in settings.h natürlich FHEM Server, Port und ggfs. User/Password angeben.

[Markus.]

ich glaub das ist "noch" ein Anschlussproblem. Beim Start oder restet zeigt er nur einen weißen Bildschirm.
Werde da mal nachforschen das ich überhaupt was angezeigt bekomme.

Gruß

Markus

[Markus.]

so ..nun habe ich das ding soweit das er die erste Seite Anzeigt, also das FHEM Logo und conencted to WiFI mit dem Balken
Ich glaube ich hab noch einen Fehler mit dem TFT_RST.
Welcher D-Pin kann das denn sein? Kann man den irgendwo in den includes finden?

Gruß

Markus

[kingmathers]

Da bin ich um ehrlich zu sein überfragt da ich das Kit zusammengebaut erworben habe.

Als Anleitung zum Aufbau sollte aber die Anleitung von ThingPulse funktionieren: https://github.com/ThingPulse/esp8266-weather-station-color

Edit: Evtl. bei den auskommentierten includes? Wie lautet denn die genaue Fehlermeldung?

[Markus.]

Da gibt es keine Fehlermeldung. Das Display zeigt halt nur die Startseite an mit dem Fhem Logo und dem WiFi connect, dann geht's nicht weiter.

Aber ich suche mal weiter

Gruß und danke

Markus

[kingmathers]

Hast du die entsprechenden Libraries installiert?

Folgende Libraries sind erforderlich:
- Mini Grafx by Daniel Eichhorn
- FHEM by Philipp Pfeiffer
- simpleDSTadjust by neptune2
- XPT2046 TouchScreen by Paul Stoffregen

Das habe ich leider bisher unzureichend dokumentiert.

Grüße und viel Erfolg weiterhin,
Philipp

[Markus.]

Hallo Philipp,

Ja die libs habe ich alle drin. Denke es ist ein Hardwareproblem in Bezug auf die richtige zurordnung der Pins. Bin ja von 0–Anzeige schon mal soweit, das es wenigstens den Initialisierungs–Screen mit dem FHem Logo anzeigt. Ich probiere morgen mal den TFT—Rst auf einen pin zu legen und suche mal nach dem define dafür. versuch macht klug..

Gruß

Markus

[Markus.]

habe nochmal ein wenig nachgeforscht... Ich glaube ich muss andere Libaries verwenden umdas so mit diesem LOLIN TFT Display ans laufen zu bekommen. Hier der Hinweis macht mich ein wenig stutzig..

https://wiki.wemos.cc/tutorials:shields:get_started_with_tft_2.4_shield

Gruß

Markus

[kingmathers]

Das ist komisch, eigentlich scheint die Hardware identisch zu sein. Vor allem da du schon den Ladebildschirm anzeigen konntest.

Funktioniert die Wetterstation denn bei dir?

[Markus.]

habs hin bekommen

Die Hardware scheint unterschiedlich zu sein. Es liegt glaube ich am IRQ und dem D0 sowie der Definition im Sketch mit dem reset. Hab ein paar Sachen im Sketch geändert und nun läufts erstmal. Ich Beschreib das noch genauer wenn ich fertig bin mit spielen. Hab das eigentlich nur gemacht weil ich zu geizig war fast 30$ dafür zu zahlen..
Wenn das so funktioniert, könnte man ja supergeniale WLAN-Touch-Taster draus bauen. Muss nur noch schön in ein UP-Gehäuse verpackt werden..

Viiiielen Dank für deine Hilfe erstmal !!

Gruß

Markus

[kingmathers]

Freut mich, dass es klappt.

Ich möchte das Display ebenfalls als WLAN Infodisplay/Touch Taster nutzen. Die UI (Buttons, wo welcher Text steht etc.) muss man sich natürlich selbst zusammenbasteln je nach Anwendung.

Ich bin ebenfalls noch auf der Suche nach einem Gehäuse. Zum 3D-drucken habe ich zwar ein paar für den Bildschirm gefunden, aber ich fürchte der Micro USB Anschluss ist dann nicht zu erreichen (je nachdem wie man den Wemos angebracht hat) und zum Unterputzeinbau ist es damit auch viel zu groß.

Grüße,
Philipp

[Markus.]

kannst Du mir nochmal auf die Sprünge helfen.. stehe daauf dem Schlauch wie man einen Wert von einem Device im Status
direkt abfragt.
Es soll im Status 1 der Wert des Readings "temperature" aus dem device "MYSENSOR_103" abgefragt werden.

Code Auswählen Erweitern

Status1 = "Status 1\nStatus: "+ fhemclient.LoadFromServer("{temperature(\"MYSENSOR_103\")}");

Im Log bekomme ich dann nur

Code Auswählen Erweitern


2018.12.13 18:30:57 1: ERROR evaluating {temperature("MYSENSOR_103")}: Undefined subroutine &main::temperature called at (eval 613958) line 1.


Gruß

markus

[kingmathers]

Du musst ReadingsVal oder Value verwenden. Folgendes Gerät als Beispiel:

Code Auswählen Erweitern


Internals:
   NAME       MYSENSOR_103
   STATE      done
   READINGS:
     2018-12-11 12:41:24   temperature   20


Jetzt kann man mit Value("MYSENSOR_103") den State auslesen und mit ReadingsVal("MYSENSOR_103", "temperature", "0") verschiedenen Readings auslesen.

Code Auswählen Erweitern


Status1 = "Status 1\nStatus: "+ fhemclient.LoadFromServer("{Value(\"MYSENSOR_103\")}"); // liefert den State, hier done
Status1 = "Status 1\nStatus: "+ fhemclient.LoadFromServer("{ReadingsVal(\"MYSENSOR_103\", \"temperature\", \"0\" )}"); // liefert das Readings Temperatur, hier 20

ReadingsVal benötigt 3 Argumente: Geräte Name, Readings Name und den Standardwert (falls das Readings nicht gefunden wird). Value benötigt nur den Namen des Geräts als Argument.

Zum testen kannst du all diese Befehle (mit geschweiften Klammern, aber ohne \ vor ") auch direkt bei FHEM in der Weboberfläche als Befehl eingeben. Die geschweiften Klammern werden benötigt, weil es sich um Perl-Ausdrücke handelt. Direkte FHEM Befehle (set Licht on) kannst du auch direkt übergeben:

Code Auswählen Erweitern


Status1 = "Status 1\nStatus: "+ fhemclient.LoadFromServer("set Licht on"); //hier wird nichts zurückkommen, aber der Befehl wird an FHEM gesendet und ausgeführt


[Markus.]

mmh bekomme einen Fehler im Log..undefined Subroutine

Code Auswählen Erweitern

2018.12.13 19:25:42 1: ERROR evaluating {RedaingsVal("MYSENSOR_103", "humidity", "0" )}: Undefined subroutine &main::RedaingsVal called at (eval 615794) line 1.


Der Status sieht wie folgt aus..

Code Auswählen Erweitern

Status1 = "Wohnzimmer\nTemperatur: " + fhemclient.LoadFromServer("{RedaingsVal(\"MYSENSOR_103\", \"temperature\", \"0\" )}");

Auf dem Display zeigt er auch statt dem Wert "undefined Subroutine" an
Eine Idee?

Gruß

Markus

[kingmathers]

Da habe ich mich leider verschrieben. "ReadingsVal" statt "RedaingsVal", dann sollte es klappen.

Grüße und weiterhin viel Erfolg,
Philipp

[Markus.]

Ohhh Mann copy und Paste statt mal zu lesen ich Depp
Danke dir, werde es morgen probieren.

Viele Grüße

Markus

[locutus]

Wie können mit der FHEM Arduino Library beliebige Zeichen direkt hinter einem Wert gesetzt werden?
Warum entsteht hier nach dem Temperaturwert (21.6) erneut ein Zeilenumbruch, der °C in die nächste Zeile befördert?

Code Auswählen Erweitern

Status1 = "Schlafzimmer\nTemperatur: " + fhemclient.LoadFromServer("{ReadingsVal(\"LaCrosse_01\", \"temperature\", \"0\" )}") + " °C";
genauso wie:

Code Auswählen Erweitern

Status1 = fhemclient.LoadFromServer("{ReadingsVal(\"LaCrosse_01\", \"temperature\", \"0\" )}");
...
gfx.setTextAlignment(TEXT_ALIGN_LEFT);
gfx.drawString(0, 24, "Temperatur: ");
gfx.drawString(120, 46, Status1 + " °C");
stellt auf dem Display dar:

Code Auswählen Erweitern

Schlafzimmer
Temperatur: 21.6
°C
und nicht wie gefordert:

Code Auswählen Erweitern

Schlafzimmer
Temperatur: 21.6 °C

[kingmathers]

Hier hatten wir mal ein ähnliches Problem, anscheinend wird teilweise ein Zeilenumbruch eingefügt. Durch löschen des letztens Zeichens sollte sich das beheben lassen, also quasi so:

Code Auswählen Erweitern

Status1 = fhemclient.LoadFromServer("{ReadingsVal(\"LaCrosse_01\", \"temperature\", \"0\" )}");
Status1.remove(Status1.length() - 1,  1);
...
gfx.setTextAlignment(TEXT_ALIGN_LEFT);
gfx.drawString(0, 24, "Temperatur: ");
gfx.drawString(120, 46, Status1 + " °C");


So könnte es klappen.

[FischFuss]

Hier hatten wir mal ein ähnliches Problem, anscheinend wird teilweise ein Zeilenumbruch eingefügt. Durch löschen des letztens Zeichens sollte sich das beheben lassen, also quasi so:

Code Auswählen Erweitern

Status1 = fhemclient.LoadFromServer("{ReadingsVal(\"LaCrosse_01\", \"temperature\", \"0\" )}");
Status1.remove(Status1.length() - 1,  1);
...
gfx.setTextAlignment(TEXT_ALIGN_LEFT);
gfx.drawString(0, 24, "Temperatur: ");
gfx.drawString(120, 46, Status1 + " °C");




So könnte es klappen.

Genauso klappt das bei mir 

Allerdings ist mir die Schrift etwas zu klein. Kann mir jemand sagen, wie ich die Schriftgröße ändern kann....am besten für "Temperatur" und Status1 separat?

Danke für Eure Hilfe

*EDIT*
...habs selbst rausgefunden:
Über die entsprechende Zeile "gfx.setFont(ArialRoundedMTBold_14);" setzen, wöbei die Zahl die Textgröße ist