In diesem Beitrag möchte ich dir zeigen wie einfach du mit UI Flow den kleinen Microcontroller M5Stack ATOM Matrix programmieren kannst.
der Microcontroller M5Stack ATOM Matrix
Den M5Stack ATOM Lite habe ich dir bereits im Beitrag ATOM Lite von M5Stack vorgestellt, der einzige kleine bzw. große Unterschied zwischen diesen beiden ist, das der ATOM Matrix über eine 5×5 RGB LED Matrix verfügt. Ansonsten sind diese beiden Microcontroller identisch.
Bezug des M5Stack ATOM Matrix
Den M5Stack ATOM Matrix habe ich wie auch den ATOM Lite über aliexpress.com für knapp 6€ zzgl. Versandkosten erstanden. Diesen kannst du aber auch recht günstig für ca. 13€ inkl. Versandkosten über ebay.de erstehen.
technische Daten des ATOM Matrix
Wie schon erwähnt hat der ATOM Matrix die selbe Ausstattung wie auch der ATOM Lite jedoch mit einer 5×5 RGB LED Matrix.
- Betriebsspannung: 5V mit max. 500mA
- Umgebungstemperatur: 0°C .. 40°C
- CPU: ESP32-PICO mit 240 MHz dual core
- Flash Speicher: 4MB
- Schnittstellen:
- USB Typ C,
- WiFi,
- Bluetooth Low Energy (BLE),
- IR Diode,
- Grove,
- Taster
- Abmaße (LxBxH): 24mm x 24mm x 15mm
Aufbau & Pinout
Der ATOM Matrix verfügt über einen Taster auf der linken Seite für den Reset und über einen „versteckten“ Taster auf der RGB Matrix. Des Weiteren verfügt dieser über eine USB Typ C Schnittstelle sowie über eine Grove Schnittstelle zum Anschluss von Sensoren & Aktoren.
Auf der Rückseite befinden sich 2 Buchsenleistenreihen welche Beschriftet sind.
UI Flow
Das Onlinetool UI Flow kannst du über die Adresse https://flow.m5stack.com/ erreichen. Auf der Startseite suchst du zunächst deinen Microcontroller aus. In unserem Fall wählen wir die Sprache „Deutsch“ sowie den ATOM Matrix aus.
Unter dem Abschnitt „M5Burner“ musst du das Tool zum übertragen des späteren kompilierten Codes herunterladen, es stehen dir 2 Versionen zur Verfügung (Windows & Mac). Da ich einen Rechner mit Microsoft Windows 10 verwendet lade ich mir den M5Burner für Windows herunter (ca. 86MB).
Da wir wie bereits erwähnt einen ATOM Matrix haben, klicken wir die Schaltfläche „Download“ in der Kachel „UIFLOW(MATRIX)“.
Für den nächsten Schritt musst du den Mikrocontroller mit dem Computer verbinden!
Nun müssen wir den neuen Bootloader auf den Mikrocontroller kopieren, das ist mit diesem Tool recht einfach, denn man muss nur den richtigen COM Port (1) auswählen und die Schaltfläche „Burn“ (2) betätigen.
Nachdem klick, wird dann der Dialog „Wifi Settings“ angezeigt in welchem du die Zugangsdaten zu deinem lokalen WLAN eintragen kannst.
Wenn jetzt die Schaltfläche „Start“ geklickt wurde, wird der neue Bootloader aufgespielt.
Während dieses Prozesses darf der Mikrocontroller nicht vom Computer getrennt werden!
================= Start Burn ================= --chip esp32 --port COM3 --baud 750000 --before default_reset write_flash -z --flash_mode dio --flash_freq 80m --flash_size detect 0x1000 E:\9999_Arduino\M5Burner\packages\fw\atom\UIFlow_Matrix-v1.7.2.bin ================= esptool.py v2.5.0 Serial port COM3 Connecting... . Chip is ESP32-PICO-D4 (revision 1) Features: WiFi, BT, Dual Core, 240MHz, Embedded Flash, VRef calibration in efuse MAC: 24:a1:60:46:03:98 Uploading stub... Running stub... Stub running... Changing baud rate to 750000 Changed. Configuring flash size... Auto-detected Flash size: 4MB Compressed 4182016 bytes to 1847866... Writing at 0x00001000... (0 %) Writing at 0x00005000... (1 %) ... Writing at 0x001bd000... (99 %) Writing at 0x001c1000... (100 %) Wrote 4182016 bytes (1847866 compressed) at 0x00001000 in 34.0 seconds (effective 985.3 kbit/s)... Hash of data verified. Leaving... Hard resetting via RTS pin... ================= Burn Successfully =================
Wenn auch dieser Prozess abgeschlossen ist, dann kann der Dialog über die Schaltfläche „Close“ schließen und wir können zur Webseite von UI Flow zurückkehren.
Eingeben des API Keys in UI Flow
Damit wir unseren Code auf den M5Stack ATOM Matrix aufspielen können, müssen wir nun den API Key unseres Mikrocontrollers eingeben.
Diesen kannst du auf 2 Wege ermitteln.
COM Monitor von M5Burner
Zum einen über den M5Burner über den „COM Monitor“ (blaue Schaltfläche, oben rechts in der Anwendung). Wenn jetzt der Dialog geöffnet ist, wird die Resettaste am ATOM Matrix betätigt, es wird dann im unteren Abschnitt der API Key angezeigt.
WLAN Netzwerk
Der API Key ist aber auch Bestandteil der Kennung des Wifi Netzwerks.
alternative Nutzung der UI Flow IDE
Die UI Flow IDE kann, nachdem der neue Bootloader auf den Mikrocontroller gespielt wurde, genauso gut wie die Online Version verwendet werden.
Du kannst die aktuelle Version von der UI Flow IDE unter https://m5stack.com/pages/download für Windows, Mac oder Linux herunterladen.
Ich finde, dass die IDE sogar noch etwas besser funktioniert und daher möchte ich in den nächsten Schritten diese verwenden.
Wenn die 100 MB große *.zip Datei heruntergeladen wurde, muss diese in ein beliebiges Verzeichnis entpackt werden. (Und kann von dort aus auch gleich gestartet werden.) Beim ersten Start der Software unter Windows 10 wird man aufgefordert den Zugriff auf lokale Ressourcen zu geben, diese werden zbsp. für die Verbindung über USB zum Mikrocontroller benötigt.
Einstellungen
Zunächst muss der COM Port ausgewählt werden (1) an welchem der ATOM angeschlossen wurde und die Sprache(2). Danach den Mikrocontroller selbst (3) und sobald wir auf die Schaltfläche „OK“ geklickt haben, können wir mit der Programmierung beginnen.
Programmieren des M5Stack ATOM Matrix mit UI Flow
Nun, nachdem die Entwicklungsumgebung eingerichtet ist, möchte ich dir einige Beispiele zeigen welche du mit dem M5Stack ATOM Matrix und wenigen Bauteilen nachstellen kannst.
RGB LEDs des ATOM Matrix steuern
Im ersten Beispiel möchte ich dir zeigen, wie du die RGB LED Matrix steuern kannst. Dazu kannst du entweder einzelne Punkte aktivieren und das Programm aufspielen oder aber mit etwas mehr Code das ganze dynamisch und bunt gestalten.
Einfaches ansteuern von RGB LEDs
dynamisches ansteuern von RGB LEDs
Taster abfragen
Unter der LED Matrix ist ein kleiner Taster verbaut welchen wir auch abfragen können bzw. auf die Aktion des Tasters reagieren können.
Steuern der RGB LED Matrix mit dem Taster
Als Erstes wollen wir mithilfe des Tasters die RGB LED Matrix steuern. D.h. bei einem Klick des Tasters soll ein Index nach oben gezählt werden und der entsprechende NeoPixel in Rot eingefärbt werden.
Video
alternative mit großen Zahlen