M5StickC Kul klokke med meny og lysstyrkekontroll: 8 trinn

2025 Forfatter: John Day | [email protected]. Sist endret: 2025-01-13 06:58

I denne opplæringen lærer vi hvordan du programmerer ESP32 M5Stack StickC med Arduino IDE og Visuino for å vise en tid på LCD -skjermen og også angi tid og lysstyrke ved hjelp av menyen og StickC -knappene.

Se en demonstrasjonsvideo.

Trinn 1: Det du trenger

M5StickC ESP32: du kan få den her

Visuino -program: Last ned Visuino

Merk: Sjekk denne opplæringen her om hvordan du installerer StickC ESP32 -kort

Trinn 2: Start Visuino, og velg M5 Stack Stick C -korttype

Start Visuino som vist på det første bildet Klikk på "Verktøy" -knappen på Arduino -komponenten (Bilde 1) i Visuino Når dialogboksen vises, velg "M5 Stack Stick C" som vist på Bilde 2

Trinn 3: Sett i Visuino StickC Board

1. Klikk på "M5 Stack Stick C" -brettet for å velge det
2. I vinduet "Egenskaper" velger du "Moduler" og klikker "+" for å utvide,
3. Velg "Display ST7735" og klikk "+" for å utvide den,
4. Sett "Orientering" til "goRight"
5. Sett "Bakgrunnsfarge" til "ClBlack"
6. Velg "Elements" og klikk på den blå knappen med 3 prikker …
7. Elements Dialog vil vises
8. I dialogboksen Elementer drar du 2X "Tekstfelt" fra høyre side til venstre
9. Klikk på "Tekstfelt1" på venstre side for å velge det, klikk deretter på "Farge" i "Egenskaper -vinduet" og sett det til "aclOrange" og klikk på "Fyllfarge" og sett det til "aclBlack" (Du kan leke med fargene hvis du vil) -også i egenskapene Windows setter X: 10 og Y: 20 det er her du vil vise tiden på LCD -settstørrelsen: 3 (dette er skriftstørrelsen for tiden)
10. Klikk på "Tekstfelt2" på venstre side for å velge det, klikk deretter på "Farge" i "Egenskaper -vinduet" og sett det til "aclAqua", klikk på "Fyllfarge" og sett det til "aclBlack"

(Du kan leke med fargene hvis du vil) -sett "Initial Value" til: Angi HOUR

-oso i egenskaper windows sett X: 10 og Y: 2 det er her du vil vise menyen på LCD -settets størrelse: 1 (dette er skriftstørrelsen på menyen)

Lukk elementvinduet

1. Klikk på "M5 Stack Stick C" -brettet for å velge det
2. I vinduet "Egenskaper" velger du "Moduler" og klikker "+" for å utvide,
3. Velg "Display Real Time Alarm Clock (RTC)" og klikk "+" for å utvide det,
4. Velg "Elements" og klikk på den blå knappen med 3 prikker …
5. I Elements-dialogboksen drar du "Sett time" fra høyre side til venstre, og i vinduet Egenskaper setter du "Add Value" til: True og "Value" til: 1
6. I Elements-dialogboksen drar du "Sett minutt" fra høyre til venstre, og i vinduet Egenskaper setter du "Legg til verdi" til: Sant og "Verdi" til: 1
7. I Elements-dialogboksen drar du "Sett andre" fra høyre til venstre, og i vinduet Egenskaper setter du "Legg til verdi" til: Sant og "Verdi" til: 1

Lukk elementvinduet

Trinn 4: I Visuino Legg til komponenter

1. Legg til 2x "Debounce Button" -komponent
2. Legg til "Auto Repeat Button" -komponent
3. Legg til "Text Array" -komponent
4. Legg til komponenten "Analog Array"
5. Legg til 2x "Counter" -komponent
6. Legg til komponenten "Clock Demux (Multiple Output channel Switch)"
7. Legg til "Decode (Split) Date/Time" -komponent
8. Legg til komponenten "FormattedText1"

Trinn 5: I Visuino -settkomponenter

