ساعة M5StickC ذات المظهر الرائع مع قائمة والتحكم في السطوع: 8 خطوات

2024 مؤلف: John Day | [email protected]. آخر تعديل: 2024-01-30 07:36

في هذا البرنامج التعليمي سوف نتعلم كيفية برمجة ESP32 M5Stack StickC مع Arduino IDE و Visuino لعرض الوقت على شاشة LCD وكذلك ضبط الوقت والسطوع باستخدام القائمة وأزرار StickC.

شاهد فيديو توضيحي.

الخطوة 1: ما سوف تحتاجه

M5StickC ESP32: يمكنك الحصول عليه من هنا

برنامج Visuino: قم بتنزيل Visuino

ملاحظة: تحقق من هذا البرنامج التعليمي هنا حول كيفية تثبيت لوحة StickC ESP32

الخطوة 2: ابدأ Visuino ، وحدد نوع اللوحة M5 Stack Stick C

ابدأ Visuino كما هو موضح في الصورة الأولى ، انقر فوق الزر "أدوات" في مكون Arduino (الصورة 1) في Visuino عندما يظهر مربع الحوار ، حدد "M5 Stack Stick C" كما هو موضح في الصورة 2

الخطوة 3: في Visuino اضبط لوحة StickC

1. انقر على لوحة "M5 Stack Stick C" لتحديدها
2. في نافذة "الخصائص" حدد "الوحدات النمطية" وانقر على "+" للتوسيع ،
3. حدد "عرض ST7735" وانقر فوق "+" لتوسيعها ،
4. اضبط "الاتجاه" على "goRight"
5. تعيين "لون الخلفية" على "ClBlack"
6. حدد "العناصر" وانقر على الزر الأزرق بثلاث نقاط …
7. سيظهر مربع حوار العناصر
8. في مربع حوار العناصر ، اسحب 2X "حقل نص" من الجانب الأيمن إلى اليسار
9. انقر على "حقل النص 1" في الجانب الأيسر لتحديده ، ثم في "نافذة الخصائص" انقر على "اللون" واضبطه على "aclOrange" وانقر على "لون التعبئة" واضبطه على "aclBlack" (أنت يمكن أن تلعب بالألوان إذا كنت تريد) - أيضًا في خصائص مجموعة النوافذ X: 10 و Y: 20 هذا هو المكان الذي تريد عرض الوقت فيه على حجم مجموعة LCD: 3 (هذا هو حجم خط الوقت)
10. انقر على "حقل النص 2" في الجانب الأيسر لتحديده ، ثم في "نافذة الخصائص" ، انقر على "اللون" واضبطه على "أكلاكوا" وانقر على "لون التعبئة" واضبطه على "آكل بلاك"

(يمكنك اللعب بالألوان إذا كنت تريد) - اضبط "القيمة الأولية" على: ضبط HOUR

-أيضا في خصائص windows مجموعة X: 10 و Y: 2 هذا هو المكان الذي تريد عرض القائمة على شاشة LCD - حجم المجموعة: 1 (هذا هو حجم خط القائمة)

أغلق نافذة العناصر

1. انقر على لوحة "M5 Stack Stick C" لتحديدها
2. في نافذة "الخصائص" حدد "الوحدات النمطية" وانقر على "+" للتوسيع ،
3. حدد "Display Real Time Alarm Clock (RTC)" وانقر على "+" لتوسيعها ،
4. حدد "العناصر" وانقر على الزر الأزرق بثلاث نقاط …
5. في مربع حوار العناصر ، اسحب "Set Hour" من الجانب الأيمن إلى اليسار ، وفي نافذة الخصائص ، اضبط "Add Value" على: True و "Value" إلى: 1
6. في مربع حوار العناصر ، اسحب "تعيين دقيقة" من الجانب الأيمن إلى اليسار ، وفي نافذة الخصائص ، اضبط "إضافة قيمة" على: صحيح و "القيمة" إلى: 1
7. في مربع حوار العناصر ، اسحب "Set Second" من الجانب الأيمن إلى اليسار ، وفي نافذة الخصائص ، اضبط "Add Value" على: True و "Value" إلى: 1

أغلق نافذة العناصر

الخطوة 4: في Visuino أضف مكونات

1. إضافة 2x "زر Debounce"
2. أضف مكون "زر التكرار التلقائي"
3. أضف مكون "صفيف النص"
4. إضافة مكون "مصفوفة تناظرية"
5. إضافة 2x "عداد" مكون
6. أضف مكون "Clock Demux (تبديل قنوات الإخراج المتعدد)"
7. إضافة مكون "فك (تقسيم) التاريخ / الوقت"
8. إضافة مكون "FormattedText1"

الخطوة 5: في مكونات مجموعة Visuino

1. حدد مكون "FormattedText1" وتحت نافذة "خصائص" ، قم بتعيين "نص" إلى:٪ 0:٪ 1:٪ 2
2. انقر نقرًا مزدوجًا فوق مكون "FormattedText1" وفي مربع حوار العناصر اسحب 3x "عنصر النص" إلى اليسار
3. حدد "TextElement1" على الجانب الأيسر وفي نافذة الخصائص اضبط "Fill Character" على: 0 و "Length" إلى: 2
4. حدد "TextElement2" على الجانب الأيسر وفي نافذة الخصائص اضبط "Fill Character" على: 0 و "Length" إلى: 2
5. حدد "TextElement3" على الجانب الأيسر وفي نافذة الخصائص اضبط "Fill Character" على: 0 و "Length" إلى: 2
6. حدد مكون "ClockDemmux1" وفي نافذة الخصائص اضبط "Output Pins" على: 5
7. حدد مكون "Counter1" وفي نافذة الخصائص قم بتوسيع "Max" وقم بتعيين "القيمة" إلى: 4
8. حدد مكون "Counter1" وفي نافذة الخصائص قم بتوسيع "Min" وقم بتعيين "القيمة" إلى: 0
9. حدد مكون "Counter2" وفي نافذة الخصائص قم بتوسيع "Max" وقم بتعيين "القيمة" إلى: 6
10. حدد مكون "Counter2" وفي نافذة الخصائص قم بتوسيع "Min" وقم بتعيين "القيمة" إلى: 0 إنشاء القائمة:
11. حدد مكون "Array1" (مصفوفة نصية) وانقر فوقه نقرًا مزدوجًا. - في نافذة العناصر ، اسحب "القيمة" 4X إلى الجانب الأيسر - على الجانب الأيسر حدد "العنصر [1]" وفي نافذة الخصائص ، حدد "القيمة" إلى: SET HOURS-on the left side حدد "Item [2]" وفي نافذة الخصائص ، اضبط "القيمة" على: SET MINUTES - على الجانب الأيسر حدد "Item [3]" وفي نافذة الخصائص اضبط "القيمة" إلى: SET SECONDS-On the left side حدد "Item [4]" وفي نافذة الخصائص ، اضبط القيمة "Value" على: SET BRIGHTNESS أغلق نافذة Elements. SETTING THE VALUES FOR BRIGHTNESS:

12. حدد مكون "Array2" (مصفوفة تناظرية) وانقر فوقه نقرًا مزدوجًا. - في نافذة العناصر ، اسحب 6X "قيمة" إلى الجانب الأيسر - على الجانب الأيسر حدد "عنصر [0]" وفي نافذة الخصائص ، حدد "القيمة" إلى 1

    -على الجانب الأيسر حدد "عنصر [1]" وفي نافذة الخصائص اضبط "القيمة" على: 0.9

    - على الجانب الأيسر حدد "العنصر [2]" وفي نافذة الخصائص ، اضبط القيمة "القيمة" على: 0.8 - على الجانب الأيسر حدد "العنصر [3]" وفي نافذة الخصائص ، اضبط "القيمة" على: 0.7-تشغيل في الجانب الأيسر حدد "عنصر [4]" وفي نافذة الخصائص ، قم بتعيين "القيمة" على: 0.6 - في الجانب الأيسر حدد "عنصر [5]" وفي نافذة الخصائص ، قم بتعيين "القيمة" على: 0.55

الخطوة 6: في مكونات Visuino Connect

1. قم بتوصيل "M5 Stack Stick C" pin A (M5) بـ "Button2" pin [In]
2. قم بتوصيل دبوس "M5 Stack Stick C" [B] بدبوس "Button1" [في]
3. ربط "Button2" pin [Out] بـ "RepeatButton1" pin [In]
4. ربط "RepeatButton1" pin [Out] بدبوس "ClockDemmux1" [In]
5. ربط "Button1" pin [Out] بـ "Counter1" pin [In]
6. قم بتوصيل "M5 Stack Stick C"> "Real Time Alarm Clock (RTC)" pin [Out] بـ "DecodeDateTime1" pin [In]
7. قم بتوصيل دبوس "DecodeDateTime1" [ساعة] بـ "FormattedText1"> دبوس "TextElement1" [In]
8. قم بتوصيل دبوس "DecodeDateTime1" [دقيقة] بـ "FormattedText1"> دبوس "TextElement2" [في]
9. قم بتوصيل دبوس "DecodeDateTime1" [الثاني] بـ "FormattedText1"> دبوس "TextElement3" [In]
10. قم بتوصيل دبوس "FormattedText1" [مخرج] بلوحة "M5 Stack Stick C"> "Display ST7735"> دبوس "Text Field1" [In]
11. قم بتوصيل دبوس "Counter1" [مخرج] بدبوس "ClockDemmux1" [حدد] ودبوس "Array1" [فهرس]
12. ربط "Counter2" pin [Out] بطرف "Array2" [الفهرس]
13. قم بتوصيل دبوس "Array1" [مخرج] بلوحة "M5 Stack Stick C"> "Display ST7735"> دبوس "Text Field2" [In]
14. قم بتوصيل دبوس "Array2" [مخرج] بلوحة "M5 Stack Stick C"> "Display ST7735"> دبوس [السطوع]
15. قم بتوصيل دبوس "ClockDemmux1" [1] بلوحة "M5 Stack Stick C"> "Real Time Alarm Clock (RTC)"> دبوس Set Hour1 [الساعة]
16. قم بتوصيل دبوس "ClockDemmux1" [2] بلوحة "M5 Stack Stick C"> "Real Time Alarm Clock (RTC)"> دبوس Set Minute1 [الساعة]
17. قم بتوصيل دبوس "ClockDemmux1" [3] بلوحة "M5 Stack Stick C"> "Real Time Alarm Clock (RTC)"> دبوس "Set Second1" [الساعة]
18. قم بتوصيل دبوس "ClockDemmux1" [4] بدبوس "Counter2" [في]

الخطوة 7: إنشاء ، ترجمة ، وتحميل كود اردوينو

في Visuino ، انقر في الجزء السفلي على علامة التبويب "إنشاء" ، وتأكد من تحديد المنفذ الصحيح ، ثم انقر فوق الزر "تجميع / إنشاء وتحميل".

الخطوة 8: العب

إذا قمت بتشغيل وحدة M5Sticks ، يجب أن تبدأ الشاشة في إظهار الوقت. يمكنك تغيير الوقت والسطوع باستخدام أزرار "B" لعرض القائمة والتبديل بين (Set Hours، Set Minutes، Set Seconds، Set Brightness) واستخدام زر "M5" لإعدادها.

تهانينا! لقد أكملت مشروع M5Sticks الخاص بك باستخدام Visuino. مرفق أيضًا مشروع Visuino ، الذي قمت بإنشائه لهذا Instructable ، يمكنك تنزيله هنا. يمكنك تنزيله وفتحه في Visuino: