التحكم بالروبوت عبر صفحة الويب

في هذا المشروع، سنتعلم كيفية التحكم بالراسبيري باي من خلال واجهة الويب. وهذا سوف يسمح لك للتحكم بالمحركات والإضاءة وغيرها من القطع الإلكترونية عبر شبكة الإنترنت. سنقوم خلال هذا المشروع بالتحكم والسيطرة على الروبوت عن طريق الويب.

web-controlled-robot

الأدوات المستخدمة :

4WD Robot Chassis kit

L298 H bridge Module

 كاميرا للراسبري باي (raspberry pi camera module) أو USB webcam

 اسلاك توصيل أنثى/أنثى  (Jumper Wires Female/Female)

 اسلاك توصيل أنثى/ذكر (Jumper Wires Female/male)

 راسبيري باي (Raspberry Pi 3 Model B)

 

ما هو الروبوت ؟

الروبوت هو جهاز كهروميكانيكي قادر على التفاعل بطرية أو بأخرى مع بيئته، و اتخاذ قرارات مستقلة أو إجراءات من أجل تحقيق مهمة محددة.
يتكون الروبوت من العناصر التالية:
1- الهيكل.
2- المشغل الميكانيكي .
3- وحدة التحكم.
4-المدخلات/ الحساسات.
5- امدادات الطاقة.
في الخطوات التالية سنذكر بعض العناصر المذكورة اعلاه، بحث يمكن أن نفهمها بسهولة.

الهيكل (Structure / Chassis) :

smartphone-controlled-arduino-robot

يتألف الهيكل من المكونات الفزيائية. الروبوت يتكون من مكون او اكثر من المكونات الفزيائية التي تتحرك لتنفيذ مهام معينة. وفي حالتنا هيكل السيارة و العجلات تمثل هيكل الروبوت

المشغل الميكانيكي Actuator :

smartphone-controlled-arduino-robot

المحرك هو جهاز يقوم بتحويل الطاقة (في مجال الروبوت، تكون الطاقة الكهربائية) الى طاقة حركية. تنتج معظم المحركات إما الحركة الدورانية أو الخطية.
في حالتنا المحرك هو(DC Gear motor)  وهو بالاساس عبارة عن محرك  DC مركب مع علبة تروس (gear) تعمل على تقليل سرعة المحرك و زيادة عزم الدورات .

إعداد أطراف المحركات :

قطع اربع قطع من الأسلاك (الحمراء و السوداء) مع طول حوالي 5-6 انش. قم بتجريد السلك من العازل في كل نهاية ، ثم قم بلحم الأسلاك على المحركات.

smartphone-controlled-arduino-robot

يمكنك التحقق من قطبية المحركات من خلال توصيلها إلى بطارية. اذا كانت تدور في الاتجاه إلى الأمام (السلك الاحمر مع القطب الموجب و الأسود مع القطب السالب) هذا يدل على ان التوصيل تم بشكل صحيح.

تركيب المحرك :

smartphone-controlled-arduino-robot

لاحظ أن الأسلاك على كل محرك تشير الى إتجاه مركز الهيكل.

smartphone-controlled-arduino-robot

قم بضم اثنان من الأسلاك الحمراء و اثنان من الاسلاك السوداء معا على كل جانب من جوانب الهيكل. بعد الانضمام، سيكون لديك اثنان من النهايات على الجانب الايمن و اثنان على الجانب الأيسر.

تثبيت السقف العلوي:

بعد تركيب الأربع محركات في الطابق السفلي، قم بتركيب السقف العلوي. ثم قم بسحب نهايات الاسلاك نحو السطح العلوي.

smartphone-controlled-arduino-robot

هناك حاجة إلى المتحكم لتحريك الروبوت من مكان إلى أخر. المتحكم له القدرة على تنفيذ برنامج و يكون مسؤولا عن جميع العمليات الحسابية، واتخاذ القرارات، و الاتصال . في هذا المشروع سيتم استخدام متحكم الراسبيري باي  كـوحدة تحكم.

لا يمكن توصيل المحركات مباشرة مع الراسبيري باي، لأن المحركات تحتاج تيار عالي لا يستطيع الراسبيري باي إعطاءه. لهذا السبب سيتم استخدام Dual H-bridge كدائرة بين الراسبيري باي والمحركات.

 

 L298  H Bridge Module

smartphone-controlled-arduino-robot

