Menu Arduino pada Nokia 5110 Lcd Menggunakan Rotary Encoder

Tentang proyek ini

Teman-teman, selamat datang di tutorial lain! Dalam video ini kita akan mempelajari cara membuat menu kita sendiri untuk layar LCD Nokia 5110 yang populer, agar proyek kita lebih ramah pengguna dan lebih mumpuni. Mari kita mulai!

Ini adalah proyek yang akan kami bangun. Pada tampilan menu sederhana muncul, dan dengan bantuan encoder putar saya dapat menavigasi ke atas, atau ke bawah dan memilih item menu dengan menekan tombol encoder putar. Ketika tombol tengah rotary encoder ditekan, layar lain muncul dan kita dapat mengubah nilai suatu variabel. Jika kita menekan tombol rotary encoder sekali lagi, kita kembali ke layar menu utama. Menu memiliki 6 item, dan kita dapat menggulir menu ke bawah atau ke atas dan item pada tampilan akan berubah sesuai dengan itu. Tonton video terlampir untuk melihat cara kerja menu ini. Tentu saja Anda dapat memodifikasinya untuk membuat menu Anda sendiri yang lebih kompleks jika diinginkan.

Sekarang mari kita lihat bagaimana membangun proyek ini.

Langkah 1:Dapatkan Semua Bagian

Bagian-bagian yang diperlukan untuk membangun proyek ini adalah sebagai berikut:

• Arduino Uno http://educ8s.tv/part/ArduinoUno

• Layar LCD Nokia 5110 http://educ8s.tv/part/NOKIA5110

• Sebuah Rotary Encoder http://educ8s.tv/part/RotaryEncoder

• Breaboard kecil ▶ http://educ8s.tv/part/SmallBreadboard

• Beberapa Kabel ▶ http://educ8s.tv/part/Wires

Biaya proyek sangat rendah, kurang dari $10. Anda dapat menemukan tautan untuk semua bagian yang saya gunakan dalam deskripsi video di bawah ini.

Langkah 2:Layar LCD Nokia 5110

Nokia 5110 adalah tampilan favorit saya untuk Proyek Arduino saya.

Nokia 5110 adalah layar LCD grafis dasar yang awalnya ditujukan sebagai layar ponsel. Ini menggunakan pengontrol PCD8544 yang merupakan pengontrol / driver LCD CMOS daya rendah. Karena itu, tampilan ini memiliki konsumsi daya yang mengesankan. Ini hanya menggunakan 0,4mA saat menyala tetapi lampu latar dinonaktifkan. Menggunakan kurang dari 0,06mA saat dalam mode tidur! Itulah salah satu alasan yang membuat tampilan ini menjadi favorit saya. Antarmuka PCD8544 ke mikrokontroler melalui antarmuka bus serial. Itu membuat tampilan sangat mudah digunakan dengan Arduino. Anda hanya perlu menghubungkan 8 kabel.

Saya telah menyiapkan tutorial terperinci tentang cara menggunakan layar LCD Nokia 5110 dengan Arduino. Saya telah melampirkan video itu dalam tutorial ini, itu akan memberikan informasi yang berguna tentang tampilan, jadi saya mendorong Anda untuk menontonnya dengan cermat. Biaya tampilan adalah sekitar $4.

Anda bisa mendapatkannya di sini:http://educ8s.tv/part/NOKIA5110

Langkah 3:Rotary Encoder

Rotary encoder, juga disebut shaft encoder, adalah perangkat elektro-mekanis yang mengubah posisi sudut atau gerakan poros atau gandar menjadi kode analog atau digital. Rotary encoder digunakan dalam banyak aplikasi yang memerlukan rotasi poros tak terbatas yang presisi—termasuk kontrol industri, robotika, lensa fotografi tujuan khusus, perangkat input komputer (seperti mouse optomekanik dan trackball), rheometer tegangan terkontrol, dan platform radar berputar.

Rotary encoder yang akan kita gunakan dalam proyek ini adalah encoder yang sangat murah. Ini juga memiliki tombol yang tertanam dan untuk membuatnya berfungsi, kita hanya perlu menghubungkan 5 kabel. Saya telah menyiapkan tutorial terperinci tentang cara menggunakan rotary encoder. Anda dapat menemukan video ini terlampir di sini.

