Menü ve Parlaklık Kontrolü ile M5StickC Havalı Görünümlü Saat: 8 Adım

2024 Yazar: John Day | [email protected]. Son düzenleme: 2024-01-30 13:16

Bu derste ESP32 M5Stack StickC'yi Arduino IDE ve Visuino ile LCD'de bir zaman gösterecek şekilde nasıl programlayacağımızı ve ayrıca menü ve StickC düğmelerini kullanarak zamanı ve parlaklığı nasıl ayarlayacağınızı öğreneceğiz.

Bir tanıtım videosu izleyin.

Adım 1: Neye İhtiyacınız Olacak?

M5StickC ESP32: buradan alabilirsiniz

Visuino programı: Visuino'yu indirin

Not: StickC ESP32 kartının nasıl kurulacağına ilişkin bu eğiticiyi buradan kontrol edin

Adım 2: Visuino'yu başlatın ve M5 Stack Stick C Board Type'ı seçin

Visuino'yu ilk resimde gösterildiği gibi başlatın Visuino'da Arduino bileşenindeki (Resim 1) "Tools" düğmesine tıklayın (Resim 1) Diyalog göründüğünde, Resim 2'de gösterildiği gibi "M5 Stack Stick C"yi seçin

Adım 3: Visuino'da StickC Kartını Ayarlayın

1. Seçmek için "M5 Stack Stick C" Board'a tıklayın
2. "Özellikler" penceresinde "Modüller"i seçin ve Genişletmek için "+"ya tıklayın,
3. "Display ST7735"i seçin ve genişletmek için "+"ya tıklayın,
4. "Yönlendirme"yi "goRight" olarak ayarlayın
5. "Arka Plan Rengi"ni "ClBlack" olarak ayarlayın
6. "Elements" öğesini seçin ve 3 noktalı mavi düğmeye tıklayın…
7. Öğeler İletişim Kutusu gösterilecek
8. Elements Dialog'da 2X "Metin Alanı"nı sağdan sola doğru sürükleyin
9. Seçmek için sol taraftaki "Metin Alanı1" üzerine tıklayın, ardından "Özellikler penceresinde" "Renk" üzerine tıklayın ve "aclOrange" olarak ayarlayın ve "Dolgu Rengi" üzerine tıklayın ve "aclBlack" olarak ayarlayın (Siz dilerseniz renklerle oynayabilirsiniz) -ayrıca özellikler pencerelerinde X:10 ve Y:20 setleri LCD'de zamanı görüntülemek istediğiniz yerdir-set size:3 (bu, zamanın yazı tipi boyutudur)
10. Seçmek için sol taraftaki "Metin Alanı2" üzerine tıklayın, ardından "Özellikler penceresinde" "Renk" üzerine tıklayın ve "aclAqua" olarak ayarlayın ve "Dolgu Rengi" üzerine tıklayın ve "aclBlack" olarak ayarlayın.

(İsterseniz renklerle oynayabilirsiniz) -"Başlangıç Değeri"ni şuna ayarlayın: HOUR'u ayarlayın

-ayrıca özellikler pencerelerinde X:10 ve Y:2'yi ayarlayın, menüyü LCD'de görüntülemek istediğiniz yer burasıdır -set size:1 (menünün yazı tipi boyutudur)

Öğeler penceresini kapat

1. Seçmek için "M5 Stack Stick C" Board'a tıklayın
2. "Özellikler" penceresinde "Modüller"i seçin ve Genişletmek için "+"ya tıklayın,
3. "Gerçek Zamanlı Çalar Saati(RTC) Görüntüle"yi seçin ve genişletmek için "+"ya tıklayın,
4. "Elements" öğesini seçin ve 3 noktalı mavi düğmeye tıklayın…
5. Öğeler İletişim Kutusunda "Saati Ayarla"yı sağ taraftan sola sürükleyin ve özellikler penceresinde "Değer Ekle"yi:True ve "Değer"i şuna ayarlayın: 1
6. Öğeler İletişim Kutusunda "Dakikayı Ayarla"yı sağ taraftan sola sürükleyin ve özellikler penceresinde "Değer Ekle"yi:True ve "Değer"i şuna ayarlayın: 1
7. Öğeler İletişim Kutusunda "İkinci Ayarla"yı sağ taraftan sola sürükleyin ve özellikler penceresinde "Değer Ekle"yi:True ve "Değer"i şuna ayarlayın: 1

Öğeler penceresini kapat

Adım 4: Visuino'da Bileşen Ekleme

1. 2x "Geri Dönme Düğmesi" bileşeni ekleyin
2. "Otomatik Tekrar Düğmesi" bileşenini ekleyin
3. "Metin Dizisi" bileşeni ekle
4. "Analog Dizi" bileşeni ekleyin
5. 2x "Sayaç" bileşeni ekleyin
6. "Clock Demux(Çoklu Çıkış kanalı Anahtarı)" bileşenini ekleyin
7. "Decode(Split) Date/Time" bileşenini ekleyin
8. "FormattedText1" bileşenini ekleyin

Adım 5: Visuino Set Bileşenlerinde

1. "FormattedText1" bileşenini seçin ve "Özellikler" penceresinin altında "Metin"i %0:%1:%2 olarak ayarlayın
2. "FormattedText1" bileşenine çift tıklayın ve Elements iletişim kutusunda 3x "Text Element" öğesini sola sürükleyin
3. Sol tarafta "TextElement1" öğesini seçin ve özellikler penceresinde "Doldurma Karakteri"ni 0 ve "Uzunluk"u: 2 olarak ayarlayın.
4. Sol tarafta "TextElement2"yi seçin ve özellikler penceresinde "Doldurma Karakteri"ni 0 ve "Uzunluk"u: 2 olarak ayarlayın.
5. Sol tarafta "TextElement3"ü seçin ve özellikler penceresinde "Doldurma Karakteri"ni 0 ve "Uzunluk"u: 2 olarak ayarlayın.
6. "ClockDemmux1" bileşenini seçin ve özellikler penceresinde "Çıkış Pinleri"ni şu şekilde ayarlayın: 5
7. "Sayaç1" bileşenini seçin ve özellikler penceresinde "Max" öğesini genişletin ve "Değer"i şuna ayarlayın: 4
8. "Sayaç1" bileşenini seçin ve özellikler penceresinde "Min" öğesini genişletin ve "Değer"i şuna ayarlayın: 0
9. "Sayaç2" bileşenini seçin ve özellikler penceresinde "Max" öğesini genişletin ve "Değer"i şuna ayarlayın: 6
10. "Sayaç2" bileşenini seçin ve özellikler penceresinde "Min" öğesini genişletin ve "Değer"i şu şekilde ayarlayın: 0MENÜ OLUŞTURMAK:
11. "Array1" bileşenini (Text Array) seçin ve üzerine çift tıklayın.-Elementler penceresinde 4X "Value" öğesini sola sürükleyin-Sol tarafta "Item[1]" öğesini seçin ve özellikler penceresinde "Value" öğesini ayarlayın için: SAAT AYARLA-Sol tarafta "Öğe[2]"yi seçin ve özellikler penceresinde "Değer"i şuna ayarlayın: DAKİKA AYARLA-Sol tarafta "Öğe[3]"yi seçin ve özellikler penceresinde "Değer"i ayarlayın için: SANİYE AYARLA-Sol tarafta "Öğe[4]" seçin ve özellikler penceresinde "Değer"i şuna ayarlayın: PARLAKLIK AYARLA Öğeler penceresini kapatın. PARLAKLIK DEĞERLERİNİN AYARLANMASI:

12. "Array2" bileşenini (Analog Array) seçin ve üzerine çift tıklayın.-Elementler penceresinde 6X "Value" öğesini sola sürükleyin-Sol tarafta "Item[0]" öğesini seçin ve özellikler penceresinde "Value" öğesini ayarlayın 1'e

    -Sol tarafta "Öğe[1]"yi seçin ve özellikler penceresinde "Değer"i 0.9 olarak ayarlayın.

    -Sol tarafta "Öğe[2]"yi seçin ve özellikler penceresinde "Değer"i 0,8 olarak ayarlayın -Sol tarafta "Öğe[3]"yi seçin ve özellikler penceresinde "Değer"i 0,7-Açık olarak ayarlayın sol taraf "Öğe[4]" öğesini seçin ve özellikler penceresinde "Değer"i şuna ayarlayın: 0.6-Sol tarafta "Öğe[5]"yi seçin ve özellikler penceresinde "Değer"i şuna ayarlayın: 0,55

Adım 6: Visuino Connect Bileşenlerinde

1. "M5 Yığın Çubuğu C" pin A(M5)'i "Button2" pin [In]'e bağlayın
2. "M5 Yığın Çubuğu C" pimini [B] "Düğme1" pimini [Giriş]'e bağlayın
3. "Button2" pini [Out]'u 'RepeatButton1" pini [In]'e bağlayın
4. "RepeatButton1" pini [Out]'u "ClockDemmux1" pini [In]'e bağlayın
5. "Düğme1" pimini [Çıkış]'ı "Sayaç1" pimini[Giriş]'e bağlayın
6. "M5 Stack Stick C" > "Gerçek Zamanlı Çalar Saat(RTC)" pinini [Out] "DecodeDateTime1" pinine [In] bağlayın
7. "DecodeDateTime1" pin[Hour]'u "FormattedText1">"TextElement1" pin[In]'e bağlayın
8. "DecodeDateTime1" pin[Dakika]'yı "FormattedText1">"TextElement2" pin[In]'e bağlayın
9. "DecodeDateTime1" pin[Second]'ı "FormattedText1">"TextElement3" pin[In]'e bağlayın
10. "FormattedText1" pinini [Out]'u "M5 Stack Stick C" kartına > "Display ST7735" > "Text Field1" pinine [In] bağlayın
11. "Sayaç1" pinini[Çıkış]'ı "ClockDemmux1" pinine[Seç] ve "Array1" pinine[Index] bağlayın
12. "Sayaç2" pinini[Çıkış]'ı "Array2" pinine[Index] bağlayın
13. "Array1" pinini [Out] "M5 Stack Stick C" kartına > "Display ST7735" > "Text Field2" pinine [In] bağlayın
14. "Array2" pinini [Out] "M5 Stack Stick C" kartına > "Display ST7735" > pin [Parlaklık]'a bağlayın
15. "ClockDemmux1" pinini[1] "M5 Stack Stick C" kartına > "Gerçek Zamanlı Çalar Saat(RTC)" > "Saati Ayarla1" pini [Clock]'a bağlayın
16. "ClockDemmux1" pin[2]'yi "M5 Stack Stick C" kartına > "Gerçek Zamanlı Çalar Saat(RTC)" > "Dakika1 Ayarla" pin [Saat]'e bağlayın
17. "ClockDemmux1" pinini[3] "M5 Stack Stick C" kartına > "Gerçek Zamanlı Alarm Clock(RTC)" > "Set Second1" pin [Clock]'a bağlayın
18. "ClockDemmux1" pinini[4] "Counter2" pinine [In] bağlayın

Adım 7: Arduino Kodunu Oluşturun, Derleyin ve Yükleyin

Visuino'da, en alttaki "Build" Sekmesine tıklayın, doğru bağlantı noktasının seçildiğinden emin olun, ardından "Compile/Build and Upload" düğmesine tıklayın.

8. Adım: Oynat

M5Sticks modülüne güç verirseniz, ekran saati göstermeye başlamalıdır. Menüyü görüntülemek ve (Saat Ayarla, Dakika Ayarla, Saniye Ayarla, Parlaklığı Ayarla) arasında geçiş yapmak için "B" düğmelerini kullanarak saati ve parlaklığı değiştirebilir ve ayarlamak için "M5" düğmesini kullanabilirsiniz.

Tebrikler! Visuino ile M5Sticks projenizi tamamladınız. Ayrıca bu Instructable için oluşturduğum Visuino projesi ektedir, buradan indirebilirsiniz. Visuino'da indirip açabilirsiniz: