M5StickC Ura s čudovitim videzom z menijem in nastavitvijo svetlosti: 8 korakov

2024 Avtor: John Day | [email protected]. Nazadnje spremenjeno: 2024-01-30 12:02

V tej vadnici se bomo naučili, kako programirati ESP32 M5Stack StickC z Arduino IDE in Visuino za prikaz časa na LCD -ju ter nastaviti čas in svetlost z menijem in gumbi StickC.

Oglejte si predstavitveni video.

Korak: Kaj boste potrebovali

M5StickC ESP32: dobite ga tukaj

Program Visuino: Prenesite Visuino

Opomba: V tem priročniku si oglejte, kako namestiti ploščo StickC ESP32

Korak: Zaženite Visuino in izberite vrsto plošče M5 Stack Stick C

Zaženite Visuino, kot je prikazano na prvi sliki Kliknite gumb "Orodja" na komponenti Arduino (slika 1) v Visuinu Ko se prikaže pogovorno okno, izberite "M5 Stack Stick C", kot je prikazano na sliki 2

3. korak: V Visuinu nastavite ploščo StickC

1. Kliknite na ploščo "M5 Stack Stick C", da jo izberete
2. V oknu "Lastnosti" izberite "Moduli" in kliknite "+" za razširitev,
3. Izberite "Display ST7735" in kliknite "+", da ga razširite,
4. "Orientation" nastavite na "goRight"
5. "Barva ozadja" nastavite na "ClBlack"
6. Izberite "Elementi" in kliknite modri gumb s tremi pikami …
7. Prikaže se pogovorno okno Elementi
8. V pogovornem oknu Elements povlecite 2X "Besedilno polje" z desne strani na levo
9. Kliknite na "Besedilno polje1" na levi strani, da ga izberete, nato v "oknu Lastnosti" kliknite na "Barva" in ga nastavite na "aclOrange", kliknite na "Fill Color" in ga nastavite na "aclBlack" (Vi lahko igrate z barvami, če želite) -tudi v oknih lastnosti, nastavljenih X: 10 in Y: 20, tukaj želite prikazati čas na velikosti LCD -zaslona: 3 (to je velikost pisave časa)
10. Kliknite na "Besedilno polje 2" na levi strani, da ga izberete, nato v oknu "Lastnosti" kliknite na "Barva" in ga nastavite na "aclAqua", kliknite na "Polni barvo" in ga nastavite na "aclBlack"

(Če želite, se lahko igrate z barvami) -nastavite "Initial Value" na: Nastavite HOUR

-tudi v oknih z lastnostmi, nastavljenimi X: 10 in Y: 2, tukaj želite prikazati meni na LCD -zaslonu -velikost nastavitve: 1 (to je velikost pisave menija)

Zaprite okno elementov

1. Kliknite na ploščo "M5 Stack Stick C", da jo izberete
2. V oknu "Lastnosti" izberite "Moduli" in kliknite "+" za razširitev,
3. Izberite "Prikaži budilko v realnem času (RTC)" in kliknite "+", da jo razširite,
4. Izberite "Elementi" in kliknite modri gumb s tremi pikami …
5. V pogovornem oknu Elements povlecite "Nastavi uro" z desne strani na levo in v oknu lastnosti nastavite "Dodaj vrednost" na: True in "Vrednost" na: 1
6. V pogovornem oknu Elements povlecite "Set Minute" z desne strani na levo in v oknu lastnosti nastavite "Add Value" na: True in "Value" na: 1
7. V pogovornem oknu Elements povlecite "Set Second" z desne strani na levo in v oknu lastnosti nastavite "Add Value" na: True in "Value" na: 1

Zaprite okno elementov

4. korak: V Visuinu dodajte komponente

1. Dodajte 2x komponento "Debounce Button"
2. Dodajte komponento "Gumb za samodejno ponavljanje"
3. Dodajte komponento »Besedilni niz«
4. Dodajte komponento "Analog Array"
5. Dodajte 2x komponento "Counter"
6. Dodajte komponento "Clock Demux (Multiple Output Channel Switch)"
7. Dodajte komponento "Decode (Split) Date/Time"
8. Dodajte komponento "FormattedText1"

5. korak: V komponentah Visuino Set

1. Izberite komponento "FormattedText1" in v oknu "Properties" nastavite "Text" na:%0:%1:%2
2. Dvokliknite komponento "FormattedText1" in v pogovornem oknu Elementi trikrat povlecite "Besedilni element" v levo
3. Izberite "TextElement1" na levi strani in v oknu lastnosti nastavite "Fill Character" na: 0 in "Length" na: 2
4. Izberite "TextElement2" na levi strani in v oknu lastnosti nastavite "Fill Character" na: 0 in "Length" na: 2
5. Izberite "TextElement3" na levi strani in v oknu lastnosti nastavite "Fill Character" na: 0 in "Length" na: 2
6. Izberite komponento "ClockDemmux1" in v oknu lastnosti nastavite "Output Pins" na: 5
7. Izberite komponento "Counter1" in v oknu lastnosti razširite "Max" in nastavite "Value" na: 4
8. Izberite komponento "Counter1" in v oknu lastnosti razširite "Min" in nastavite "Value" na: 0
9. Izberite komponento "Counter2" in v oknu lastnosti razširite "Max" in nastavite "Value" na: 6
10. Izberite komponento "Counter2" in v oknu z lastnostmi razširite "Min" in nastavite "Value" na: 0BUILDING MENU:
11. Izberite komponento "Array1" (Text Array) in dvokliknite nanjo. -V oknu elementov povlecite 4X "Value" na levo stran-Na levi strani izberite "Item [1]" in v oknu lastnosti nastavite "Value" do: NASTAVI URE-Na levi strani izberite "Postavka [2]" in v oknu lastnosti nastavite "Vrednost" na: NASTAVI MINUTE-Na levi strani izberite "Element [3]" in v oknu lastnosti nastavite "Vrednost" na: SET SECONDS-Na levi strani izberite "Item [4]" in v oknu lastnosti nastavite "Value" na: SET BRIGHTNESS Zaprite okno Elements.

12. Izberite komponento "Array2" (Analog Array) in dvokliknite nanjo.-V oknu elementov povlecite 6X "Value" na levo stran-Na levi strani izberite "Item [0]" in v oknu lastnosti nastavite "Value" do: 1

    -Na levi strani izberite "Postavka [1]" in v oknu lastnosti nastavite "Vrednost" na: 0,9

    -Na levi strani izberite "Element [2]" in v oknu lastnosti nastavite "Vrednost" na: 0,8 -Na levi strani izberite "Element [3]" in v oknu lastnosti nastavite "Vrednost" na: 0,7 -Vklopljeno na levi strani Izberite "Element [4]" in v oknu lastnosti nastavite "Vrednost" na: 0,6-Na levi strani izberite "Element [5]" in v oknu lastnosti nastavite "Vrednost" na: 0,55

6. korak: V komponentah Visuino Connect

1. Priključite "M5 Stack Stick C" pin A (M5) na "Button2" pin [In]
2. Priključite pin "M5 Stack Stick C" [B] na "Button1" pin [In]
3. Pin "Button2" [Out] priključite na pin "RepeatButton1" [In]
4. Priključite "RepeatButton1" pin [Out] na pin "ClockDemmux1" [In]
5. Priključite "Button1" pin [Out] na pin "Counter1" [In]
6. Priključite "M5 Stack Stick C"> "Budilka v realnem času (RTC)" [Out] na pin "DecodeDateTime1" [In]
7. Pin "DecodeDateTime1" [Hour] povežite z "FormattedText1"> "TextElement1" pin [In]
8. Pin "DecodeDateTime1" [Minute] povežite z "FormattedText1"> "TextElement2" pin [In]
9. Pin "DecodeDateTime1" [drugi] povežite z "FormattedText1"> "TextElement3" pin [In]
10. Priključite zatič "FormattedText1" [Out] na ploščo "M5 Stack Stick C"> "Display ST7735"> "Text Text1" pin [In]
11. Pin "Counter1" [Out] priključite na "ClockDemmux1" pin [Select] in na "Array1" pin [Index]
12. Pin "Counter2" [Out] priključite na pin "Array2" [Index]
13. Pin "Array1" [Out] priključite na ploščo "M5 Stack Stick C"> "Display ST7735"> pin "Text Field2" [In]
14. Pin "Array2" [Out] priključite na ploščo "M5 Stack Stick C"> "Display ST7735"> pin [Brightness]
15. Priključite pin "ClockDemmux1" [1] na ploščo "M5 Stack Stick C"> "Budilka v realnem času (RTC)"> "Nastavi uro 1" [Ura]
16. Priključite "ClockDemmux1" pin [2] na ploščo "M5 Stack Stick C"> "Budilka v realnem času (RTC)"> "Pin minute 1" [Clock]
17. Priključite pin "ClockDemmux1" [3] na ploščo "M5 Stack Stick C"> "Budilka v realnem času (RTC)"> "Nastavi sekundo1" pin [Ura]
18. Priključite "ClockDemmux1" pin [4] na pin "Counter2" [In]

Korak 7: Ustvarite, prevedite in naložite kodo Arduino

V Visuinu na dnu kliknite zavihek "Build", se prepričajte, da so izbrana pravilna vrata, nato kliknite gumb "Compile/Build and Upload".

8. korak: Igrajte se

Če napajate modul M5Sticks, bi moral zaslon začeti prikazovati čas. Čas in svetlost lahko spremenite s tipkami "B" za prikaz menija in preklapljanjem med (Nastavitev ur, Nastavitev minut, Nastavitev sekund, Nastavitev svetlosti) in za nastavitev uporabite gumb "M5".

Čestitamo! Projekt M5Sticks ste zaključili z Visuinom. Priložen je tudi projekt Visuino, ki sem ga ustvaril za to navodilo, ki ga lahko prenesete tukaj. Lahko ga prenesete in odprete v Visuinu: