מסגרת צילום OSD מודעת פנים: 11 שלבים (עם תמונות)

2024 מְחַבֵּר: John Day | [email protected]. שונה לאחרונה: 2024-01-30 09:12

מדריך זה מראה כיצד להפוך מסגרת צילום עם תצוגת מסך על המסך (OSD).

OSD יכול להציג זמן, מזג אוויר או מידע אינטרנט אחר שאתה רוצה.

שלב 1: מדוע מסגרת תמונות OSD?

יש לי 2 פרוייקטים של שעון תמונות ב- Instructables לפני:

www.instructables.com/id/ESP32-Photo-Clock…

www.instructables.com/id/Arduino-BiJin-ToK…

שניהם שולפים מדי דקות תמונה עם יופי ולוח זמן מהאינטרנט ומציגים על LCD.

להציג יופי זה טוב, אבל כולם זרים בשבילי. מה דעתך להשתמש בתמונות מועדפות אישיות ולהוסיף עליהן זמן שוטף ומידע מיידי נוסף?

פרויקט זה בוחן כיצד לבצע אותו.

שלב 2: למה מודעים לפנים?

בואו לבדוק כיצד להוסיף מידע מיידי OSD לתמונה תחילה:

1. בחר תמונה באקראי מתוך תיקיה מסוימת
2. אחזור זמן
3. אחזור מידע מיידי מהאינטרנט
4. לצייר זמן ומידע מיידי על התמונה

שלב 1-3 הוא ישר קדימה; שלב 4 גם נראה פשוט, אבל לקבוע היכן לצייר את הטקסט לא כל כך קל.

אם גודל הטקסט קטן מדי, קשה לקרוא אותו במרחק סביר; אם גודל הטקסט גדול מדי, סביר להניח שהוא מכסה את אובייקטים של הצילום. במיוחד אם מדובר בתצלום דיוקן, עדיף טקסט המכוסה את הפנים.

מכיוון שמיקום הפנים של כל תמונה אינו זהה, כדי להימנע מפנים מכוסות ב- OSD אנו צריכים קודם כל תהליך זיהוי פנים. לאחר מכן נוכל למצוא אזור ללא פנים לצייר את הטקסט.

שלב 3: עיצוב דו-שכבתי

תהליך זיהוי הפנים דורש מעט עיבוד, לעומת זאת, מסגרת התמונה יכולה להיות בעלת משקל קל מאוד. אז חילקתי אותו לשתי שכבות:

שרת

מנוע הצילום המודע לפנים הוא שרת אפליקציות Node.js. עבור כל בקשת HTTP, היא:

1. בחר תמונה מתוך תיקיית התמונות באופן אקראי
2. זיהוי פנים
3. לא לקבוע פנים או לפחות פנים פנים
4. בינתיים, אחזור מזג אוויר או מידע מיידי שימושי אחר מהאינטרנט בכל תקופה מסוימת
5. צייר זמן ומידע מיידי על התמונה
6. החזר את התמונה עם OSD בפורמט JPEG כתגובת

לָקוּחַ

הלקוח יכול להיות דפדפן אינטרנט, יישומון או מכשיר IoT.

לְמָשָׁל. מתאם ESP32 עם מסך בגודל 2-4 אינץ 'מתאים מאוד להצבה על שולחן העבודה כמסגרת צילום זעירה.

שלב 4: הגדרת אפשרות שרת תמונות 1: תמונת Docker

מטעמי נוחות, בניתי מראש תמונת Docker עבור שרת האפליקציות OSD Node.js של התמונה המודעת לפנים.

במקרה שעדיין לא הגדרת Docker, פעל על פי מדריך תחילת העבודה של Docker:

www.docker.com/get-started

לאחר מכן הפעל את הפקודה הבאה: (החלף/נתיב/אל/תצלום לנתיב התמונות שלך)

docker run -p 8080: 8080 -v/path/to/photo:/app/photo moononournation/face-aware-photo-osd: 1.0.1

בדוק את זה על ידי עיון בכתובת https:// localhost: 8080/

אתה עשוי לגלות שזמן ההצגה אינו נמצא באזור הזמן שלך:

docker run -p 8080: 8080 -e TZ = Asia/Hong_Kong -v/path/to/photo:/app/photo moononournation/face -מודעות -photo -osd: 1.0.1

אם אתה גר בהונג קונג כמוני, תוכל להוסיף מידע על מזג האוויר בהונג קונג:

docker run -p 8080: 8080 -e TZ = Asia/Hong_Kong -e OSD = HK_Weather -v/path/to/photo:/app/photo moononournation/face -מודעות -photo -osd: 1.0.1

אם ברצונך לפתח מידע OSD משלך:

mkdir -p ~/git

cd ~/git git שיבוט https://github.com/moononournation/face-aware-photo-osd.git docker run -it -p 8080: 8080 -e TZ = Asia/Hong_Kong -e OSD = HK_Weather -e DEBUG = Y -v/path/to/photo:/app/photo -v ~/git/face-aware-photo-osd/app.js: /app/app.js moononournation/face-מודעות-photo-osd: 1.0. 1

שנה את הפונקציה update_osd () ב- app.js כך שתתאם אישית מידע OSD משלך. לאחר הפיתוח, פשוט הסר את סביבת DEBUG = Y מהפקודה docker.

שלב 5: הגדרת שרת צילום אפשרות 2: בנה ממקור

אם אתה מכיר את Node.js, תוכל לבנות את שרת האפליקציות מהמקור.

קבל את המקור:

שיבוט git

התקן חבילות:

cd פנים-מודע-צילום-אוסד

התקנת npm

צור תיקיית תמונות והעתק תמונות משלך לתיקייה.

הפעל שרת אפליקציות:

צומת app.js

שלב 6: אפשרות לקוח 1: דפדפן אינטרנט

פשוט דפדף לכתובת https:// localhost: 8080/

הדף נטען באופן אוטומטי בכל גודל תמונה מתאימה לדף.

נ.ב. אם אתה גולש ממחשב אחר שאינו מפעיל את שרת האפליקציות, זכור שנה את localhost לשם המארח של שרת היישום או כתובת ה- IP.

שלב 7: אפשרות לקוח 2: ESP32 + LCD

לקוח מסגרת תמונות יכול להיות פשוט כמו לוח ESP32 dev ו- LCD.

להלן החומרה הנדרשת:

לוח Dev ESP32

כל לוח ESP32 dev צריך להיות בסדר, הפעם אני משתמש בלוח בשם MH-ET LIVE.

תצוגת אל סי די

כל מסך נתמך של Arduino_GFX, ייתכן שתמצא תצוגה נתמכת כעת ב- GitHub readme:

github.com/moononournation/Arduino_GFX

כבל מגשר

כמה חוטי מגשר, תלוי בלוח ה- dev ובפריסת סיכות ה- LCD. ברוב המקרים מספיק 6-9 חוטי מגשר נקבה לנקבה.

מעמד LCD

תמיכה מסוימת עוזרת ל LCD לעמוד ישר, הפעם אני משתמש במעמד למחזיק כרטיסים.

שלב 8: ESP32 + מכלול LCD

עדיף ESP32 עם כותרת סיכה בצד העליון. אם כותרת הסיכה בצד התחתון, פשוט לשים את הלוח הפוך;>

חבר את ESP32 ו- LCD עם חוטי מגשר ולאחר מכן התאם אותו למעמד.

להלן סיכום החיבור לדוגמה:

ESP32 -> LCD

Vcc -> Vcc GND -> GND GPIO 5 -> CS GPIO 27 -> DC (אם קיים) GPIO 33 -> RST GPIO 18 -> SCK GPIO 19 -> MISO (אופציונלי) GPIO 22 -> LED (אם קיים) GPIO 23 -> MOSI / SDA

שלב 9: תוכנת ESP32 + LCD

Arduino IDE

הורד והתקן את Arduino IDE אם עדיין אינך עושה זאת:

www.arduino.cc/en/main/software

תמיכה ב- ESP32

עקוב אחר הוראות ההתקנה כדי להוסיף תמיכה ב- ESP32 אם עדיין אינך עושה זאת:

github.com/espressif/arduino-esp32

ספריית Arduino_GFX

הורד את ספריות Arduino_GFX האחרונות: (לחץ על "שיבוט או הורד" -> "הורד ZIP")

github.com/moononournation/Arduino_GFX

ייבוא ספריות ב- Arduino IDE. (תפריט "סקיצה" של Arduino IDE -> "כלול ספרייה" -> "הוסף ספריית ZIP" -> בחר קובץ ZIP שהורדת)

הידור והעלאה

1. פתח את Arduino IDE
2. פתח קוד לדוגמה של ESP32PhotoFrame ("קובץ" -> "דוגמה" -> "ספריית GFX עבור Arduino" -> "WiFiPhotoFrame")
3. מלא את הגדרות ה- WiFi AP שלך ב- SSID_NAME ו- SSID_PASSWORD
4. החלף את שם מארח השרת או ה- IP והיציאה שלך ב- HTTP_HOST ו-
5. לחץ על כפתור "העלאה" של Arduino IDE
6. אם אתה מוצא שהכיוון אינו נכון, שנה את ערך "הסיבוב" (0-3) בקוד המחלקה החדש

שלב 10: תהנה מתמונה

הגיע הזמן לשים את מסגרת התמונות של IoT על שולחן העבודה שלך וליהנות!

שלב 11: מה הלאה?

• הוסף מידע מיידי משלך
• כוונן את גודל צילום המקור לדיוק זיהוי פנים טוב יותר
• משימה אוטומטית להכניס את התמונות האחרונות לתיקיית תמונות השרת
• צלם עוד תמונות;>