حياكم الله جميعاً واسعد الله اوقاتكم بكل خير
اليوم هو اول درس من سلسلة :
دورة انشاء تحزيم المشاريع بتصميم وبرمجة خاصة بك دون استخدام اى برنامج مساعدة
ومن خلال هذا الدرس الاول سنتمكن من معرفة اساسيات كيفية تصميم
وانشاء شاشات والاكواد الاساسية التى يجب ان تكون كخطوة اولى فى مرحلة التصميم
هذا الدرس هو [ الجزء الاول / المرحلة الاولى ] من تصميم شاشات التحزيم
وفى هذا الدرس سيتم عمل اول 3 شاشات كمرحلة اولى من هذه السلسلة
وستكون الشاشات عبارة عن:
1- شاشة الافتتاحية او ممكن نقول عليها ( Splash screen ) كما نعرفها.
2- شاشة الرخصة والشروط كما نعتاد عليها فى اى برنامج نقوم بتثبيته.
3- شاشة تحديد مسار تثبيت البرنامج وكذلك خصائص الاختصارات.
نبداء بامر الله فى اول شاشة وهى Splash screen
ولكن فى هذه الشاشة لم نقوم بتصميم شاشة ومن ثم ربطها من خلال
خيارات Splash screen الموجودة فى المشروع ولكن ستكون شاشة اعتيادية
بعد اتمام المدة المحددة طبقاً لعملها سيتم اختفائها ومن ثم اظهار الشاشة الاخري
ولكن فى هذا الدرس كون انه المرحلى الاولى للتصميم فسيتم عمل شاشة الـ Splash screen
كمدة يدوياً وليس عن بناء تحميل الملفات وما شبه وفى الدروس القادمة فى المستوى المتقدم
سيتم التعديل على تلك الشاشات طبقاً لبندود السلسلة لشرح كيف تحويل كل جزء من اكواد يدوية لا اكواد واوامر فعلية
يتم من خلالها تنفيذ الامر مثل جعل شاشة الـ Splash screen تستغرق مدة طبقاً للاوامر التنفيذية
صورة من شاشة الفورم الاول الخاصة بـ Splash screen
هذه الشاشة لا تحتوى على اى اضافات او ملفات
لاتمام تصميم الشكل وكل ما تم استخدامه هو الادوات الرئيسية فى VB.NET
الادوات التى تم استخدامها فى هذه الشاشة:
1- عدد 7 من اداء Label.
2- عدد 3 من اداء Panel.
3- عدد 1 من اداء PictureBox.
4- عدد 1 من اداء TableLayoutPanel.
5- عدد 1 من اداء Timer.
من اهم الاكواد المستخدمة والتى سيتم استخدامها فى جميع الشاشات
هو كود اتاحة حركة الفورم عند الضغط مع الحركة فستجد دائماً اذكر هذا الكود
فى كل شاشة ولكن قد تختلف من شاشة لاخري طبقاً لطريقة الاستخدام
الكود المستخدم فى هذه الشاشة
كود :
Public MoveForm As Boolean
Public MoveForm_MousePosition As Point
Public Sub MoveForm_MouseDown(sender As Object, e As MouseEventArgs) Handles MyBase.MouseDown
If e.Button = MouseButtons.Left Then
MoveForm = True
Me.Cursor = Cursors.SizeAll
MoveForm_MousePosition = e.Location
End If
End Sub
Public Sub MoveForm_MouseMove(sender As Object, e As MouseEventArgs) Handles MyBase.MouseMove
If MoveForm Then
Me.Location = Me.Location + (e.Location - MoveForm_MousePosition)
End If
End Sub
Public Sub MoveForm_MouseUp(sender As Object, e As MouseEventArgs) Handles MyBase.MouseUp
If e.Button = MouseButtons.Left Then
MoveForm = False
Me.Cursor = Cursors.Default
End If
End Sub
الان بعد اتمام الخطوة الاولى ناتى الى الخطوة الثانية من الكود لهذه الشاشة
وهو تحريك شريط التحميل ويتم ذلك من خلال اداء الـ Timer
بعد تعديل خصائص اداء الـ Timer من خلال جعل القيمة التالية
كود :
Enabled = True
interval = 100
طبعاً يمكنك التحكم فى الوقت كما تشاء
يتم تنفيذ الكود التالى
كود :
If iRun >= 6 Then
Label1.Text = "L o a d i n g ."
iRun = 0
End If
iRun += 1
Label1.Text += IIf(iRun = 1, Nothing, ".")
If Panel3.Width >= Panel2.Width - 3 Then Form2.Show() : Close()
Panel3.Size = New Point(Panel3.Width + IIf(Panel3.Width >= Panel2.Width - 30, 1, 10), Panel3.Height)
ماذا يعنى هذا الكود والى ماذا يشير
الكود هنا وظيفته تحريك شريط التحميل من حجم الى حجم محدد ومن ثم فتح الشاشة رقم 2
ولكن الشريط هنا المستخدم ليست ProgressBar ولكن تم استخدام ادار Panel بداخل Panel والتعلاعب بالالوان
ليكون المظهر كما هو مشار اليه فى الصورة بالاعلى لشاشة Splash screen
مع عد رقم من 1 الى 6 لاتمام عمل حركة ..... المتحركة فى جملة L o a d i n g
وناتى اسفل سطر بداية الكلاس ( Public Class Form1 ) باضافة السطر التالى
كود :
Private iRun As Integer = 0
ناتى للكود الاخير وهو كود حدث زر الاغلاق فيتم استخدام
كود :
Application.Exit()
الان بات الشاشة الاولى جاهز للعمل
ولكن حتى يتم تنفيذ ذلك علينا اولاً اتمام الاتي
يتم الضغط المذدوج على كلمة ( My Project ) الموجودة بالقائمة اليمنى لك من الشاشة
من ثم من شاشة ( Application ) ناتى عن الخيار ( Shutdown mode: )
ونجعل قيمتها :
PHP كود :
When last form closes
الان قوم بعمل اضافة فورم جديد ليكون المشروع يحتوى على Form1 و Form2
يمكنك الان اختبار الشاشة الاولى لرؤية العمل .... تذكر اننى لم اشرح كيف تم التصميم
لان الامر لا يعتمد التقليد انما انا بحاجة ان تقوم ان بعمل التصميم الذى تراه مناسباً لمشروعك
وما اقوم به هنا من وضع الاكواد هو لكي الاستفادة منه اذا به كاملاً او بجزء منه لما انت بحاجة له
ناتى الان الى الشاشة الثانية وهى شاشة License agreement
الشاشة اختيارية لا يلزم انشائها ولكن من النوع العلم والتعامل مع كل الامور
صورة للشاشة الثانية خاصة الترخيص
الـ CheckBox الموجودة بالجانب الايسر من الشاشة فى المنطقة الزرقاء
هو يشير الى الخطوات والمراحل التى سيمر عليها كلمة Next فى كل مرحلة حتى اتمام تثبيت البرنامج
فكلما تم الانتهاء من شاشة يتم عمل Checked للاداء الخاص به ستلاحظ الامر فى الشاشة القادمة
الادوات التى تم استخدامها فى هذه الشاشة:
1- عدد 7 من اداء CheckBox.
2- عدد 11 من اداء Label.
3- عدد 1 من اداء LinkLabel.
4- عدد 6 من اداء Panel.
5- عدد 1 من اداء PictureBox.
6- عدد 2 من اداء TableLayoutPanel.
7- عدد 1 من اداء TextBox.
تتذكر عندما قل عن كود تحريك الشاشة
سيتم استخدامها فى جميع الشاشات وانه قد يختلف من شاشة لاخري
هنا يبداء الاختراف البسيط بين الشاشة السابقة والشاشة الحالية
فى الشاشة الاولى من البرنامج كنت بحاجة من اى مكان بالمنطقة الزرقاء تحريك الشاشة
بمجرد الضغط والتحريك فى اى مكان من الشاشة
ولكن هنا يختلف الامر انا بحاجة فقط التحريك من الجزء الابيط العلى وفقط
الجزء الخاص كعنوان الشاشة عند الضغط والتحريك يتم الامر معى بدون مشكلة
فهنا سيكون الكود بهذا الشكل
كود :
Public MoveForm As Boolean
Public MoveForm_MousePosition As Point
Public Sub MoveForm_MouseDown(sender As Object, e As MouseEventArgs) Handles Panel2.MouseDown
If e.Button = MouseButtons.Left Then
MoveForm = True
Me.Cursor = Cursors.SizeAll
MoveForm_MousePosition = e.Location
End If
End Sub
Public Sub MoveForm_MouseMove(sender As Object, e As MouseEventArgs) Handles Panel2.MouseMove
If MoveForm Then
Me.Location = Me.Location + (e.Location - MoveForm_MousePosition)
End If
End Sub
Public Sub MoveForm_MouseUp(sender As Object, e As MouseEventArgs) Handles Panel2.MouseUp
If e.Button = MouseButtons.Left Then
MoveForm = False
Me.Cursor = Cursors.Default
End If
End Sub
لو اطلعت سريعاً على الكود لم تجد اى اختلاف او اى فرق
بين الكود السابق والكود الحالى ولكن الاختلاف فى جزء بسيط فى
فى الكود السابق كان يتم تعرف الحدث بهذا الشكل
كود :
MyBase.MouseDown
ولكن فى الشاشة الثانية تم استبدالها بـ
كود :
Panel2.MouseDown
فهنا يوضح ان الكود واحد ولكن للتمكن من استخدام الكود
لتحريك الفورم من خلال جزء محدد فقط عليك استبدال كلمة MyBase الى اسم الاداء المطلوبة
طيب ايه اكتر الاجزاء من هذه الشاشة هى كا مصدر الرئيسي للعمل عليه
اكثر الاجزاء هنا هو CheckBox الخاصة الموافقة على الشروط والاحكام
اللى وظيفتها عند اتمام الموافقة علي كلاً منهما يتم تحويل زر الاغلاق الى زر التالي
ولاتمام هذا الامر سيتطلب علينا كتابة الاكواد التالية عن كل حدث
فى حدث زر الاغلاق طبعاً الزر تم عمله من خلال اداء Panel و Label
فكل ما عليا لاتمام عمل كود الحدث لشكل الزر المصنوع سيتم استخدام الحديث كاملاً بهذا الشكل
كود :
Private Sub Next_Click(sender As Object, e As EventArgs) Handles Label1.Click, Panel6.Click
If CheckBox6.Checked AndAlso CheckBox7.Checked Then
CheckBox1.Checked = True
Form3.Show()
Close()
ElseIf Label1.Text = "C l o c e" Then
Application.Exit()
End If
End Sub
اذا كنت تصنع الزر من خلال اداء الـ Button
فكل ما عليك فى حدث الزر اجعل الكود بهذ الشكل
كود :
If CheckBox6.Checked AndAlso CheckBox7.Checked Then
CheckBox1.Checked = True
Form3.Show()
Close()
ElseIf Button1.Text = "C l o c e" Then
Application.Exit()
End If
لو تلاحظ فى الكود يوجد سطر بهذا الشكل
كود :
CheckBox1.Checked = True
الى الان هذا السطر لا وجود للهمية له فوجوده كما هو عدمه
ولكن فى المراحل القادمة من السلسلة سيكون له اهمية ومرحلة اساسية
نستكمل الان باقى الكود
طبعاً لدينا عدد 2 CheckBox للموافقة على الشروط وبحاجة لكلاهما عند تظليلهم
يتم تحويل زر الاغلاق الى التالي لاتمام ظهور الشاشة التى ياليها لاستكمال التثبيت
ولاتمام الامر فكل ما عليك وضع حدث واحد بهذا الشكل لكلاهما معاً
كود :
Private Sub acc_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox6.CheckedChanged, CheckBox7.CheckedChanged
If CheckBox6.Checked AndAlso CheckBox7.Checked Then
Label1.Text = "N e x t .."
Label1.Location = New Point(17, 7)
Else
Label1.Text = "C l o c e"
Label1.Location = New Point(15, 7)
End If
End Sub
طبعاً اذا كنت تستخدم Button بدلاً من الطريقة التى استخدمها لـ Panel
فكل ما عليك التعديل الوحيد فى الكود الاخير من استبدال Label1 الى Button1
وبالنهاية الى هذه الشاشة كود اغلاق / ×
كود :
Application.Exit()
ناتى الى الشاشة الثالثة وهو شاشة Choose install location
لتحديد مسار تثبيت البرنامج وكذلك الخيارات الرئيسية من الاختصارات البرنامج
صورة الشاشة لتحديد المسار
الى هنا انا اوقف العمل على كتابة واستكمال الموضوع
الى ان يتم الاستكمال فى الدرس القادم ان شاء الله
فكما ترم كم يبلغ طول الموضوع الان وكذلك الكم الهائل
من الوقت لعمل الشرح والتصميم حتى اسعى لتبسيط الامر
من ان كل شئ سهل ولا تحتاج الى اى اضافة واحدة
الكود الذى استخدم فى هذه الشاشة هو كود تحريك الفوم
وهو نفس الكود المستخدم فى الشاشة السابقة مباشراً
وكذلك كود اغلاق البرنامج على زر × الموجود بالاعلى
الى هنا تم اضافة المرحلة الاولى من الاساسيات
وسنستكمل فى درس اخر ان شاء الله من بعض الاكواد الالزامية مثل كود زر _ وغيره
وحتى اقوم باستكمال الامر اتمنى مشاركتكم من افكار
ماذا تقترح وضعه فى الشاشة الثالثة حتى يتم العمل عليها
عند البداء عندها فى الدرس القادم
مرفق بهذا الموضوع السورس الكود للمشروع الذى تم شرحه
مع نسخة من البرنامج ليعطى تجربة لكيفية المظهر والاداء عند فتح البرنامج
كما سيتم ارفاق الصور المستخدمة بهذا الموضوع
فاتمنى ان لا اكون مقصر فى شئ وكذلك بالشرح
واسف اذا كنت مخطاء فى شئ او سهوت عن شئ
فاتمنا ان ينال هذا الشرح لكم جميعاً وان لا يكون فى صعوبة فى فهم اى جزء من هذا الموضوع
صورة متحركة توضح عمل البرماج للخطوات المذكورة بهذا الدرس ( غير مرفقة )
الصورة بعد اختفاء الشاشة السابقة وعرض شاشة التثبيت
تحياتى لكم جميعاً
وتمنياتى لكم التوفيق الدائم
{ وَقُل رَّبِّ زِدْنِي عِلْمًا }
[ كن على يقين من اعمالنا نخطئ ومن اخطائنا نتعلم ولذلك لا شي مستحيل ]
ساهم دائماً فى لكل من يقوم بالمساهمة
فى حل المشكلة او الاستفسار لديك فالجميع هنا يعمل
على مساعدة الاخرين لوجه الله وان تحتسب له اجر عند الله
▼ شرح كيفية عمل قاعدة بيانات تعمل على اكثر من جهاز على الشبكة الداخلية
[ كن على يقين من اعمالنا نخطئ ومن اخطائنا نتعلم ولذلك لا شي مستحيل ]
ساهم دائماً فى لكل من يقوم بالمساهمة
فى حل المشكلة او الاستفسار لديك فالجميع هنا يعمل
على مساعدة الاخرين لوجه الله وان تحتسب له اجر عند الله
▼ شرح كيفية عمل قاعدة بيانات تعمل على اكثر من جهاز على الشبكة الداخلية