M5StickC Sat sa izgledom sa menijem i kontrolom osvetljenosti: 8 koraka

2024 Autor: John Day | [email protected]. Zadnja izmjena: 2024-01-30 08:04

U ovom ćemo vodiču naučiti kako programirati ESP32 M5Stack StickC s Arduino IDE -om i Visuinom za prikaz vremena na LCD -u te postaviti vrijeme i svjetlinu pomoću izbornika i tipki StickC.

Pogledajte demonstracijski video.

Korak 1: Šta će vam trebati

M5StickC ESP32: možete ga nabaviti ovdje

Visuino program: Preuzmite Visuino

Napomena: Ovdje pročitajte ovaj vodič o tome kako instalirati StickC ESP32 ploču

Korak 2: Pokrenite Visuino i odaberite vrstu ploče M5 Stack Stick C ploče

Pokrenite Visuino kao što je prikazano na prvoj slici Pritisnite dugme "Alati" na Arduino komponenti (Slika 1) u Visuinu Kada se pojavi dijalog, odaberite "M5 Stack Stick C" kao što je prikazano na slici 2

Korak 3: U Visuinu postavite StickC ploču

1. Kliknite na ploču "M5 Stack Stick C" da biste je odabrali
2. U prozoru "Svojstva" odaberite "Moduli" i kliknite "+" za proširenje,
3. Odaberite "Display ST7735" i kliknite "+" da biste ga proširili,
4. Postavite "Orijentacija" na "goRight"
5. Postavite "Boja pozadine" na "ClBlack"
6. Odaberite "Elementi" i kliknite plavo dugme s 3 točke…
7. Dijalog elemenata će se prikazati
8. U dijalogu elemenata povucite 2X "Polje za tekst" s desne strane na lijevu stranu
9. Kliknite na "Polje za tekst1" s lijeve strane da biste ga odabrali, a zatim u prozoru "Svojstva" kliknite na "Boja" i postavite ga na "aclOrange", a zatim na "Fill Color" i postavite ga na "aclBlack" (Vi možete se igrati bojama ako želite) -također u prozorima svojstava postavljenih X: 10 i Y: 20 ovdje želite prikazati vrijeme na veličini LCD ekrana: 3 (ovo je veličina fonta vremena)
10. Kliknite na "Polje za tekst2" s lijeve strane da biste ga odabrali, a zatim u prozoru "Svojstva" kliknite na "Boja" i postavite ga na "aclAqua", a zatim kliknite na "Boja ispune" i postavite ga na "aclBlack"

(Možete se igrati bojama ako želite) -postavite "Početna vrijednost" na: Postavite SAT

-također u prozorima svojstava X: 10 i Y: 2 ovdje želite prikazati izbornik na LCD -u -veličina skupa: 1 (ovo je veličina fonta menija)

Zatvorite prozor elemenata

1. Kliknite na ploču "M5 Stack Stick C" da biste je odabrali
2. U prozoru "Svojstva" odaberite "Moduli" i kliknite "+" za proširenje,
3. Odaberite "Prikaz alarma u stvarnom vremenu (RTC)" i kliknite "+" da biste ga proširili,
4. Odaberite "Elementi" i kliknite plavo dugme s 3 točke…
5. U dijalogu elemenata povucite "Postavi sat" s desne strane na lijevu stranu, a u prozoru svojstava postavite "Dodaj vrijednost" na: Tačno i "Vrijednost" na: 1
6. U dijalogu elemenata povucite "Postavi minutu" s desne strane na lijevu stranu, a u prozoru svojstava postavite "Dodaj vrijednost" na: Tačno i "Vrijednost" na: 1
7. U dijalogu elemenata povucite "Postavi drugo" s desne strane na lijevu stranu, a u prozoru svojstava postavite "Dodaj vrijednost" na: Tačno i "Vrijednost" na: 1

Zatvorite prozor elemenata

Korak 4: U Visuinu dodajte komponente

1. Dodajte 2x komponentu "Debounce Button"
2. Dodajte komponentu "Automatsko ponavljanje dugmeta"
3. Dodajte komponentu "Text Array"
4. Dodajte komponentu "Analog Array"
5. Dodajte 2x "Counter" komponentu
6. Dodajte komponentu "Clock Demux (Multiple Output Channel Switch)"
7. Dodajte komponentu "Decode (Split) Date/Time"
8. Dodajte komponentu "FormattedText1"

Korak 5: U Visuinu Set Components

1. Odaberite komponentu "FormattedText1" i u prozoru "Svojstva" postavite "Tekst" na:%0:%1:%2
2. Dvaput kliknite na komponentu "FormattedText1" i u dijalogu Elementi povucite 3x "Tekstualni element" ulijevo
3. Odaberite "TextElement1" s lijeve strane i u prozoru svojstava postavite "Fill Character" na: 0 i "Length" na: 2
4. Odaberite "TextElement2" s lijeve strane i u prozoru svojstava postavite "Fill Character" na: 0 i "Length" na: 2
5. Odaberite "TextElement3" s lijeve strane i u prozoru svojstava postavite "Fill Character" na: 0 i "Length" na: 2
6. Odaberite komponentu "ClockDemmux1" i u prozoru svojstava postavite "Output Pins" na: 5
7. Odaberite komponentu "Counter1" i u prozoru svojstava proširite "Max" i postavite "Value" na: 4
8. Odaberite komponentu "Counter1" i u prozoru svojstava proširite "Min" i postavite "Value" na: 0
9. Odaberite komponentu "Counter2" i u prozoru svojstava proširite "Max" i postavite "Value" na: 6
10. Odaberite komponentu "Counter2" i u prozoru svojstava proširite "Min" i postavite "Value" na: 0 IZGRADNJA IZBORNIKA:
11. Odaberite komponentu "Polje1" (Tekstualni niz) i dvaput kliknite na nju. -U prozoru elemenata povucite 4X "Vrijednost" na lijevu stranu-Na lijevoj strani Odaberite "Stavka [1]", a u prozoru svojstava postavite "Vrijednost" do: SET HOURS-Na lijevoj strani Odaberite "Stavka [2]" i u prozoru svojstava postavite "Vrijednost" na: POSTAVLJANJE MINUTA-S lijeve strane Odaberite "Stavka [3]" i u prozoru svojstava postavite "Vrijednost" na: SET SECONDS-Na lijevoj strani Odaberite "Stavka [4]" i u prozoru svojstava postavite "Vrijednost" na: PODESI SVJETLOST Zatvorite prozor Elementi.

12. Odaberite komponentu "Array2" (Analog Array) i dvaput kliknite na nju. -U prozoru elemenata povucite 6X "Vrijednost" na lijevu stranu-Na lijevoj strani Odaberite "Stavka [0]", a u prozoru svojstava postavite "Vrijednost" do: 1

    -Na lijevoj strani odaberite "Stavka [1]" i u prozoru svojstava postavite "Vrijednost" na: 0,9

    -Na lijevoj strani odaberite "Stavka [2]" i u prozoru svojstava postavite "Vrijednost" na: 0,8 -Na lijevoj strani odaberite "Stavka [3]", a u prozoru svojstava postavite "Vrijednost" na: 0,7 -Uključeno s lijeve strane Odaberite "Stavka [4]" i u prozoru svojstava postavite "Vrijednost" na: 0,6-S lijeve strane Odaberite "Stavka [5]" i u prozoru svojstava postavite "Vrijednost" na: 0,55

Korak 6: U Visuino Connect Components

1. Spojite "M5 Stack Stick C" pin A (M5) na "Button2" pin [In]
2. Spojite pin "M5 Stack Stick C" [B] na "Button1" pin [In]
3. Spojite pin "Button2" [Out] na pin "RepeatButton1" [In]
4. Spojite "RepeatButton1" pin [Out] na "ClockDemmux1" pin [In]
5. Spojite "Button1" pin [Out] na "Counter1" pin [In]
6. Spojite pin "M5 Stack Stick C"> "Budilica u stvarnom vremenu (RTC)" na izlaz "DecodeDateTime1" [In]
7. Spojite pin "DecodeDateTime1" [Sat] na "FormattedText1"> "TextElement1" pin [In]
8. Spojite pin "DecodeDateTime1" [Minute] na "FormattedText1"> "TextElement2" pin [In]
9. Spojite pin "DecodeDateTime1" [drugi] na "FormattedText1"> "TextElement3" pin [In]
10. Priključite iglu "FormattedText1" [Out] na ploču "M5 Stack Stick C"> "Display ST7735"> "Text Text1" pin [In]
11. Priključite pin "Counter1" [Out] na pin "ClockDemmux1" [Select] i na pin "Array1" [Index]
12. Spojite "Counter2" pin [Out] na "Array2" pin [Index]
13. Priključite iglu "Array1" [Out] na ploču "M5 Stack Stick C"> "Display ST7735"> "Text Field2" pin [In]
14. Spojite "Array2" pin [Out] na ploču "M5 Stack Stick C"> "Display ST7735"> pin [Brightness]
15. Priključite iglu "ClockDemmux1" [1] na ploču "M5 Stack Stick C"> "Budilica u stvarnom vremenu (RTC)"> "Postavi sat 1" pin [Sat]
16. Priključite iglu "ClockDemmux1" [2] na ploču "M5 Stack Stick C"> "Sat za alarm u stvarnom vremenu (RTC)"> "Postavi minutu1" pin [Sat]
17. Priključite iglu "ClockDemmux1" [3] na ploču "M5 Stack Stick C"> "Budilica u stvarnom vremenu (RTC)"> "Postavi sekundu 1" pin [Sat]
18. Spojite "ClockDemmux1" pin [4] na "Counter2" pin [In]

Korak 7: Generirajte, kompajlirajte i prenesite Arduino kôd

U Visuinu, pri dnu kliknite na karticu "Build", provjerite je li odabran ispravan port, a zatim kliknite na dugme "Compile/Build and Upload".

Korak 8: Igrajte se

Ako napajate modul M5Sticks, zaslon bi trebao početi prikazivati vrijeme. Možete promijeniti vrijeme i svjetlinu pomoću tipki "B" za prikaz izbornika i prebacivanjem između (Postavite sate, Postavite minute, Podesite sekunde, Postavite svjetlinu) i upotrijebite gumb "M5" za postavljanje.

Čestitamo! Završili ste svoj projekt M5Sticks s Visuinom. U prilogu je i projekt Visuino koji sam stvorio za ovu Instructable, možete ga preuzeti ovdje. Možete ga preuzeti i otvoriti u Visuinu: