DIY Cara Membuat Jam Tangan Keren - StickC - Mudah Dilakukan: 8 Langkah
DIY Cara Membuat Jam Tangan Keren - StickC - Mudah Dilakukan: 8 Langkah

Daftar Isi:

Anonim

Dalam tutorial ini kita akan belajar bagaimana memprogram ESP32 M5Stack StickC dengan Arduino IDE dan Visuino untuk Menampilkan waktu di LCD dan juga mengatur waktu menggunakan tombol StickC.

Langkah 1: Apa yang Anda Butuhkan

Apa yang Anda Butuhkan
Apa yang Anda Butuhkan
Apa yang Anda Butuhkan
Apa yang Anda Butuhkan

M5StickC ESP32: Anda bisa mendapatkannya di sini

Program Visuino: Unduh Visuino

Catatan: Lihat tutorial ini di sini tentang cara Memasang papan StickC ESP32

Langkah 2: Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C

Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C
Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C
Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C
Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C
Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C
Mulai Visuino, dan Pilih Jenis Papan M5 Stack Stick C

Jalankan Visuino seperti pada gambar pertama Klik tombol "Tools" pada komponen Arduino (Gambar 1) di Visuino Ketika muncul dialog, pilih "M5 Stack Stick C" seperti yang ditunjukkan pada Gambar 2

Langkah 3: Di Visuino Tambahkan Komponen

Di Visuino Tambahkan Komponen
Di Visuino Tambahkan Komponen
Di Visuino Tambahkan Komponen
Di Visuino Tambahkan Komponen
Di Visuino Tambahkan Komponen
Di Visuino Tambahkan Komponen
  1. Klik pada Papan "M5 Stack Stick C" untuk memilihnya
  2. Di jendela "Properties" pilih "Modules" dan klik "+" untuk Melebarkan,
  3. Pilih "Tampilan ST7735" dan klik "+" untuk memperluasnya,
  4. Setel "Orientasi" ke "goRight"
  5. Setel "Warna Latar Belakang" ke "ClBlack"
  6. Pilih "Elemen" dan klik tombol biru dengan 3 titik …
  7. Dialog Elemen akan ditampilkan
  8. Dalam Dialog Elemen, seret "Bidang Teks" dari sisi kanan ke kiri

  9. Klik pada "Bidang Teks1" di sisi kiri untuk memilihnya, lalu di "jendela Properti" klik "Warna" dan atur ke "aclWhite" dan klik "Isi Warna" dan atur ke "aclBlack" (Anda bisa bermain dengan warna jika Anda mau)

    -juga di properti windows set X:10 dan Y:20 ini adalah di mana Anda ingin menampilkan waktu pada LCD -set size:3 (ini adalah ukuran font waktu)Tutup jendela elemen

  10. Tambahkan komponen "Decode (Split) Date/Time"
  11. Tambahkan komponen "Teks yang diformat"

Langkah 4: Dalam Komponen Set Visuino

Dalam Komponen Set Visuino
Dalam Komponen Set Visuino
Dalam Komponen Set Visuino
Dalam Komponen Set Visuino
Dalam Komponen Set Visuino
Dalam Komponen Set Visuino
  1. Pilih komponen "FormattedTxt1" dan di bawah jendela "Properties" setel "Teks" ke: %0:%1:%2
  2. Klik dua kali pada komponen "FormattedText1" dan dalam dialog Elemen seret 3x "Elemen Teks" ke kiri
  3. Pilih papan "M5 Stack Stick C" dan di jendela "Properties" pilih "Modules"> "Real Time Alarm Clock(RTC)"> "Elements"
  4. Klik tombol biru dengan 3 titik dan dalam dialog Elemen seret "Set Hour", "Set Minute" dan "Set Second" ke sisi kiri
  5. Pilih di sebelah kiri elemen "Set Hour1" dan di bawah jendela "Properties" atur "Add Value" ke "True" dan "Value" ke "1"
  6. Pilih di sebelah kiri elemen "Set Minute1" dan di bawah jendela "Properties" setel "Add Value" ke "True" dan "Value" ke "1"
  7. Pilih di sebelah kiri elemen "Set Second1" dan di bawah jendela "Properties" set "Add Value" ke "True" dan "Value" ke "1"

Penjelasan:

"Nilai" berarti berapa banyak yang ingin kita tambahkan dengan setiap klik tombol ke waktu yang ada (baik jam, menit, atau detik) "Tambah Nilai" berarti kita ingin menambahkan nilai ke waktu yang ada

Langkah 5: Di Komponen Visuino Connect

Dalam Komponen Visuino Connect
Dalam Komponen Visuino Connect
Dalam Komponen Visuino Connect
Dalam Komponen Visuino Connect
  1. Hubungkan "M5 Stack Stick C"> Jam Alarm Waktu Nyata (RTC) > Pin [Keluar] ke pin komponen "DecodeDateTime1"[Masuk]
  2. Hubungkan pin komponen "DecodeDateTime1" [Hour] ke komponen "FormattedText1" pin "TextElement1" [Dalam]
  3. Hubungkan pin komponen "DecodeDateTime1" [Menit] ke komponen "FormattedText1" pin "TextElement2" [Dalam]
  4. Hubungkan pin komponen "DecodeDateTime1" [Second] ke "FormattedText1" komponen "TextElement3" pin[In]
  5. Hubungkan pin komponen "FormattedText1" [Keluar] ke papan "M5 Stack Stick C" papan "Tampilan ST7735">"Bidang Teks1" pin [Masuk]
  6. Hubungkan "M5 Stack Stick C"> Tombol "A(M5)" ke "M5 Stack Stick C"> Jam Alarm Waktu Nyata (RTC) > Pin "Atur Hour1" [Jam]
  7. Hubungkan "M5 Stack Stick C"> Tombol "B" ke "M5 Stack Stick C"> Jam Alarm Waktu Nyata (RTC) > Pin "Set Minute1" [Jam]

Langkah 6: Hasilkan, Kompilasi, dan Unggah Kode Arduino

Hasilkan, Kompilasi, dan Unggah Kode Arduino
Hasilkan, Kompilasi, dan Unggah Kode Arduino

  1. Di Visuino, di bagian bawah klik pada Tab "Build", pastikan port yang benar dipilih, lalu klik tombol "Compile/Build and Upload".

Langkah 7: Mainkan

Jika Anda menyalakan modul M5Sticks, layar akan mulai menunjukkan waktu. Anda dapat mengubah waktu menggunakan tombol "M5" untuk Jam dan "B" untuk Menit

Selamat! Anda telah menyelesaikan proyek M5Sticks Anda dengan Visuino. Juga terlampir adalah proyek Visuino, yang saya buat untuk Instruksi ini, Anda dapat mengunduhnya di sini.

Anda dapat mengunduh dan membukanya di Visuino:

Langkah 8: Dalam Tutorial Selanjutnya

Dalam tutorial berikutnya saya akan menunjukkan cara membuat jam tangan Keren di mana Anda dapat mengatur waktu (jam, menit dan detik) menggunakan tombol StickC dan membuat menu sederhana! Nantikan dan lihat tutorial saya yang lain di sini.