مقدمة عامة

في هذا القسم ...

"مفهوم الواجهات " "كيف تعمل الواجهة الرسومية ؟ " "تصميم الواجهة الرسومية" "طرق بناء الواجهات الرسومية"

مفهوم الواجهات

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

من هذه المكونات : القوائم ، شريط الأدوات ، زر الضغط ، زر الإختيار، المنزلقة ..وغيرها.

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

الشكل التالي يبين واجهة رسومية بسيطة ، تستطيع أن تبنيها بنفسك بسهولة  :

مكونات الواجهة السابقة :

1.     Axes  المحاور التي سيرتسم عليها الرسم البياني
2.     Buttons ثلاث أزرار ضغط ،تدعم ثلاث أنواع من الرسوميات: surface,mesh and contour
3.     Static text نص ستاتيكي لتسمية القائمة المنسدلة
4.     Pop-up menu القائمة المنسدلة ، تتيح لنا قائمة من الخيارات .عندما تضغط على زر من أزرار الضغط الثلاثة ،المحاور ستعرض رسم ثلاثي أبعاد يعبر عن البيانات التي إخترتها.  

كيف تعمل الواجهة الرسومية ؟

- في الواجهة الرسومية السابقة، عندما تختار البيانات من القائمة المنسدلة ،ثم تختار نمط الرسم الذي تريده من خلال النقر على زر ضغط ، نقرة الزر هذه تقوم باستدعاء التابع الذي يرسم البيانات المختارة على المحاور axes .

- أغلب الواجهات الرسومية تنتظر المستخدمين ليؤثروا على المكونات الموجودة في الواجهة،ثم تستجيب لكل حدث يتم تفعيله.

كل مكون في الواجهة وحتى الواجهة نفسها، تترافق بواحدة أو أكثر من الإجرائيات المكتوبة من قبل المستخدم والتي تعرف بإسم الإستدعاءات (callbacks) ، سميت بذلك  call back لانها تستدعي أو تطلب  من الماتلاب القيام بفعل ما.

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

ثم تستجيب  الـ gui لهذه الأحداث events.

- عندما تقوم ببناء الواجهة الرسومية ، ستقوم بإضافة إستدعاءات تخبر الكائن ماذا سيفعل عند إستجابته لحدث ما .

غالباً يُعرف هذا النوع من البرمجة بالبرمجة المُقادة بالحدث (event-driven programming ) .

على سبيل المثال : نقرة الزر (حدث).

- في البرمجة المقادة بالحدث تنفيذ الإستدعاء غير متزامن

 ويتم تشغيله من قبل الأحداث الخارجية التي تؤثر في البرنامج .

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

- تستطيع كتابة (برمجة) الإستدعاءات بطريقتين مختلفتين :

• كتوابع functions بلغة الماتلاب تُخزّن  في ملفات التعليمات البرمجية code files 
• كمحارف(سلاسل محرفية)  strings تحوي تعبيرات وأوامرمثل ('c = sqrt(a*a + b*b ); ' or 'print')

- إن إستخدام التوابع functions   كإستدعاءات أفضل من إستخدام السلاسل المحرفية strings ،و أكثر قوة ومرونة .

Matlab scripts (هو عبارة عن تسلسل البيانات المخزّنة  في ملفات التعليمات البرمجية التي لا تملك وظائف محددة) لا يمكن أن تستخدم الإستدعاءات .

- رغم أنك تزوّد الإستدعاء callback ببعض البيانات وتجعلها تنفذ أي شيء تريده منها ، لكن لا يمكنك التحكم بها عندما يتم تنفيذها.  

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

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

كيف أبدأ ؟

قبل أن تبدأ بإنشاء الواجهة الرسومية gui يجب أن تصممها ، كحد أدنى عليك أن تقرر:

• مستخدمي الواجهة مَن سيكونون .
• ماذا تريد من الواجهة أن تفعل .
• كيف سيتفاعل المستخدمين مع الواجهة .
• ماهي المكونات التي تحتاجها الواجهة لتقوم بعملها .

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

وهذا يضمن تحديد : المدخلات (المعطيات) والمخرجات ،والعروض وسلوك الواجهة الرسومية ،وتطبيقات أو وظائف مكوناتها .

إضغط على الصورة لتكبيرها

- بعد أن صممت واجهتك الرسومية gui ،عليك أن تبرمج كل كائن في الواجهة ليعمل بشكل صحيح  دوماً.

- أخيراً .. قم بتجربة وإختبار واجهتك لتتأكد من أنها تعمل كما لو أنها معدة تحت ظروف واقعية (والأفضل من ذلك ،أن تدع شخص آخر يجربها) .

إذا أظهر الإختبار عيوب في التصميم أوعيوب برمجية  ،أعد التصميم حتى تعمل الواجهة بالشكل المطلوب.
  - والرسم البياني التالي يوضح جوانب من هذه العملية.

طرق بناء الواجهات الرسومية GUIs في الماتلاب

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

- يمكنك بناء الواجهات الرسومية في الماتلاب بطريقتين :

• بإستخدام الأداة GUIDE   (GUI Development Environment) ،وهي أداة فعّالة لبناء الواجهات الرسومية .
• عن طريق الملفات البرمجية code files التي تولّد الواجهات الرسومية ، أي بناء برمجي للواجهة الرسومية كـ functions or scripts .

الطريقة الاولى .. تبدأ بالشكل figure ،تضيف الكائنات إلى واجهتك (أزرار قوائم،محاور ..وغيرها) ،هذه الكائنات موجودة  ضمن محرر تخطيط الرسوميات graphic layout editor .

GUIDE يقوم بإنشاء ملف التعليمات البرمجية،الذي يحوي الإستدعاءات المرتبطة بالواجهة gui ومكوناتها .

ويقوم بحفظ ملفين معاً هما :
 ملف الشكل figure (FIG-file) ، والكود أي الملف البرمجي (m-file )،وعندما تفتح أحدهما يقوم بفتح الآخر تلقائياً لتشغيل الواجهة .

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

عادة لا يتم حفظ الشكل figure بين الدورات لأن الكود في الملف يقوم بتوليد شكل جديد في كل مرة يتم تشغيله فيها.

- ونتيجة لذلك،الملفات البرمجية في الطريقتين السابقتين تبدو مختلفة.

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

أما الواجهات الرسومية المنشأة بواسطة guide ،أغلب الخواص يتم تحديدها ضمن الشكل figure نفسه،وتخزن التعاريف في ملفها FIG-file بدلاً من إضافتها في ملف التعليمات البرمجية code file .

أما ملف التعليمات البرمجية code file فيحوي الإستدعاءات callbacks وتوابع أخرى functions ،التي تقوم بتهيئة الواجهة الرسومية gui عندما تفتح .

- أيضاً يوفر برنامج الماتلاب توابع لتبسيط إنشاء صناديق الحوار القياسية،مثل مربعات حوار للتحذيرات ،أو لفتح وحفظ الملفات .

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

يبين الجدول التالي بعض الحالات:

نوع الواجهة الرسومية GUI	التقنية Technique
Dialog box مربع الحوار	برنامج الماتلاب يوفر تشكيلة من مربعات الحوار القياسية،التي يمكنك توليدها بإستدعاء تابع واحد. مثلاً: msgbox ،الذي يدعم أيضاً روابط لتوابع تقوم بتوليد مربعات حوار محددة مسبقاً.
واجهة رسومية gui تحوي فقط القليل من الكائنات	لبناء واجهة رسومية تحوي القليل من  العناصر غالباً الأسهل إعداد ذلك برمجياً. حيث بإمكانك تعريف كل كائن بشكل كامل بإستدعاء تابع واحد .
الواجهات الرسومية المركبة ،المعقدة	GUIDE هو الطريقة الأسهل لإنشاء الواجهات المعقدة
واجهات رسومية معقدة مع العديد من العناصر،وهذه الواجهات تتطلب تفاعل مع واجهات رسومية اخرى	إنشاء الواجهات الرسومية المعقدة برمجياً يتيح لك التحكم ووضع الضبط المناسب لكل المكونات ويدعم التكرارية

 - كما يمكنك الدمج بين الطريقتين السابقتين،فتقوم بإنشاء الواجهة الرسومية بإستخدام الـ GUIDE  ثم تعدل عليها برمجياً.

لكن على اية حال لا يمكنك أن تقوم بإعداد الواجهة برمجياً ثم التعديل عليها لاحقاً بإستخدام الـ GUIDE .

سنتعرف في الفقرات القادمة على كيفية إنشاء الواجهة الرسومية  برمجياً ،وبإستخدام الأداة guide ، نتمنى لكم المتعة والفائدة :)