Bricolatge Com mostrar el temps a M5StickC ESP32 mitjançant Visuino: fàcil de fer: 9 passos

2025 Autora: John Day | [email protected]. Última modificació: 2025-01-23 14:37

En aquest tutorial aprendrem a programar ESP32 M5Stack StickC amb Arduino IDE i Visuino per mostrar l’hora a la pantalla LCD.

Pas 1: què necessiteu

1. M5StickC ESP32: el podeu obtenir aquí
2. Programa Visuino: descarregar Visuino

Nota: Consulteu aquest tutorial aquí sobre com instal·lar la placa StickC ESP32

Pas 2: Inicieu Visuino i seleccioneu el tipus de placa M5 Stack Stick C

Inicieu Visuino com es mostra a la primera imatge Feu clic al botó "Eines" del component Arduino (imatge 1)

a Visuino Quan aparegui el quadre de diàleg, seleccioneu "M5 Stack Stick C" tal com es mostra a la imatge 2

Pas 3: a Visuino Afegeix i configura components

1. Feu clic al tauler "M5 Stack Stick C" per seleccionar-lo
2. A la finestra "Propietats", seleccioneu "Mòduls" i feu clic a "+" per expandir, seleccioneu "Mostra ST7735" i feu clic a "+" per expandir-lo.
3. Estableix Orientació a "goRight" <això significa com s'orientarà l'hora a la pantalla LCD
4. Seleccioneu "Elements" i feu clic al botó blau amb 3 punts …
5. Es mostrarà el quadre de diàleg Elements
6. Al quadre de diàleg Elements, arrossegueu "Camp de text" del costat dret a l'esquerra

Feu clic al "Camp de text 1" a la part esquerra per seleccionar-lo i, a continuació, a la "Finestra de propietats" feu clic a color i configureu-lo a "aclOrange"

-també a les finestres de propietats, definiu X: 10 i Y: 20 aquí és on voleu mostrar l'hora a la pantalla LCD

-set size: 3: aquesta és la mida de la lletra del temps

-Podeu configurar la mida i el color del text si voleu

Tanqueu la finestra dels elements

Opcionalment:

Feu clic al tauler "M5 Stack Stick C" per seleccionar-lo

A la finestra "Propietats", seleccioneu "Mòduls" i feu clic a "+" per expandir, seleccioneu "Pantalla ST7735" i feu clic a "+" per expandir-lo i veureu "Color de fons". Aquest és el color per defecte de la pantalla, canvieu-lo a el vostre color preferit, també podeu definir la brillantor de la pantalla, el valor per defecte és 1 (màxim), podeu establir-lo a 0,5 o algun altre valor per fer-lo més feble

6. Afegiu el component "Decodifica (divideix) la data / hora" 7. Afegiu el component "Text formatat"

Pas 4: a Components del conjunt de Visuino

1. Seleccioneu el component "FormattedTxt1" i a la finestra "Propietats" configureu "Text" a:% 0:% 1:% 2
2. Feu doble clic al component "FormatText1" i al quadre de diàleg Elements arrossegueu 3x "Element de text" cap a l'esquerra

Pas 5: a Components de Visuino Connect

• Connecteu "M5 Stack Stick C"> Rellotge despertador en temps real (RTC)> Pin [Out] al pin del component "DecodeDateTime1" [In]
• Connecteu el pin del component "DecodeDateTime1" [Hora] al pin "ComponentText1" del component "TextElement1" [In]
• Connecteu el pin del component "DecodeDateTime1" [Minut] al pin "ComponentText1" del component "TextElement2" [In]
• Connecteu el pin del component "DecodeDateTime1" [Segon] al pin "ComponentText1" del component "TextElement3" [In]
• Connecteu el pin del component "FormattedText1" [Out] al tauler "M5 Stack Stick C" "Display ST7735"> el pin "Field Field1" [In]

Pas 6: Genereu, compileu i pengeu el codi Arduino

• A Visuino, a la part inferior, feu clic a la pestanya "Construeix", assegureu-vos que el port correcte estigui seleccionat i feu clic al botó "Compila / Compila i penja".

Pas 7: Juga

Si enceneu el mòdul M5Sticks, la pantalla hauria de començar a mostrar l'hora.

Enhorabona! Heu completat el vostre projecte M5Sticks amb Visuino. També s’adjunta el projecte Visuino, que he creat per a aquest instructable, el podeu descarregar aquí.

Podeu descarregar-lo i obrir-lo a Visuino:

Pas 8: Extra: truc simple

Podeu utilitzar l'hora actual que hi havia al vostre ordinador en el moment que vau compilar el codi a Arduino.

Per fer-ho, només cal deixar anar un component "Compila la data i l'hora" i connectar-lo al pin "M5 Stack Stick C"> "Rellotge despertador en temps real (RTC)" [Set]

Podeu descarregar el fitxer Project amb aquest truc aquí.

Pas 9: al següent tutorial

Al següent tutorial us mostraré com fer un rellotge Cool Look on podeu configurar l'hora mitjançant els botons StickC. Estigueu atents i consulteu els meus altres tutorials aquí.