كتابة برنامج نوافذ

الفصل الثانى

كتابة برنامج نوافذ

Windows Program Structure

فى هذا الفصل نعرض لك خطوات تصميم برنامج فى بيئة النوافذ باستعمال VC++ ونستعمل هذه الخطوات فى تصميم أول برنامج ،كما نعرض لك كيفية استعمال مجموعة كتب VC++ الملحقة ببرنامج VC++ وكيفية الحصول على شرح لأية دالة أو أمر من أوامر لغة VC++.

-تأخذ البرمجة فى بيئة النوافذ طابع مختلف عن البرمجة فى بيئة نظام التشغيل DOS حيث كان المبرمج فى بيئة نظام التشغيل DOS يكتب كثير من الأوامر لتصميم كل جزء من البرنامج بما فى ذلك الشاشات الرئيسية للبرنامج وشاشات الادخال والاخراج وغيرها ، ولكن مع وجود برنامج النوافذ وانتشاره اختلف الأمر كثيراً مع المبرمج حيث وفر برنامج النوافذ ولغات البرمجة جميع الأدوات الجاهزة المطلوبة لتصميم ذلك ، وبالتالى اختلفت خطوات تصميم البرنامج وأصبحت كما يلى :-

خطوات تصميم البرنامج

يأخذ تصميم البرنامج فى بيئة النوافذ مرحلتين هما :

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

أول برنامج

افتح ملف البرنامج VCEX1من الفهرس CHPT1 او تابع معنا مراحل تصميم البرنامج ونفذه تحصل على شكل رقم ‌2-1

والشكل ( 2 -1 ( عبارة عن شاشة بها زرا أوامر عند الضغط على الأول باستعمال الفأرة تحصل على رسالة ترحيب كما بالشكل 2-2

وعند الضغط على زر الأمر الثانى يعرض البرنامج رسالة ثم ينتهى وهو برنامج بسيط يوضح لنا خطوات تصميم برنامج باستخدام VC++

ولتصميم البرنامج إتبع الخطوات الاتية :

1. قم بتشغيل برنامج VISUAL C++ نحصل على الشاشة الرئيسية كما فى الشكل( 2 - 3 ) .

شكل2-3

2222. من القائمة الرئيسية اختار File ومنها اختار NEW تحصل على صندوق 2. من القائمة الرئيسية اختر File ومنها اختر New تحصل على صندوق حوار يحدد نوع الملف المطلوب إنشائه كما فى الشكل 2-4

3. اختر PROJECT WORKSPASE ثم OK تحصل على صندوق حوار لكتابة اسم المشروع.

4. اكتب اسم للمشروع وليكن VCEX1(مع استعمال الفأرة لتحديد مسار المشروع) فيتم إنشاء فهرس فرعى باسم المشروع اضغط Creat

5. تحصل على صندوق حوار به أنواع مختلفة للمشروع كما فى شكل 2-5 ومعناها كما يلى :-

Single document	ومعناه برنامج به شاشة عليها قائمة اختيارات ولايسمح فى هذا البرنامج بفتح اكثر من وثيقة(ملف) فى نفس الوقت .
Multiple Document	ومعناه مشروع به قائمة اختيارات ولكن يمكن فتح أكثر من ملف فى نفس الوقت فى هذا النوع.
Dialog Based	ومعناه مشروع يبنى على صندوق حوار مثل Form فى Visual Basic وهو أبسط أنواع البرامج.

اختر Dialog Based كما فى الشكل 2-5

ثم اضغط Next نحصل على الشكل 2-6

6. يعرض الشكل 2-6مجموعة اختيارات نحدد منها ما نريد ظهوره فى البرنامج وهذه الاختيارات هى :

About Box	ومعناه ظهور صندوق About ( الذى يعرض معلومات عن البرنامج )عند الضغط على الركن العلوى الأيسر للبرنامج.
Centext Help	ومعناه إضافة ملف مساعدة لتوضيح إستعمال البرنامج.
Use 3D Controls	ومعناه ظهور جميع الأدوات المستعملة فى شكل ثلاثى الأبعاد .

حدد الاختيارات كما فى الشكل 2-6 واكتب عنوان للبرنامج ثم اضغط على NEXT تحصل على الشكل 2-7

7. الشكل 2-7 عبارة عن مجموعة اختيارات تحدد مواصفات نص البرنامج وهى : سؤال هل تريد تعليقات ( نعم / لا) ونوع ملف المشروع وطريقة ربط البرنامج ، اضغط NEXT تحصل على صندوق يحتوى على الفصائل والملفات التى يتكون منها البر نامج كما فى شكل 2-8.

1. فى النهاية اضغط Finsh تحصل على شاشة بمواصفات البرنامج التى تم تحديدها كما فى الشكل 2-9 إضغط OK يقوم VC++ بتخليق برنامج بهذه المواصفات.

شكل 2-9 صندوق مواصفات البرنامج النهائية

تنفيذ البرنامج قبل التعديل

بعد انشاء الشكل المبدئى للبرنامج يمكن تنفيذه بدون تعديلات لمشاهدة الشكل الاولى للبرنامج وذلك كما يلى :-

1. من القائمة الرئيسية من الاختيار BUILDاختر Bulid VCEX1 EXE فيقوم برنامج VC++بترجمة وربط البرنامج.

2. انتظر قليلا حتى يتم ترجمة وربط البرنامج وتحصل فى أسفل الشاشة على رسالة تفيد بعدم وجو د أخطاء فى البرنامج وهى:

0 ERRORS ,0 WARNINGS ثم اختر BUILDومنه نختر Execute تحصل على نتيجة تنفيذ البرنامج كما فى الشكل 2-10

وهذا هو الشكل المبدئى الذى خلقه لك VC++ بالمواصفات التى تم تحديدها مسبقا ، وهو عبارة عن زرى أوامر هما OK و Cancle وسطر نص به رسالة وعلينا تعديل هذا الشكل حتى يوافق الشكل المطلوب.

ملحوظة

بمجرد تنفيذ البرنامج نحصل على نسخة تنفيذية من البرنامج باسم البرنامج ، ففى هذه الحالة نحصل على الملف VCEX1.EXEفى الفهرس الذى تم تحديده عند الانشاء .

تعديل البرنامج

أولاً: نقوم بتعديل شكل البرنامج ليصبح كما فى شكل 2-1 وذلك بالخطوات التالية :

1. فى الشاشة الرئيسة يوجد صندوق ملفات البرنامج الذى يحتوى على جميع محتويات البرنامج الحالى ,ويحتوى الصندوق أيضا على أربعة أزرار تعطى وظائف مختلفة كما فى شكل 2-11

وبالشكل وظيفة كل زر.

انقر زر موارد وأدوات البرنامج ثم من صندوق مكونات البرنامج - انقر مرتين

على VCEX1 RESOURCES تحصل على قائمة بموارد البرنامج كما فى الشكل 2-12

ملحوظة :

موارد البرنامج هى جميع الأدوات التى توجد فى البرنامج مثل صناديق الحوار والصور والرموز وغيرها.

- من قائمة موارد البرنامج انقر مرتين على DIALOG ثم انقر مرتين على

IDD VCEX1_DIALOG تحصل على الشكل المبدئى لصندوق الحوار الذى يمثل البرنامج والذى أنشأه لك VC++ والذى ظهر فى نتيجة التنفيذ -كما فى الشكل 2-13.

2. قم بتعديل الشكل بحذف جميع الأدوات الموجودة على صندوق الحوار 2. قم بتعديل الشكل بحذف جميع الأدوات الموجودة على صندوق الحوار وذلك بالنقر مرة واحدة على الأداة بالفأرة فيتم تعليم هذه الأداة ثم بالضغط على مفتاح Del يتم حذف الأداة وهكذا حتى نحصل علىصندوق الحوار بعد حذف الأدوات.

3. قم بوضع الأدوات على هذا الشكل وذلك من صندوق الادوات الموجود 3. قم بوضع الأدوات على هذا الشكل وذلك من صندوق الأدوات الموجود على اليمين كما فى الشكل 2-14 الذى يوضح صندوق الادوات واسم كل أداة ،ويتم توضيح عمل كل أداة فيما بعد.

اختر زر أوامر بالنقر عليه مرة واحدة فى صندوق الأدوات ووقعه على صندوق الحوار بالنقر داخل الصندوق مرة واحدة ،اضغط على زر الأوامر مرتين بالفأرة نحصل على صندوق خصائص هذه الأداة كما بالشكل 2-15.

غير الكلمة المكتوبة على الأداة بتغير خاصية Caption واكتب كلمة Click مكان كلمة BUTTON1 ثم اضغط ENTER.

4. بالمثل اختر زر أوامر آخر وضعه على الشكل مع تغيير خاصية Caption له الى كلمة Exit واترك خاصية ID كما هى وهو الاسم المميز لهذه الأداة (ويمكن تغييره) ،ويتم التعامل مع الأداة بهذا الاسم

(خاصية ID تقابل خاصية Name فى برنامج Visual Basic).

5. احفظ التغيرات اما من File ثم Save أو رمز الديسك فى شريط الأدوات.

ملحوظة

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

كتابة أوامر البرنامج

بعد تخليق الشكل المبدئى للبرنامج وتعديله بما يناسب الشكل المطلوب لابد من كتابة الأوامر التى تحقق عمل أزرار الأوامر ولتحقيق ذلك اتبع الخطوات التالية :

1. من القائمة الرئيسية من View اختر Class Wizard تحصل على الشكل2-16 ،

فى هذا الشكل نجد صندوقى اختيارات ،الأول عنوانه Object IDc فى الجانب الايسر ويحتوى على أسماء الادوات الموجودة على صندوق الحوار والثانى عنوانه Messages ويحتوى على (الحالات التى يمكن أن تتعرض لها الأداة) والرسائل التى يمكن ان يصدرها برنامج النوافذ بخصوص هذه الأداة.

2. من الصندوق الأول اختر الأداة التى ترغب فى كتابة أوامر لها وهى IDC-BUTTON1 ومن الصندوق الثانى اختار الحالة التى تريد أن تكتب لها أوامر وهى BN-CLICKED ومعناها فى حالة النقر على زر الأوامر ثم اختر Add Function ومعناها اضافة دالة لهذه الأداة فتحصل على صندوق حوار يقترح عليك اسم للدالة اضغط OK للموافقة على هذا الاسم أو غيره الى الاسم الذى ترغبه كما فى الشكل (2-17).

3. ولكتابة سطور هذه الدالة اضغط Edit Code نحصل على الشكل (2-18)

وفيه اكتب سطور الدالة كما يلى :-

Message Box (“Welcome With you ......”)

(لاحظ أن الحروف الكبيرة والصغيرة فى الأوامر تكتب كما تراها حيث يكتب الحرف الأول من كل كلمة بالحرف الكبير )

4. بنفس الخطوات التى استعملناها لكتابة أوامر زر الاوامر الاول إكتب أوامر زر الأوامر الثانى وهى باختصار كما يلى :-

· من القائمة الرئيسية اخترView ثم Class Wizard تحصل على صندوق حوار اختر زر الأوامر الثانى وهو IDC_BUTTON2 ثم اختر BN-CLICED ثم اختر Add Function نحصل على صندوق اضافة دالة اضغط OK ثم اضغط Edit Code لتكتب نص الأوامر ، واكتب السطر التالى :-

ONOK ();

ثم احفظ التغيرات كما سبق وبهذا تم الانتهاء من تصميم شكل البرنامج وتعديله وكتابة أوامر البرنامج ويبقى تنفيذ البرنامج ويتم كما يلى:

اختر Build EXE VCEX1 ثم اختر VCEX1 Execute تحصل علىنتيجة التنفيذ.

جرب استعمال البرنامج بالضغط على زر الأوامر الأول بالفأرة تحصل على صندوق يحتوى على رسالة اضغط على زر الأوامر الثانى تخرج من البرنامج

ملخص خطوات تصميم برنامج

مما سبق ترى أن تصميم البرنامج يأخذ الخطوات التالية :

1. من File نختر New ثم Project

2. خلال مجموعة خطوات نحدد مواصفات البرنامج المطلوب تصميمه.

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

4. نصمم الشكل المطلوب للبرنامج باستعمال الادوات المتاحة ثم تحفظ التغيرات.

5. نكتب الأوامر التى تحقق البرنامج كما يلى:

- نختر view ثم Class wizard ثم نحدد الأداة المطلوبة ثم الحالة

- نختر Addfunction ثم Edit Code

- نكتب الاوامر المطلوب تنفيذها مع هذه الاداة

6. ننفذ البرنامج كما يلى:

- نختر Build ثم Build EXE ثم Execute

7. للتعديل فى البرنامج نخرج من البرنامج ثم نعود للخطوات السابقة من أول التعديل فى البرنامج.

صندوق الأدوات

يحتوى صندوق الأدوات على مجموعة من الأدوات التى تستخدم فى تصميم البرنامج ،وكل أداة لها استخدام فاذا كنت من مبرمجى Visual Basic فأنت تعرف معظم هذه الأدوات والشكل 2-19 يحتوى على صندوق الأدوات موضح عليه أسماء الأدوات وفيما يلى (جدول 2-1) بهذه الأدوات واستخداماتها على أن يتم دراسة هذه الأدوات فى فصول البرنامج مع برامج تطبيقية لها.

اسم الاداة	المعنى	الاستخدام
PICTURE	أداة عرض صورة	لعرض صورة فى صندوق الحوار
STATIC TEXT	أداة كتابة عنوان	لكتابة عنوان أو كلمة على صندوق الحوار
EDIT BOX	صندوق الكتابة	استقبال بيانات من المستخدم
BUTTON	زر أوامر	لتنفيذ أمر معين عند النقر عليه
CHECK BOX	أداة اختبار	لتحديد حالة نعم أم لا
RADIO BOX	أداة اختبار	لتحديد حالة نعم أم لا
COMBO BOX	صندوق قائمة اختيارات	عرض مجموعة اختيارات واختيار احداها
LIST BOX	صندوق قائمة اختيارات	عرض مجموعة اختيارات واختيار احداها
H_SCROLL	شريط ازاحة افقى	زيادة ونقصان قيمة واستخدام هذه القيمة
V_SCROLL	شريط ازاحة رأسى	زيادة ونقصان قيمة واستخدام هذه القيمة
ANIMATE BUTTON	أداة حركة الصور	عرض مجموعة صور بشكل متتالى
TAB CONTROL	أداة عرض الصفحات	وضع أدوات على صفحات وعرضها
TREE CONTROL	أداة الشجرة	عرض الادوات فى شكل شجرة

جدول (2-1) بأدوات صندوق الادوات واستخداماتها

مساعدات التصميم

بالاضافة لمجموعة الادوات التى تستخدم فى تصميم البرنامج يوجد مجموعة من أزرار الاوامر فى VISUAL C++ التى تسهل على المبرمج تصميم شكل البرنامج مثل محازاة أكثر من أداة للجانب الأيسر أو الجانب الأيمن ومثل مساواة ارتفاع أكثر من أداة أو مساواة الأدوات فى الحجم وهكذا…

وتظهر هذه الأدوات فى حالة تصميم صندوق الأدوات فى أسفل الشاشة والشكل 2-20 يوضح هذه الأدوات والغرض منها .

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

استعمال كتب VC++ الموجودة بالبرنامج

قام مصممو برنامج VC++ بوضع جميع الكتب الخاصة بالبرنامج والتى توزع مع البرنامج داخل حزمة لتسهل على المبرمجين قراءة الكتب واستعمالها ويتم ذلك كما يلى :

من القائمة الرئيسية اختر Help ثم Contents كما فى شكل 2-21

ومنه نختار Visual C++ books وهى قائمة الكتب لك أن تختار راى كتاب ومنه تختر أى فصل ومن الفصل تختار موضوع وهكذا كما بالشكل (2-22).

ويمكن لك الاطلاع على الأمثلة الموجودة ونسخ أجزاء منها واستعمالها.