[ملك الهكرز]

بتمنا الكل يستفيد
التعرف على شاشات الفيجول بيسيك:
بداية وقبل كل شيء لابد أن نتعرف على شاشات الفيجول، لكي تسهل عملية التعامل معها فيما بعد:
عندما نفتح الفيجول بيسك ستظهر شاشة التحيه للحظات ثم تختفى ليظهر مربع الحوار التالى وهو يتيح لك إنشاء مشروع جديد New، أو فتح مشروع موجود Existing، أو فتح مشروع تم عمله قريباً Recent.


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


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

النموذج (الفورمة) Form:
وهى مساحة العمل الأساسيه، أو الواجهة الأساسية لبرنامجك والذي ستظهر للمستخدم عند تشغيل البرنامج.


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

وأهم الأدوات التي سنستخدمها في هذا الدرس هي الأداة Command Button ،، وهي أداة الزر ،، ووظيفتها إظهار زر للمستخدم بحيث يستطيع الضغط عليه لغرض معين.

شاشة الخصائص Properties:

ومن خلالها نستطيع تغيير خصائص أي أداة في البرنامج .. طولها ، عرضها، مكانها، لونها ... الخ.
على سبيل المثال لنفرض أن لدينا هاتين الأداتين وهما زرين: و
ما الذي تلاحظه على هاتين الأداتين ؟ هل هما بنفس الشكل ؟ كما ترى الجواب لا، فإن الزر الأول يختلف عن الزر الثاني في بعض الأشياء، حيث أن خاصية نوع الخط بالنسبة للزر الأول هي Tahoma بينما الزر الثاني Andalus، وخاصية حجم الخط بالنسبة للزر الأول هي 8 بينما الزر الثاني 14، كما أن خاصية الطول والعرض لكل منهما مختلفة و.. و.. الخ. وهذا ما يمكن تسميته بالخصائص التي تميز كل أداة عن الأخرى،

وأهم الخصائص الذي سنحتاجها حالياً:
الخاصية Name وتعني الاسم الخاص بالأداة، ولا يظهر هذا الاسم للمستخدم، وإنما يحتاجه فقط المبرمج.
الخاصية Caption وهي العنوان الذي سيظهر على الأداة للمستخدم.
الخاصية FontName وتعني نوع الخط.
الخاصية FontSize وتعني حجم الخط.
الخاصية ForeColor وتعني لون الخط.
الخاصية Top وتحدد مكان الأداة رأسياً.
الخاصية Left وتحدد مكان الأداة أفقياً.
الخاصية Hight وتعني طول الأداة.
الخاصية Width وتعني عرض الأداة.

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

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

دعنا من ذلك الآن ولنبدأ في تصميم برنامجنا الأول مباشرة، وسيتضح الأمر بعد ذلك، وفي البداية لابد أن نعلم أن البرمجة تمر بثلاث مراحل أساسية وهي:

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

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

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

[COLOR=yellow);]البرنامج الأول[/color]

نريد عمل برنامج يحتوي على زرين فقط [ترحيب - خروج]، وعندما يحدث الضغط Click على الزر الأول يقوم بكتابة (مرحباً) على النموذج، وعندما نضغط على الزر الثاني يقوم بالخروج من البرنامج، وهذه هي المرحلة الأولى (التخطيط).

ولندخل في المرحلة الثانية مباشرة (التصميم): لذلك قم باختيار الأداة Command Button (الزر) من نافذة الأدوات التي أشرنا إليها سابقاً، وقم برسم زرين داخل النموذج، بحيث يبدو الشكل هكذا:


بعد ذلك يلزمنا ضبط الخصائص الخاصة بكل أدوات البرنامج، لذلك قم بالنقر على أي نقطة في النموذج ثم اذهب إلى شاشة الخصائص لضبط خصائص النموذج، وسنكتفي يتغيير خاصية واحدة فقط وهي خاصية الـ Caption (عنوان النموذج) وسنغيرها إلى "دورة الإبداع -- البرنامج الأول" .. هل لاحظت الآن التغيير الذي حدث بالنسبة للنموذج؟؟
لننتقل الآن إلى الأداة Command1 وهي أداة الزر الأول، ولنقم بتغيير خصائصها كالتالي: الخاصية Caption (عنوان الزر) غيرها إلى "ترحيب" - الخاصية Font غيرها إلى خط أندلسي حجمه 14 - الخاصية Hight (الطول) إلى 700 - الخاصية Width إلى 1500.
ثم لنقم بتغيير خصائص الأداة Command2 كالتالي: الخاصية Caption (عنوان الزر) غيرها إلى "خروج" - الخاصية Font غيرها إلى خط Tahoma حجمه 14 - الخاصية Hight (الطول) إلى 700 - الخاصية Width (العرض) إلى 1500.

وبذلك نكون قد انتهينا من المرحلة الثانية وهي التصميم وبقيت المرحلة الأخيرة وهي: (كتابة الكود).
أولاً لإظهار شاشة الكود قم بالنقر بزر الماوس الأيمن على أي مكان في الفورم، واختر View Code ..

ستظهر لك الشاشة التالية:

وفيها ستجد خانتي اختيارات، الأولى من اليسار (General) وفيها نضع اسم الأداة التي نريد أن نكتب الكود لها، وفي الثانية (Declarations)نضع اسم الحدث الذي نريد أن ينتفذ عند حدوثه الكود.
ربما لم تفهم شيئاً ،، إليك الأمر بطريقة مبسطة ،، الآن نحن لدينا زر ترحيب على النموذج ،، وعندما يحدث الضغط Click على هذا الزر فإن البرنامج يقوم بكتابة "مرحباً" على النموذج.
إذا نحن نريد أن نكتب الكود الخاص بكتابة مرحباً على النموذج فأين نكتبه؟؟ من البديهي أننا سنكتبه في الأداة Command1 وهو اسم زر الترحيب ،، كما أنه من البديهي أيضاً أننا سنختار الحدث Click وهو الضغط على هذا الزر.
وسيكون الشكل كالتالي:


كما ترى يوجد سطران مكتوبان، لا تهتم لهما كثيراً، كل ما يهمنا هو كتابة الكود وسط هذين السطرين، وإليك الكود:
"مرحباً" Print

الآن نفذ نفس الخطوات من جديد بالنسبة للزر الآخر Command2 والخاص بالخروج، وقم بكتابة هذا الكود في داخله:
End

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




إلى هنا يبدو أني قد أطلت عليكم كثيراً ولم يبق سوى ملحوظة بسيطة أردت أن أنوه عليها، وهي أننا في البرنامج السابق قمنا بتغيير الخصائص في المرحلة الثانية، وهي مرحلة التصميم، ولكن من الممكن أيضاً تغيير الخصائص في المرحلة الثالثة وذلك بواسطة الكود ،، كالتالي: نكتب اسم الأداة، ثم نقطة، ثم اسم الخاصية الذي نريد تغييرها، ثم علامة يساوي =، ثم ما نريد وضعه في الخاصية، وإليك المثال:
Command1.Caption = "ترحيب"
وفي هذا الإطار فإننا نعتبر النموذج الفورم عبارة عن أداة أيضاً يمكن تغيير خصائصها في المرحلة الثالثة ،، على سبيل المثال:
Form1.BackColor = 0









الأول: عبارة عن برنامج يحتوي على ثلاثة أزرار [تجربة - النتيجة - خروج]عندما نقوم بالضغط على الزر الأول [تجربة] تظهر لنا العبارة التالية على النموذج "هذه هي التجربة الأولى"،، وعندما نضغط على الزر الثاني [النتيجة] تظهر لنا العبارة التالية على النموذج "تمت التجربة بنجاح"،، وعندما نضغط على الزر الثالث [خروج] يتم إغلاق البرنامج.

الثاني: برنامج يحتوي على ثلاثة أزرار [عنوان البرنامج - لون الخلفية - خروج] وعندما نضغط على الزر الأول [عنوان البرنامج] يتغير العنوان الخاص بالنموذج الفورمة إلى "أهلاُ بكم في منتديات الإبداع"، وعندما نضغط على الزر الثاني [لون الخلفية] يتغير لون الخلفية للنموذج (الفورم ) إلى اللون الأحمر، وعندما نضغط على الزر الثالث [خروج] يتم إغلاق البرنامج.

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