Das Monitoring LCD

In diesem Artikel möchte ich euch zeigen, wie man mit Hilfe von PowerShell und Espruino ein kleines Display bauen kann, welches beliebige Informationan anzeigen kann. In meinem Fall sind das Monitoring Information unseres Managed Service Anynode SBCs.

Was benötigt man

  • Espruino Microcontroller, ich habe den Pico genommen
  • Nokia 5110 LCD (PCD8544-Controller)
  • Zubehör wie Breadboard, USB Verlängerungskabel, Steckverbinder

Zusammenbauen

Der Zusammenbau ist recht einfach. Der Pico kann mit Pins bestellt werden, das LCD ist fast nur ohne Pins erhältlich. Daher muss man entweder die Pins dazukaufen und anlöten, oder die Steckverbinder anlöten. Ich habe mich für letzteres entschieden, da ich keine Pins da hatte.

Dann kann man die beiden Sachen einfach übereinander auf das Breadboard stecken. Die Stromversorgung für Pico und LCD erfolgt über den USB Anschluss des Pico.

No alt text provided for this image

Bitte die schlechten Lötpunkte am Pico ignorieren, das Lötzinn war einfach schlecht (oder ich war zu unfähig damit umzugehen). Oben am Display habe ich ein anderes verwendet.

Der USB Anschluss des Pico ist links, es wird die Oberseite des Pico 1:1 mit der Unterseite des LCD verbunden. Da der Pico einen Pin mehr hat, bleibt der erste von links (der am USB Port) frei. ❗❗❗ Vorsicht, das LCD hat an beiden Seiten (oben und unten) Anschlüsse. Man muss die unteren Anschlüsse verbinden, so dass der breitere Metallrahmen oben ist. der GND Pin des LCD ist dann ganz rechts.

Aufgabenteilung

Das Ziel ist, per Powershell den Inhalt der Zeilen an den Pico zu senden, der diese dann darstellt. Folgende Arbeitsteilung ergibt sich dabei:

Pico

  • Ansteuerung von LCD inkl. Hintergrundbeleuchtung
  • Empfang der zu darsetellenden Informationen
  • Ansteuerung der LED auf dem Pico
  • Knopf zum drücken zur Verfügung stellen (ebenfalls auf dem Pico)
  • USB Verbindung inkl. Stromversorgung bereitstellen

PowerShell

  • Verbindung zum Pico über virtuellen COM Port aufbauen
  • Programmlogik, also beschaffen und Verarbeiten der Informationen
  • Senden der Informationen an den Pico

Programm auf dem Pico

Am einfachsten ist es, den Code in die Web IDE einzugeben. diese ist hier zu finden. Es gibt in der IDE oben im Hilfesymbol auch eine Tour der IDE. Verinfacht gesagt:

  1. Anschluss des Pico per USB
  2. Verbinden des Pico mit der Web IDE (Symbol ganz oben links)
  3. Eingabe des Codes auf der rechten Seite
  4. Übertragung in den RAM (geht nach Stromverlust verloren) oder den Flash (bleibt beim abstecken erhalten) des Pico

Als erstes müssen wir die Pins definieren. Die Pins für die Informationsübertragung an das Display kommen später.

A5.write(0); // GND
A7.write(1); // VCC
A6.write(0); // Turn on the backlight

❗❗❗ Je nach Charge des LCD muss man bei Pin A6 zum aktivieren der Hintergrundbeleuchtung eine 1 statt einer 0 angeben.

Jetzt definieren wir uns einige Variablen.

  • g: Repräsentiert die Grafik Library
  • line0 – line7: Die einzelnen Zeilen des LCD
  • x und y: Die Koordinaten für die Zeilenausgabe auf dem Display
  • toggle: Um mit dem Knopf die Hintergrundbeleuchtung umschalten zu können

var g; // Define g globally, so that it can be used by other functions
var line0 = "Nicht initialisiert";
var line1 = "";
var line2 = "";
var line3 = "";
var line4 = "";
var line5 = "";
var line6 = "";
var line7 = "";
var x = 0;
var y = 0;
var toggle = false;

Die erste Zeile zeigt dabei “Nicht initialisiert” an, solange keine Verbindung mit PowerShell besteht.

Jetzt kommt die onInit Funktion, welche beim anstecken an die Stromversorgung immer ausgeführt wird. Man kann Sie auch später von PowerShell aus starten, was wir auch tun werden.

Zuerst werden das Serial Peripheral Interface und das LCD initialisiert, die Schriftart und Größe gesetzt und der Bildschirm gelöscht.

function onInit() {
// Setup SPI
var spi = new SPI();
spi.setup({ sck:B1, mosi:B10 });
// Initialise the LCD
g = require("PCD8544").connect(spi,B13,B14,B15, function() { // When it's initialised, clear it and write some text
g.setFont("4x6",1);
g.clear();

Dann werden die einzelnen Zeilen ausgegeben. Dabei werden die oben definierten Variablen als Inhalt verwendet. Bei Schriftgröße 1 liegen die Zeilen 5 Pixel auseinander, für ein wenig Abstand daher bei jeder Zeile 6 Pixel tiefer. Am Ende wird dann der Bilschirm aktualisiert.

g.drawString(line0,x,y);
g.drawString(line1,x,y+6);
g.drawString(line2,x,y+12);
g.drawString(line3,x,y+18);
g.drawString(line4,x,y+24);
g.drawString(line5,x,y+30);
g.drawString(line6,x,y+36);
g.drawString(line7,x,y+42);
// send the graphics to the display
g.flip(); });

Um die Hintergrundbeleuchtung ein- und ausschalten zu können, nutzen wir den Knopf des Pico und die toggle Variable.

//Toggle backlight
clearWatch(); // remove our last watch
setWatch(function() {
toggle = !toggle;
digitalWrite(A6, toggle, 50);
console.log("Pressed ");   }, BTN, { repeat: true, debounce : 50, edge: "rising" });
}

Hier noch der gesamte Code des Espruino Pico.

A5.write(0); // GND
A7.write(1); // VCC
A6.write(0); // Turn on the backlight
var g; // Define g globally, so that it can be used by other functions
var line0 = "Nicht initialisiert";
var line1 = "";
var line2 = "";
var line3 = "";
var line4 = "";
var line5 = "";
var line6 = "";
var line7 = "";
var x = 0;
var y = 0;
var toggle = false;
function onInit() {
// Setup SPI
var spi = new SPI();
spi.setup({ sck:B1, mosi:B10 });
// Initialise the LCD
g = require("PCD8544").connect(spi,B13,B14,B15, function() {
// When it's initialised, clear it and write some text
g.setFont("4x6",1);
g.clear();
g.drawString(line0,x,y);
g.drawString(line1,x,y+6);
g.drawString(line2,x,y+12);
g.drawString(line3,x,y+18);
g.drawString(line4,x,y+24);
g.drawString(line5,x,y+30);
g.drawString(line6,x,y+36);
g.drawString(line7,x,y+42);
// send the graphics to the display
g.flip();
});
//Toggle backlight
clearWatch(); // remove our last watch
setWatch(function() {
toggle = !toggle;
digitalWrite(A6, toggle, 50);
console.log("Pressed ");
}, BTN, { repeat: true, debounce : 50, edge: "rising" });
}

Der PowerShell Code

Nachdem wir den Pico programmiert und per USB an den Rechner angeschlossen haben, können wir den Port definieren und öffnen. Die Port Nummer (COM3) hat man vorher im Verbindungsdialog der Espruino Web IDE gesehen.

$port= new-Object System.IO.Ports.SerialPort COM3,9600,None,8,one
$port.open()

Um den Inhalt der Variablen (line0=) zu definieren, kann man sich Strings zusammenbauen. Diese können auch Variablen enthalten.

$text0 = "Siptrunk Karlsruhe"
$line0 = "line0=" + "'" + $text0 + "'"
$text1 = "OP:" + $tbl.Rows[2].OP + " " + "NW:" + $tbl.Rows[2].NW + " " + "I/O:" + $tbl.Rows[2].In + "/" + $tbl.Rows[2].Out
$line1 = "line1=" + "'" + $text1 + "'"

Die Variable $tbl enthält in meinem Beispielt die Information des Anynode SBC, die ich vorher per PowerShell über die REST API ausgelesen habe.

Jetzt schreibt man einfach die notwendigen Informationen in die Variablen auf dem Pico, ruft die Funktion onInit auf und schließt den Port wieder. Der Pico stellt dann den Inhalt der Variablen auf dem LCD dar.

$port.open()
$port.WriteLine($line0)
$port.WriteLine($line1)
$port.WriteLine($line2)
$port.WriteLine($line3)
$port.WriteLine($line4)
$port.WriteLine($line5)
$port.WriteLine($line6)
$port.WriteLine($line7)
$port.WriteLine($led)
$port.WriteLine("onInit()")
$port.close()

So aktiviert (1) oder deaktiviert (0) man die LED des Pico:

$led = "LED1.write(1)"
$port.WriteLine($led)
$led = "LED1.write(1)"
$port.WriteLine($led)

Verbesserungmöglichkeiten

Wie immer gibt es nach dem ersten funktionierdem Prototypen noch Dinge zu verbessern:

  • Nicht auf feste Stellen der Tabelle ($tbl.Rows[2].OP) beziehen, es kommt sonst bei neuen Anynode Nodes zu Verschiebungen und dadurch werden andere Informationen angezeigt als die, die man eigentlich braucht. Man könnte hier mit einer Textsuche nach dem Namen des Node statt mit einem Index hantieren.
  • Nicht den kompletten Bildschirm löschen, sondern vielleicht nur Teile davon, evtl. mit einem Quadrat in Hintergundfarbe? Momentan sieht das beim Aktualisieren der Informationen nicht schön aus.
  • Kleinerer Formfaktor des Pico + Displays, evtl. auf eine Lochplatte aufgebracht
  • Pico und Display in ein Gehäuse stecken, evtl. 3D-gedruckt?

Der momentane Formfaktor, zum Vergleich ein Kugelschreiber:

No alt text provided for this image