H-Bridge، يقوم بتحريك محرك الـ DC بإتجاه الامام و الخلف. وهو يتكون من اربع مفاتيح الكترونية S1,S2,S3,S4  (Transistors / MOSFETS / IGBT).

smartphone-controlled-arduino-robot

الية العمل: انظر للصورة اعلاه لفهم ألية العمل للـ H-Bridge . المفاتيح في نفس الجهة إما (S1,S2) أو  (S3,S4)لا يتم إغلاقهم بنفس الوقت , سيتم حدوث ماس كهربائي .
H-bridge توفر لك دائرة متكاملة، أو يمكنك أن تقوم ببناء الدائرة بنفسك عن طريق إستخدام اربع Transistor او MOSFETs. في هذا المشروع سيتم استخدام  L298 H-bridge Module الذي يمكن من خلاله التحكم في سرعة واتجاه المحركات.

وصف مداخل و مخراج الـ L298H-bridge Module : 

smartphone-controlled-arduino-robot

توصيل جميع القطع الإلكترونية :

أولا: نقوم بتوصيل الأسلاك ذات اللون الأحمر معا والأسلاك ذات اللون الأسود معا لكل من الجهة اليمنى واليسرى.

web-controlled-robot

اتبع الجداول التالية ليتم توصيل باقي القطع :

توصيل المحركات :
L298H-bridge أسلاك المحركات
OUT  1 الأسلاك ذات اللون الأسود على جهة اليسار (-)
OUT 2 الأسلاك ذات اللون الأحمر على جهة اليسار (+)
OUT 3 الأسلاك ذات اللون الأسود على جهة اليمين (-)
OUT 4 الأسلاك ذات اللون الأحمر على جهة اليمين (+)
توصيل الطاقة مع قطعة L298H-bridge :
L298H-bridge البطاريات
12 V السلك ذو اللون الأحمر للبطارية (+)
GND السلك ذو اللون الأسود للبطارية مع GND على الراسبيري باي
توصيل الراسبيري باي مع L298H-bridge :
L298H-bridge  الراسبيري باي (WiringPi Pin)
IN 1 GPIO 0
IN 2 GPIO 7
IN 3 GPIO 3
IN 4 GPIO 2
GND GND

تثبيت و إستخدام المكتبة Wiring Pi :

مكتبة Wiring Pi هي مكتبة الوصول إلى GPIO  على لوحة الراسبيري باي . و انها تسمح لك التحكم بمداخل و مخارج الراسبيري باي من خلال bash script   او مباشر من خلال سطر أوامر.
تحقق أولا ما اذا كانت مكتبة wiringPi مثبتة مسبقا ام لا ، من خلال نافذة الـ  terminal قم بتشغل الامر التالي:

gpio -v

 اذا لم تقم بتثبيت GIT،  يمكنك تثبيتها من خلال الأمر التالي :

sudo apt-get install git-core

اذا تم ظهور رسالة خطأ هنا ، تأكد من تحديث الراسبيري باي إلى أخر اصدار من Raspbian :

sudo apt-get update
sudo apt-get upgrade

للحصول على WiringPi باستخدام GIT، قم بكتابة الأمر التالي:

cd
git clone git://git.drogon.net/wiringPi
cd ~/wiringPi
git pull origin

سوف تجلب النسخة المحدثة ثم يمكنك إعادة تشغيل البرنامج من خلال الأمر أدناه .
لبناء/ تثبيت البرنامج :

cd ~/wiringPi
./build

الكتابة و القراءة من المنافذ عن طريق استخدام أوامر المكتبة wiringPi :

الآن يجب أن تكون قادر على إستخدام الأداة، قم بكتابة الأمر التالي على نافذة الـ Terminal :

gpio mode 0 out

اذا لم يتم ظهور شي أو رسالة خطأ فقد تم التثبيت للمكتبة بشكل صحيح. في حال تم ظهور رسالة الخطأ “command not found error” أو شي من هذا القبيل، تأكد من تثبيت و بناء المكتبة. للقيام بتشغيل و إطفاء الـ Wiring pin 0 )LED) ، تحتاج اولا إلى تعيين الدبوس كمخرج من خلال الأمر التالي :

gpio mode 0 out

“0”هي رقم المنفذ wiring، و “OUT”  لتعيين المنفذ كمخرج . سيتم تشغيل الـ LED  من خلال الأمر التالي :

gpio write 0 1

“0” للدلاله على رقم المنفذ ، و “1”  لوضع الدبوس في حالة التشغيل الـ LED( للتشغيل 1 و إطفاءه 0) . و لإيقاف التشغيل ببساطة استخدم الأمر :

gpio write 0 0

وهناك أيضا اوامر لقراءة GPIO  والتي تسمح لقراءة وضع الدبوس. فيمكن من خلاله معرفة حالة الضوء هل هو في حالة التشغيل او الإيقاف إذا لم تكن على إستطاعه لرؤية الضوء. يمكنك ذلك عن طريق الأمر التالي :

gpio read 0

“0” لتعيين رقم المنفذ Wiring. هذا الأمر يقوم بترجيع  قيمة 1 اذا كان الضوء في حالة التشغيل و قيمة 0 اذا كان الضوء في حالة الإيقاف.

وأخيرا مكتبة wiringPi تحتوي على الكثير من الأوامر و الدوال التي تمكنك من التحكم بمداخل و مخارج الراسبيري باي ولكن لن يتم تغطيتها جميعها في هذا المشروع. يمكنك الاطلاع على هذه الروابط اذا كنت مهتم بمعرفة المزيد :

http://wiringpi.com/reference/

https://projects.drogon.net/raspberry-pi/wiringpi/the-gpio-utility/

سنقوم بإنشاء صفحة ويب على شبكة النت ، حيث انها ستكون متوافقه مع جميع الأجهزة ، و ستكون بحاجة لمعرفة اربع لغات : CSS,HTML (نمط الصفحة)، PHP (للتفاعل مع الخادم )،  JavaScript (التفاعلات مع المستخدم) . نحن بحاجة لتثبيت خادم الويب على الراسبيري باي. في حالتنا نحن لسنا بحاجة إلى قاعدة بيانات MySQL ، فقط بحاجة إلى خادم HTTP و PHP.

 تثبيت خادم الويب(Web Server) :

أولا قم بعمل تحديث للراسبيري باي :

sudo apt-get update

أولا قم بتثبيت حزمة apache2 ، من خلال الأمر التالي :

sudo apt-get install apache2 -y

 

الان قم بالتحقق ما اذا كان الخادم (Server) يعمل، قم بكتابة العنوان IP الخاص بالراسبيري باي على متصفح الويب. اذا كان يعمل ستظهر رسالة “It works!” كما هو موضح بالصورة أدناه.

remote-control-raspberry-pi-leds

إذا لم يتم مثل ما سبق، قم بالتحقق من العنوان IP الخاص بالراسبيري باي من خلال الأمر التالي :

ifconfig

أو قم بمحاولة إعادة تثبيت Apache  أو إعادة تشغيل الراسبيري باي.

للسماح للـ apache بمعالجة ملفات PHP، انت بحاجة إلى تثبيت PHP5 ووحدة PHP5 للـApache. قم بتتبع الخطوات التالية ليتم التثبيت :

sudo apt-get install php libapache2-mod-php -y

الملف  الخاص بواجهة المستخدم :

قم بالدخول إلى ملف /var/www/html/ عبر نافذة الـTerminal من خلال الأمر التالي :

cd /var/www/html

قم بعرض الملفات الموجودة على هذا الملف بإستخدام الامر التالي:

ls

سيظهر لك ملف واحد يسمى “index.html”  هذا الملف يتوافق مع صفحة “It works!”. يمكنك حذفه ليتم إنشاء الصفحة الخاصة بهاذا المشروع. قم بحذف الملف بإستخدام الأمر التالي :

sudo rm index.html

و إنشاء ملف أخر يسمى “index.php”  :

sudo nano index.php

ثم قم بكتابة النص التالي داخل الملف:

<?php
phpinfo();
?>

بعد حفظ الملف ، قم بعمل تحديث للمتصفح الخاص بك. يجب أن تشاهد صفحة طويلة مع الكثير من المعلومات حول الخادم و PHP .

 أولا، انت بحاجة إلى تفعيل بث فيديو مباشر عبر صفحة ويب. قم بتتبع خطوات درس بث فيديو مباشر عبر شبكة الإنترنت .

إنشاء واجهة التحكم :

تتألف واجهة التحكم من فيديو الكاميرا التي تم تفعيله بالخطوة السابقة، واربع مفاتيح تحكم للسيطرة على محرك السيارة.

web-controlled-robot

سيتم إنشاء واجهة الصفحة بإستخدام لغةHTML، و لتفاعلات الخادم يتم إنشاء صفحة PHP، و JAVAScript لإدارة التفاعل مع المستخدم و الرسوم المتحركة للصفحة. ويمكنك استخدام CSS لتخطيط و تنسيق الصفحة مثل الخلفية أو مفاتيح التحكم .

web-controlled-robot

اولا نحن بحاجة لملف “camera.php” لإنشاء الواجهة ولتفاعل الخادم . هذه الصفحة هي الصفحة الرئيسية التي تحتوي على مفاتيح التحكم بالمحركات، كما تحتوي على بث الفيديو المباشر.

ملف Camera.php :

يتم استخدام لغة الـ HTML لتصميم واجهة المستخدم :

 أولا : يتم إدراج فيديو البث عن طريق الأمر التالي، كما يتم تحديد الـ src  URL (عنوان الويب ) الخاص بالبث المباشر

<img height="480" width = "640" src="http://YourIPAddress:8081" />

ثم نقوم بإدراج اربعة مفاتيح تحكم بإستخدام الأمر التالي :

<button id="myP" onmousedown="mouseDown(02)" onmouseup="mouseUp(02)">Backward</button>
<button id="myP" onmousedown="mouseDown(03)" onmouseup="mouseUp(03)">Turn right</button>
<button id="myP" onmousedown="mouseDown(37)" onmouseup="mouseUp(37)">Forward</button>
<button id="myP" onmousedown="mouseDown(27)" onmouseup="mouseUp(27)">Turn left</button>

بعد ذلك، بإستخدام لغة الـ PHP نقوم بضبط إعدادات GPIO المستخدمة على الراسبيري باي كمخرج، وإعطاء الـ Pins المستخدمة القيم الإبتدائية :

system("gpio mode 0 out"); 
system("gpio write 0 0"); 
system("gpio mode 2 out"); 
system("gpio write 2 0"); 
system("gpio mode 3 out"); 
system("gpio write 3 0"); 
system("gpio mode 7 out"); 
system("gpio write 7 0");

لجعل هذه المفاتيح الأربعة تعمل مع المحركات (على سبيل المثال عند الضغط على مفتاح الرجوع للخلف يتم اشارات إلى المحركات من شأنها تحريك الروبوت للخلف)، لعمل ذلك يتم إنشاء ملفات أخرى :
– ملف camera.js يحتوي هذا الملف على الدالتين mouse_up و mouse_down للتحكم بمنافذ الراسبيري باي.
– ملف camera_rotate.php يتلقى المحتوى من camera.js، وبعد ذلك يتم تطبيق الإشارات على الـ GPIO المستخدمة في المشروع عن طريق إرسال إشارات إلى المحركات للتحكم بها إما 0v أو 5v.

يمكنك تنزيل ملفات صفحة الويب لهذا المشروع من هنا.  يجب حفظ جميع الملفات في /var/www/html على الراسبيري باي.
الآن قم بالإنتقال إلى شبكة الإنترنت والدخول إلى YourRaspiIPAddress/camera.php ، ستتمكن من رؤية بث الكاميرا، وسيتحرك الروبوت عند الضغط على أحد المفاتيح.




التحكم باللوحة الإعلانية عن بعد

لوحة الإعلانات اللاسلكية هو إنتقاء جيد لهذا المشروع، بدلا من أن تكون مجرد لوحة إعلانية بسيطة. أولا يجب أن نفهم الغرض من هذا المشروع، في هذا النظام يمكننا عرض رسالة أو شعار لبعض أجهزة العرض مثل شاشات الكريستال السائل (LCD)، وهذه الرسالة يمكن بسهولة وضعها و تغييرها من أي مكان في العالم، عن طريق إستخدام الانترنت لإرسال الرسالة لاسلكيا من متصفح ويب إلى شاشة الـ (LCD) المتصلة بلوحة الراسبيري باي.لذالك يمكنك إرسال الرسالة بإستخدام الحاسوب، الهاتف الذكي أو tablet .

web-controlled-iot-notice-board-using-raspberry-pi

القطع المطلوبة :

في نظام التحكم بشاشات الإعلانات، سنقوم بإنشاء خادم الويب المحلي ( local web server)،  والذي يمكنه أن يكون (A global server) على شبكة الإنترنت. في الراسبيري باي ، سيتم إستخدام شاشة العرض LCD 16×2 لعرض الرسالة و Flask لإستقبال الرسالة عبر الشبكة. كلما يتلقى الراسبيري باي أي رسالة لاسلكية من صفحة ويب ، فإنه يعرض هذه الرسالة على شاشة الكريستال السائل (LCD).

الأدوات التي تحتاجها لهذا المشروع :

HD44780

LCD 16×2 شاشة

potentiometer 10k

Potentiometer 10K Ω

220 Ω resistor

مقاومة 220 اوم

Half-size Breadboard

لوح تجارب حجم متوسط (Half size breadboard )

Raspberry Pi 3 Model B

Jumper Wires Male/Male

 اسلاك توصيل ذكر/ذكر (Jumper Wires Male Male)

Female-Male Jumper Wires

 اسلاك توصيل أنثى/ذكر (Jumper Wires Female/male)

5V 2A Switching Power Supply MicroUSB Cable

Power Supply

Samsung 8Gb Class 6 Microsd Memory Card 2

Samsung 8Gb Class 6 Microsd Memory Card

تصميم لوح التجارب :

نحن بحاجة فقط لتوصيل شاشة العرض (LCD) مع لوحة الراسبيري باي عن طريق إستخدام بعض الاسلاك على لوحة التجارب.

قم بتوصيل الدائرة كما هو موضح بالصورة :

web-controlled-iot-notice-board-using-raspberry-pi

توصيل  شاشة الـ LCD :

راسبيري باي LCD شاشة
GND Vss
5v VDD
GND RW
GPIO7 RS pin
GPIO8 Enable pin
GPIO25 D4 pin
GPIO24 D5 pin
GPIO23 D6 pin
GPIO18 D7 pin

إنشاء صفحة ويب :

في هذا المشروع، العنصر الرئيسي هو الراسبيري باي، و التي تمثل قلب هذا المشروع،وتستخدم للتحكم على العمليات المرتبطة بهذا المشروع. مثل : التحكم بشاشة العرض (LCD)، وتلقي الرسائل من الخادم (Server) .

web-controlled-iot-notice-board-using-raspberry-pi

سيتم إنشاء خادم ويب (Web Server)، الذي يوفر وسيلة لإرسال “الرسالة المراد إعلانها” الى الراسبيري باي بإستخدام Flask في متصفح الويب. Flask  هو  إطار عمل مُصغّر/صغير (Micro-Framework) وقوي فى نفس الوقت لتطوير برامج الويب عبر لغة بايثون Python، يتوفّر على عدد لا بأس به من الدوال المُساعدة، مُناسب لتطوير تطبيقات صغيرة ومُتوسّطة (مُدونة، منتدى، موقع شخصي… ).

قم بإنشاء ملف  webapp ليتم حفظ الملفات المتعلق بهذا المشروع داخله عن طريق كتابة الأمر التالي على نافة Terminal :

mkdir webapp

في هذا المشروع سوف نقوم بإنشاء صفحة ويب مع مربع نص (TextBox) و زر إرسال (Submit button)، حيث يمكننا أن ندخل “رسالة الاعلان” في مربع نص ثم رفعها إلى الخادم (Server) عن طريق النقر على زر إرسال. يتم تطوير هذا التطبيق على شبكة الإنترنت باستخدام لغة HTML. الكود البرمجي لصفحة الويب هذه سيتم شرحه و عرضه في الخطوات التالية.

لإنشاء صفحة ويب :

أولا: قم بإنشاء ملف templates في الملف webapp  عن طريق إدخال  الأمر التالي في Terminal:

cd /home/pi/webapp
mkdir templates

تحتاج إلى كتابة  كود HTML في محرر نص (text editor) و حفظ الملف مع تمديد  (.HTML)
قم بفتح محرر نص (Text Editor) تحت قائمة Accessories  في القائمة الرئيسية :

web-controlled-iot-notice-board-using-raspberry-pi

قم بكتابة كود  HTML التالي :

<h1>Web Control Notice Board</h1>
</div>

<div data-role="content">

<form method="post" action="change">
<label for="slider-1">Notice Message:</label>
<input type="text" name="lcd" id="lcd" />
<br />

<input type="submit" value="Submit" />
</form>

{% if value %}
<p> Notice Submitted Successfully: {{ value }}</p>
{% endif %}

</div>
web-controlled-iot-notice-board-using-raspberry-pi

قم بحفظ الملف بتمديد(.HTML) مثل (index.html) في ملف templates ، الذي تم إنشاءه داخل ملف webapp.

لمحة عن الكود :
صفحة الويب يتم إنشاءها بلغة HTML ، والتي تحتوي على مربع نص :

 <input type="text" name="lcd" id="lcd" />

وزر إرسال  (Submit button) :

 <input type="submit" value="Submit" />

مع عنوان للصفحه :

<h1>Web Control Notice Board</h1>

عند النقر على زر إرسال سيتم إستخدام POST method  لتنفيذ الكود. ثم نقوم بعرض الرسالة التي تم إرسالها إلى الراسبيري باي عن طريق الخادم (Server).

{% if value %}
<p>Notice Submitted Successfully: {{ value }}</p>
{% endif %}

فهي تقوم بالتحقق ما اذا كانت هناك نص في مربع النص ثم تقوم بطباعة النص على صفحة الويب نفسها، بحيث يمكن للمستخدم أيضا رؤية الرسالة المرسلة.

أولا قم بتثبيت حزمة Flask. وتأكد من أنك متصل بالانترنت، إما عن طريق  Ethernet Cable أو عن طريق WIFI   قبل أن تبدأ.

قم بكتابة الأمر التالي على نافذة Terminal  لتثبيت الـ Flask :

sudo apt-get install python3-flask

جزء البرمجة في هذا المشروع يلعب دورا هاما للغاية لأداء جميع العمليات. أولا وقبل كل شي نحن بحاجة إلى درج المكتبات المطلوبة لـ  Flask .ثم تهيئة المتغييرات و تحديد Pins  لشاشة الكريستال السائل  (LCD) .

from flask import Flask
from flask import render_template, request
import RPi.GPIO as GPIO
import time
app = Flask(__name__)

# Define GPIO to LCD mapping
LCD_RS = 7
LCD_E = 8
LCD_D4 = 25
LCD_D5 = 24
LCD_D6 = 23
LCD_D7 = 18

لبرمجة شاشة الكريستال السائل (LCD) ، يتم إنشاء الدالة ()lcd_init لتهيئة شاشة LCD.

def lcd_init():
# Initialise display
  lcd_byte(0x33,LCD_CMD) # 110011 Initialise
  lcd_byte(0x32,LCD_CMD) # 110010 Initialise
  lcd_byte(0x06,LCD_CMD) # 000110 Cursor move direction
  lcd_byte(0x0C,LCD_CMD) # 001100 Display On,Cursor Off, Blink Off
  lcd_byte(0x28,LCD_CMD) # 101000 Data length, number of lines, font size
  lcd_byte(0x01,LCD_CMD) # 000001 Clear display
  time.sleep(E_DELAY)

 و الداله  ()lcd_byte لإرسال الأوامر إلى الشاشة، , و الداله  ()lcd_string لإرسال البيانات المراد عرضها على الشاشة إلى الـ LCD .

def lcd_string(message,line):
# Send string to display
  message = message.ljust(LCD_WIDTH," ")
  lcd_byte(line, LCD_CMD)
  for i in range(LCD_WIDTH):
     lcd_byte(ord(message[i]),LCD_CHR)

 و فيما يلي هذا الجزء من البرنامج يستخدم لإرسال رسالة من متصفح ويب إلى الراسبيري باي بإستخدام Flask .

@app.route("/")
def index():
   return render_template('index.html')
@app.route("/change", methods=['POST'])
def change():
  if request.method == 'POST':
    # Getting the value from the webpage
    data1 = request.form['lcd']
    print ("---Message is", data1)
    lcd_string(data1,LCD_LINE_1)
  return render_template('index.html', value=data1)
if __name__ == "__main__":
  app.debug = True
  app.run('192.168.1.19', port=8080,debug=True)

قم بكتابة الكود البرمجي كاملا  كالتالي :

#import
from flask import Flask
from flask import render_template, request
import RPi.GPIO as GPIO
import time
app = Flask(__name__)

# Define GPIO to LCD mapping
LCD_RS = 7
LCD_E  = 8
LCD_D4 = 25
LCD_D5 = 24
LCD_D6 = 23
LCD_D7 = 18


# Define some device constants
LCD_WIDTH = 16    # Maximum characters per line
LCD_CHR = True
LCD_CMD = False

LCD_LINE_1 = 0x80 # LCD RAM address for the 1st line
LCD_LINE_2 = 0xC0 # LCD RAM address for the 2nd line

# Timing constants
E_PULSE = 0.0005
E_DELAY = 0.0005
GPIO.setwarnings(False)
GPIO.setmode(GPIO.BCM)       # Use BCM GPIO numbers
GPIO.setup(LCD_E, GPIO.OUT)  # E
GPIO.setup(LCD_RS, GPIO.OUT) # RS
GPIO.setup(LCD_D4, GPIO.OUT) # DB4
GPIO.setup(LCD_D5, GPIO.OUT) # DB5
GPIO.setup(LCD_D6, GPIO.OUT) # DB6
GPIO.setup(LCD_D7, GPIO.OUT) # DB7


def lcd_init():
  # Initialise display
  lcd_byte(0x33,LCD_CMD) # 110011 Initialise
  lcd_byte(0x32,LCD_CMD) # 110010 Initialise
  lcd_byte(0x06,LCD_CMD) # 000110 Cursor move direction
  lcd_byte(0x0C,LCD_CMD) # 001100 Display On,Cursor Off, Blink Off
  lcd_byte(0x28,LCD_CMD) # 101000 Data length, number of lines, font size
  lcd_byte(0x01,LCD_CMD) # 000001 Clear display
  time.sleep(E_DELAY)

def lcd_byte(bits, mode):
  # Send byte to data pins
  # bits = data
  # mode = True  for character
  #        False for command

  GPIO.output(LCD_RS, mode) # RS

  # High bits
  GPIO.output(LCD_D4, False)
  GPIO.output(LCD_D5, False)
  GPIO.output(LCD_D6, False)
  GPIO.output(LCD_D7, False)
  if bits&0x10==0x10:
    GPIO.output(LCD_D4, True)
  if bits&0x20==0x20:
    GPIO.output(LCD_D5, True)
  if bits&0x40==0x40:
    GPIO.output(LCD_D6, True)
  if bits&0x80==0x80:
    GPIO.output(LCD_D7, True)

  # Toggle 'Enable' pin
  lcd_toggle_enable()

  # Low bits
  GPIO.output(LCD_D4, False)
  GPIO.output(LCD_D5, False)
  GPIO.output(LCD_D6, False)
  GPIO.output(LCD_D7, False)
  if bits&0x01==0x01:
    GPIO.output(LCD_D4, True)
  if bits&0x02==0x02:
    GPIO.output(LCD_D5, True)
  if bits&0x04==0x04:
    GPIO.output(LCD_D6, True)
  if bits&0x08==0x08:
    GPIO.output(LCD_D7, True)

  # Toggle 'Enable' pin
  lcd_toggle_enable()

def lcd_toggle_enable():
  # Toggle enable
  time.sleep(E_DELAY)
  GPIO.output(LCD_E, True)
  time.sleep(E_PULSE)
  GPIO.output(LCD_E, False)
  time.sleep(E_DELAY)

def lcd_string(message,line):
  # Send string to display
  message = message.ljust(LCD_WIDTH," ")

  lcd_byte(line, LCD_CMD)

  for i in range(LCD_WIDTH):
    lcd_byte(ord(message[i]),LCD_CHR)

lcd_init()
lcd_string("Rasbperry Pi",LCD_LINE_1)

    
@app.route("/")
def index():
    return render_template('index.html')
@app.route("/change", methods=['POST'])
def change():
 if request.method == 'POST':
    # Getting the value from the webpage
   data1 = request.form['lcd']
   print ("---Message is", data1)
   lcd_string(data1,LCD_LINE_1)

 return render_template('index.html', value=data1)
if __name__ == "__main__":
    app.debug = True
    app.run('192.168.1.19', port=8080,debug=True)

قم بحفظ ملف الكود app.py داخل ملف webapp الذي تم إنشاءه مسبقا. flask  سوف يقوم بالبحث عن index.html في ملف templates، الموجود على نفس الملف الذي يحتوي ملف الكود app.py .
بعد ذلك يمكنك تشغيل برنامج البايثون ولكن قبل ذلك تحتاج إلى استبدال عنوان IP في برنامج مع عنوان IP للراسبيري باي الخاصه بك.يمكنك التحقق من عنوان IP عن طريق كتابة الامر التالي على نافذة terminal :

Ifconfig

بعد تشغيل كود البايثون ثم بفتح http://IP_address_of_your_Pi:8080 في متصفح الويب و ادخل الرسالة ثم انقر فوق زر الارسال .