Biaya rotary encoder ini sangat rendah. Biayanya sekitar $1,5.

Anda bisa mendapatkannya di sini http://educ8s.tv/part/RotaryEncoder

Langkah 4:Membangun Proyek

Sekarang mari kita hubungkan semua bagian bersama-sama. Sebelum membangun proyek ini, jika Anda belum pernah menggunakan rotary encoder sebelumnya, saya mendorong Anda untuk menonton tutorial yang telah saya siapkan tentang rotary encoder. Ini akan membantu Anda memahami cara kerja rotary encoder dan Anda akan mendapatkan pengalaman dengan mereka. Video ini terlampir di sini.

Saya telah menempatkan tampilan pada papan tempat memotong roti kecil seperti ini. Mari kita sambungkan dulu layarnya. Pin pertama dari tampilan yang di Reset menuju ke pin digital 3 Arduino Uno, pin kedua ke pin digital 4, pin ketiga ke pin digital 5, pin keempat ke digital pin 11 dan pin kelima ke digital. pin 13. Pin selanjutnya adalah Vcc. Kami menghubungkan Vcc ke rel positif papan tempat memotong roti, dan rel positif papan tempat memotong roti ke output 3.3V dari Arduino. Pin selanjutnya adalah Backlight untuk tampilan. Karena kami ingin mengontrolnya melalui perangkat lunak, kami menghubungkannya ke pin digital 7. Pin terakhir adalah GND. Kami menghubungkan GND ke rel negatif papan tempat memotong roti, dan rel negatif papan tempat memotong roti ke Arduino GND.

Sekarang yang harus kita lakukan adalah menghubungkan rotary encoder. Pin pertama adalah GND dan kami menghubungkannya ke rel negatif papan tempat memotong roti. Pin selanjutnya adalah Vcc dan kita sambungkan ke rel positif breadboard. Pin selanjutnya adalah SW dan kita sambungkan ke Pin Analog 2. Pin selanjutnya diberi nama DT dan kita sambungkan ke Pin Analog 1. Terakhir pin CLK terhubung ke Pin Analog 0. Anda dapat menemukan diagram skema proyek ini di deskripsi video di bawah ini.

Sekarang kami siap untuk menghidupkan proyek. Seperti yang Anda lihat, proyek berfungsi dengan baik, dan menu berfungsi seperti yang diharapkan! Bagus, sekarang mari kita lihat perangkat lunak proyek.

Langkah 5:Kode Proyek

Dalam proyek ini kami menggunakan 4 perpustakaan. Kami menggunakan dua perpustakaan untuk tampilan, dan dua untuk rotary encoder.

• Adafruit GFX:https://github.com/adafruit/Adafruit-GFX-Library

• Nokia 5110:https://github.com/adafruit/Adafruit-PCD8544-Nokia-5110-LCD-library

• Perpustakaan Encoder:https://github.com/0xPIT/encoder/tree/arduino

• Perpustakaan TimerOne:https://github.com/PaulStoffregen/TimerOne

Pada awalnya kita akan melihat fungsi drawMenu. Fungsi ini bertanggung jawab untuk menggambar Menu pada tampilan. Fungsi ini dipanggil setiap beberapa milidetik, jadi jika ada perubahan pada menu, fungsi ini bertanggung jawab untuk memperbarui menu di layar.

int menuitem =1;int frame =1;int halaman =1;int lastMenuItem =1; 

Ada juga 3 variabel global yang sangat penting, halaman variabel, item menu variabel dan bingkai variabel. Halaman variabel mengingat layar UI mana yang ditampilkan di layar. Jadi, jika variabel halaman adalah 1, kita berada di layar UI utama, dan jika variabelnya adalah 2, kita berada di layar UI sekunder tempat kita menetapkan nilai pada variabel. Item menu mengingat item menu yang dipilih. Jadi, jika nilainya 1, item menu pertama dipilih, jadi fungsi drawMenu harus menggambar item menu ini sebagai hitam dengan huruf putih. Jika item menu adalah 2 item menu kedua dipilih dan seterusnya. Variabel frame, mengingat bagian menu mana yang ditampilkan di layar. Karena menu yang kami buat berisi 6 item dan kami hanya dapat menampilkan 3 item sekaligus, kami perlu mengetahui item mana yang ditampilkan di layar. Variabel frame, memberi tahu kita hal ini dengan tepat. Jika variabel frame memiliki nilai 1, kami menampilkan tiga item menu pertama, jika 2, kami menampilkan item 2,3,4 dan seterusnya.

Saya mencoba membuat kode semudah mungkin untuk dimodifikasi, jadi saya telah membuat beberapa variabel global yang menyimpan nama untuk item menu. Dengan cara ini, Anda dapat membuat menu sendiri dengan mudah tanpa harus mencari kode.

String menuItem1 ="Kontras";String menuItem2 ="Volume";String menuItem3 ="Bahasa";String menuItem4 ="Kesulitan";String menuItem5 ="Light:ON";String menuItem6 ="Reset"; boolean backlight =true;int contrast=60;int volume =50;Bahasa string[3] ={ "EN", "ES", "EL" };int selectedLanguage =0;Kesulitan string[2] ={ "EASY" , "KERAS" };int selectedDifficulty =0; 

Pada awalnya kita menginisialisasi semua variabel global yang diperlukan dalam kode. Selanjutnya kita menginisialisasi tampilan. Pada fungsi loop, pada awalnya kita memanggil fungsi drawMenu untuk menggambar menu di layar. Kemudian kami membaca nilai dari encoder Rotary dan memeriksa apakah tombol ditekan. Misalnya, jika kita berada di layar UI utama dan item menu pertama dipilih, jika nilai dari rotary encoder meningkat, variabel item menu meningkat dan pada loop berikutnya fungsi drawMenu akan menggambar item menu kedua seperti yang dipilih. Jika sekarang kita menekan tombol rotary encoder, kita menavigasi ke halaman kedua, di mana kita mengatur nilai variabel. Sekali lagi dengan menggunakan rotary encoder kita dapat menambah atau mengurangi nilai variabel. Jika kita menekan tombol, kita menavigasi kembali ke halaman menu utama, dan variabel halaman berkurang.

Itulah ide dasar di balik menu ini. Kami mengikuti prosedur yang sama untuk semua item menu dan halaman. Kodenya rumit, panjangnya lebih dari 400 baris. Tampaknya rumit tetapi jika Anda mencobanya sendiri, Anda akan lebih mudah memahaminya dan Anda akan dapat mengubahnya, mengembangkannya, dan menggunakannya dalam proyek Anda sendiri. Seperti biasa Anda dapat menemukan kode terlampir di sini.

Langkah 6:Menguji Proyek

Jika kita memuat kode, kita dapat melihat bahwa proyek berfungsi seperti yang diharapkan. Kita dapat menavigasi menu ke atas dan ke bawah menggunakan poros dan kita dapat memilih item menu apa pun dengan menekan tombol rotary encoder. Keren banget!

Sekarang setelah kita mengetahui cara membuat menu untuk tampilan LCD Nokia 5110, kita dapat menambahkan lebih banyak fitur ke proyek kita dan membuatnya lebih ramah pengguna. Menu sederhana yang kami buat hari ini dapat ditingkatkan. Kita bisa menggunakan interupsi alih-alih memeriksa status tombol sepanjang waktu. Dengan cara ini kita dapat mengurangi konsumsi daya proyek dan membuat kode lebih bersih. Saya akan segera menyiapkan video tentang interupsi, jadi pantau terus. Saya akan senang mendengar pendapat Anda tentang proyek menu ini. Apakah Anda merasa berguna dan apakah Anda berencana untuk menggunakan menu di salah satu proyek Anda. Silakan kirim pemikiran dan ide Anda di bawah ini, terima kasih!

String menuItem1 ="Kontras";String menuItem2 ="Volume";String menuItem3 ="Bahasa";String menuItem4 ="Kesulitan";String menuItem5 ="Light:ON";String menuItem6 ="Reset";boolean backlight =true;int contrast=60;int volume =50;Bahasa string[3] ={ "EN", "ES", "EL" };int selectedLanguage =0;Kesulitan string[2] ={ "EASY", "HARD " };int selectedDifficulty =0;