1. Velg "FormattedText1" -komponenten og under "Egenskaper" -vinduet, sett "Tekst" til:%0:%1:%2
2. Dobbeltklikk på "FormattedText1" -komponenten og dra i dialogboksen Elements 3x "Text Element" til venstre
3. Velg "TextElement1" på venstre side og i egenskapsvinduet sett "Fyll tegn" til: 0 og "Lengde" til: 2
4. Velg "TextElement2" på venstre side og i egenskapsvinduet sett "Fyll tegn" til: 0 og "Lengde" til: 2
5. Velg "TextElement3" på venstre side og i egenskapsvinduet sett "Fyll tegn" til: 0 og "Lengde" til: 2
6. Velg "ClockDemmux1" -komponent, og sett "Output Pins" i vinduet egenskaper til: 5
7. Velg "Teller1" -komponent, og utvid "Maks" i vinduet for egenskaper og sett "Verdi" til: 4
8. Velg "Teller1" -komponent, og utvid "Min" i vinduet for egenskaper og sett "Verdi" til: 0
9. Velg "Counter2" -komponent, og utvid "Maks" i vinduet for egenskaper og sett "Verdi" til: 6
10. Velg "Counter2" -komponent og i egenskapsvinduet utvider du "Min" og setter "Verdi" til: 0BUILDING MENY:
11. Velg "Array1" -komponent (Text Array) og dobbeltklikk på den. -I elementvinduet drar du 4X "Value" til venstre side-På venstre side velger du "Item [1]" og i "Properties" -vinduet setter du "Value" til: SET HOURS-På venstre side Velg "Item [2]" og i "Properties" -vinduet sett "Value" til: SET MINUTTER-På venstre side Velg "Item [3]" og i "Properties" -vinduet sett "Value" til: SET SECONDS-På venstre side Velg "Item [4]" og i "Properties" -vinduet, sett "Value" til: SET LIGHTNESSLukk vinduet Elements. SETTING THE WALUES FOR LIGHTNESS:

12. Velg "Array2" -komponent (Analog Array) og dobbeltklikk på den. -I elementvinduet dra 6X "Verdi" til venstre side-På venstre side Velg "Element [0]" og i egenskapsvinduet sett "Verdi" til: 1

    -På venstre side velger du "Item [1]" og i "Properties" -vinduet setter du "Value" til: 0,9

    -På venstre side velger du "Element [2]" og i egenskapsvinduet angir du "Verdi" til: 0,8 -Velger "Element [3]" på venstre side og i "Egenskapsvinduet" setter du "Verdi" til: 0,7 -På på venstre side Velg "Element [4]" og i egenskapsvinduet sett "Verdi" til: 0,6-På venstre side Velg "Vare [5]" og i egenskapsvinduet sett "Verdi" til: 0,55

Trinn 6: I Visuino Connect -komponenter

1. Koble "M5 Stack Stick C" pin A (M5) til "Button2" pin [In]
2. Koble "M5 Stack Stick C" pin [B] til "Button1" pin [In]
3. Koble "Button2" pin [Out] til "RepeatButton1" pin [In]
4. Koble "RepeatButton1" pin [Out] til "ClockDemmux1" pin [In]
5. Koble "Button1" pin [Out] til "Counter1" pin [In]
6. Koble "M5 Stack Stick C"> "Real Time Alarm Clock (RTC)" pin [Out] til "DecodeDateTime1" pin [In]
7. Koble "DecodeDateTime1" pin [Time] til "FormattedText1"> "TextElement1" pin [In]
8. Koble "DecodeDateTime1" pin [Minute] til "FormattedText1"> "TextElement2" pin [In]
9. Koble "DecodeDateTime1" pin [Second] til "FormattedText1"> "TextElement3" pin [In]
10. Koble "FormattedText1" pin [Out] til "M5 Stack Stick C" board> "Display ST7735"> "Text Field1" pin [In]
11. Koble "Counter1" pin [Out] til "ClockDemmux1" pin [Select] og til "Array1" pin [Index]
12. Koble "Counter2" pin [Out] til "Array2" pin [Index]
13. Koble "Array1" pin [Out] til "M5 Stack Stick C" board> "Display ST7735"> "Text Field2" pin [In]
14. Koble "Array2" pin [Out] til "M5 Stack Stick C" board> "Display ST7735"> pin [Brightness]
15. Koble "ClockDemmux1" -pinne [1] til "M5 Stack Stick C" -kortet> "Sanntids vekkerklokke (RTC)"> "Sett time1" -pinne [Klokke]
16. Koble "ClockDemmux1" pin [2] til "M5 Stack Stick C" -kortet "" Real Time Alarm Clock (RTC) ">" Set Minute1 "pin [Clock]
17. Koble "ClockDemmux1" pin [3] til "M5 Stack Stick C" -kortet> "Real Time Alarm Clock (RTC)"> "Set Second1" pin [Clock]
18. Koble "ClockDemmux1" pin [4] til "Counter2" pin [In]

Trinn 7: Generer, kompiler og last opp Arduino -koden

I Visuino klikker du på "Build" -fanen nederst, og kontrollerer at den riktige porten er valgt. Klikk deretter på "Compile/Build and Upload" -knappen.

Trinn 8: Spill

Hvis du driver M5Sticks -modulen, bør displayet begynne å vise tiden. Du kan endre tid og lysstyrke med knappene "B" for å vise menyen og bytte mellom (Angi timer, Angi minutter, Angi sekunder, Angi lysstyrke) og bruk knappen "M5" for å stille den inn.

Gratulerer! Du har fullført M5Sticks -prosjektet ditt med Visuino. Vedlagt er også Visuino -prosjektet, som jeg opprettet for denne Instructable, du kan laste det ned her. Du kan laste den ned og åpne den i Visuino: