DIY Hur man gör en snygg klocka - StickC - Lätt att göra: 8 steg
DIY Hur man gör en snygg klocka - StickC - Lätt att göra: 8 steg

Innehållsförteckning:

Anonim

I denna handledning lär vi oss hur man programmerar ESP32 M5Stack StickC med Arduino IDE och Visuino för att visa en tid på LCD -skärmen och ställa in tiden med StickC -knappar.

Steg 1: Vad du behöver

Vad du kommer att behöva
Vad du kommer att behöva
Vad du kommer att behöva
Vad du kommer att behöva

M5StickC ESP32: du kan få det här

Visuino -program: Ladda ner Visuino

Obs! Läs den här handledningen om hur du installerar StickC ESP32 -kort

Steg 2: Starta Visuino och välj M5 Stack Stick C -korttyp

Starta Visuino och välj M5 Stack Stick C -korttyp
Starta Visuino och välj M5 Stack Stick C -korttyp
Starta Visuino och välj M5 Stack Stick C -korttyp
Starta Visuino och välj M5 Stack Stick C -korttyp
Starta Visuino och välj M5 Stack Stick C -korttyp
Starta Visuino och välj M5 Stack Stick C -korttyp

Starta Visuino som visas på den första bilden Klicka på "Verktyg" -knappen på Arduino -komponenten (bild 1) i Visuino När dialogrutan visas väljer du "M5 Stack Stick C" som visas på bild 2

Steg 3: Lägg till komponenter i Visuino

Lägg till komponenter i Visuino
Lägg till komponenter i Visuino
Lägg till komponenter i Visuino
Lägg till komponenter i Visuino
Lägg till komponenter i Visuino
Lägg till komponenter i Visuino
  1. Klicka på "M5 Stack Stick C" -kortet för att välja det
  2. I fönstret "Egenskaper" väljer du "Moduler" och klickar på "+" för att expandera,
  3. Välj "Display ST7735" och klicka på "+" för att expandera den,
  4. Ställ in "Orientering" på "goRight"
  5. Ställ in "Bakgrundsfärg" på "ClBlack"
  6. Välj "Element" och klicka på den blå knappen med tre prickar …
  7. Elements -dialogrutan visas
  8. Dra "Textfält" från höger till vänster i dialogrutan Elements

  9. Klicka på "Textfält1" på vänster sida för att välja det, klicka sedan på "Färg" i fönstret "Egenskaper" och ställ in det till "aclWhite" och klicka på "Fyll färg" och ställ det till "aclBlack" (Du kan leka med färgerna om du vill)

    -och även i egenskaper windows ställer in X: 10 och Y: 20 här vill du visa tiden på LCD -storleken: 3 (detta är tidens teckenstorlek) Stäng elementfönstret

  10. Lägg till "Decode (Split) Date/Time" -komponent
  11. Lägg till komponenten "Formaterad text"

Steg 4: I Visuino Set Components

I Visuino Set -komponenter
I Visuino Set -komponenter
I Visuino Set -komponenter
I Visuino Set -komponenter
I Visuino Set -komponenter
I Visuino Set -komponenter
  1. Välj "FormattedTxt1" -komponenten och under "Egenskaper" -fönstret ställ in "Text" till:%0:%1:%2
  2. Dubbelklicka på "FormattedText1" -komponenten och dra i dialogrutan Elements 3x "Textelement" till vänster
  3. Välj "M5 Stack Stick C" -kortet och i fönstret "Egenskaper" välj "Moduler"> "Realtids väckarklocka (RTC)"> "Element"
  4. Klicka på den blå knappen med tre prickar och dra "Ställ in timme", "Ställ in minut" och "Ställ in andra" i dialogrutan Elements till vänster
  5. Välj till vänster "Ställ in timme" -elementet och i fönstret "Egenskaper" ställ in "Lägg till värde" till "Sant" och "Värde" till "1"
  6. Välj till vänster "Ställ in minut1" -elementet och under "Egenskaper" -fönstret ställ "Lägg till värde" till "Sant" och "Värde" till "1"
  7. Välj till vänster "Ange andra1" -elementet och under fönstret "Egenskaper" ställ in "Lägg till värde" till "Sant" och "Värde" till "1"

Förklaring:

"Värde" betyder hur mycket vi vill lägga till med varje klick på en knapp till den befintliga tiden (antingen timmar, minuter eller sekunder) "Lägg till värde" betyder att vi vill lägga till värdet till den befintliga tiden

Steg 5: I Visuino Connect -komponenter

I Visuino Connect -komponenter
I Visuino Connect -komponenter
I Visuino Connect -komponenter
I Visuino Connect -komponenter
  1. Anslut "M5 Stack Stick C"> Real Time Alarm Clock (RTC)> Pin [Out] till "DecodeDateTime1" komponentstift [In]
  2. Anslut komponentstiftet "DecodeDateTime1" [Hour] till "FormattedText1" component "TextElement1" pin [In]
  3. Anslut komponentstiftet "DecodeDateTime1" [Minute] till "FormattedText1" komponent "TextElement2" pin [In]
  4. Anslut "DecodeDateTime1" komponentstift [Second] till "FormattedText1" komponent "TextElement3" pin [In]
  5. Anslut "FormattedText1" komponentstift [Out] till "M5 Stack Stick C" -kortet "Display ST7735"> "Text Field1" pin [In]
  6. Anslut "M5 Stack Stick C"> Knappar "A (M5)" till "M5 Stack Stick C"> Real Time Alarm Clock (RTC)> "Set Hour1" Pin [Clock]
  7. Anslut "M5 Stack Stick C"> Knappar "B" till "M5 Stack Stick C"> Väckarklocka i realtid (RTC)> "Set Minute1" Pin [Clock]

Steg 6: Generera, kompilera och ladda upp Arduino -koden

Generera, kompilera och ladda upp Arduino -koden
Generera, kompilera och ladda upp Arduino -koden

  1. I Visuino klickar du längst ned på fliken "Bygg", se till att rätt port är vald, klicka sedan på "Kompilera/bygga och ladda upp" -knappen.

Steg 7: Spela

Om du driver M5Sticks -modulen bör displayen börja visa tiden. Du kan ändra tiden med knapparna "M5" för timmar och "B" för minuter

Grattis! Du har slutfört ditt M5Sticks -projekt med Visuino. Vidare bifogas Visuino -projektet, som jag skapade för denna Instructable, du kan ladda ner det här.

Du kan ladda ner och öppna den i Visuino:

Steg 8: I nästa handledning.

I nästa handledning kommer jag att visa dig hur du gör en cool tittande klocka där du kan ställa in tiden (timmar, minuter och sekunder) med StickC -knapparna och skapa en enkel meny! Håll utkik och kolla in mina andra handledning här.