[Eng27]

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

المهم، وبلا طولة سيرة، وبعد المقدمة السابقة، أقدم لكم - أخوتي - كيفية برمجة وتصميم أداة أسميتها StepsProgress..

قبل البدء ببرمجة الأداة، سنشرحها بشكل مختصر:
هي أداة تعطي المستخدم إمكانية معرفة خطوته الحالية بين عدة خطوات، فمثلًا لو أن لديك 5 مهام متسلسلة، وقد أنجزت مهمتين، فأنت الآن في المهمة الثالثة.. وهنا يأتي دور هذه الأداة فتقوم بعرض 5 خطوات للمستخدم، 2 بأيقونة تشير إلى إتمامها بنجاح، وبقية الخطوات إما لم تتم بعض وإما الخطوة الحالية..
يمكنك الاطلاع عليها عبر هذا الفيديو: أداة "تقدم الخطوات" StepsProgress Tool by Eng27

في البداية أنشئ مشروع نوافذ WinForms ثم أضف أداة UserControl:
من القائمة Project، انقر على Add User Control...، وسمها StepsProgress

انتقل لمتصفح المشروع Solution Explorer، انقر باليمين على Resources ثم Open، غير نوع البيانات من Strings إلى Images (أعلى يسار الشاشة)، ثم انقر على السهم المجاور لـ Add Resource، ثم Add Existing File...
قم بإضافة ثلاث صور تمثل الحالات الممكنة (نجاح المهمة، المهمة قيد التنفيذ، لم يتم تنفيذ المهم بعد)

انتقل للسورس كود الخاص بالأداة (انقر باليمين على الأداة ثم View Code)
أسند المكتبات التالية لمشروعك وامسح ماعداها (لا مشكلة إذا لم ترد المكتبات غير المطلوبة):

كود :

using System;
using System.ComponentModel;
using System.Drawing;
using System.Windows.Forms;

المتغيرات الخاصة بمشروعك (ضعها في مستوى توابع وإجراءات الأداة، بداخل الفئة مباشرة):

كود :

int steps, currentstep;
       int w, h;
       Image stepdone, stepcurrent, stepundone;
       Color linecolor;
       PictureBox[] pb;
       Panel p;

التابع البناء:

كود :

public StepsProgress()
       {
           InitializeComponent();

           w = 300; h = 30;
           Size = new Size(w, h);
           steps = 5;
           currentstep = 0;
           stepdone = Properties.Resources.StepDone;
           stepcurrent = Properties.Resources.StepCurrent;
           stepundone = Properties.Resources.StepUnDone;
           linecolor = Color.Black;
           CreateSteps();
       }

الإجراءات التي تحكم تصرف الأداة:

كود :

void CreateSteps()
       {
           Controls.Clear();
           pb = new PictureBox[steps];
           p = new Panel();
           int current = 0;
           for (int i = 0; i < steps; i++)
           {
               pb[i] = new PictureBox();
               pb[i].Size = new Size(h, h);
               pb[i].BackgroundImageLayout = ImageLayout.Zoom;
               pb[i].Left = current;
               current += h + (int)((w - steps * h) / (steps - 1));
               pb[i].BackgroundImage = stepundone;
               pb[i].BackColor = Color.Transparent;
               pb[i].Click += StepClick;
               pb[i].Cursor = Cursors.Hand;
               Controls.Add(pb[i]);
           }
           p.Left = (int)(h / 2);
           p.Top = (int)(h / 2);
           p.Height = 3;
           p.Width = w - (int)(h / 2);
           p.BackColor = linecolor;
           p.SendToBack();
           Controls.Add(p);

           currentstep = 0;
       }

       void RefreshSteps()
       {
           if (currentstep > 0)
           {
               Controls.Clear();
               pb = new PictureBox[steps];
               int current = 0;
               for (int i = 0; i < steps; i++)
               {
                   pb[i] = new PictureBox();
                   pb[i].Size = new Size(h, h);
                   pb[i].BackgroundImageLayout = ImageLayout.Zoom;
                   pb[i].Left = current;
                   current += h + (int)((w - steps * h) / (steps - 1));
                   if (i < currentstep - 1)
                       pb[i].BackgroundImage = stepdone;
                   if (i >= currentstep & i < steps)
                       pb[i].BackgroundImage = stepundone;
                   pb[i].Click += StepClick;
                   pb[i].Cursor = Cursors.Hand;
                   Controls.Add(pb[i]);
               }
               pb[currentstep - 1].BackgroundImage = stepcurrent;


               p = new Panel();

               p.Left = (int)(h / 2);
               p.Top = (int)(h / 2);
               p.Height = 3;
               p.Width = w - (int)(h / 2);
               p.BackColor = linecolor;
               p.SendToBack();
               Controls.Add(p);
           }
           else
               CreateSteps();
       }

       void FinishSteps()
       {

           Controls.Clear();
           pb = new PictureBox[steps];
           int current = 0;
           for (int i = 0; i < steps; i++)
           {
               pb[i] = new PictureBox();
               pb[i].Size = new Size(h, h);
               pb[i].BackgroundImageLayout = ImageLayout.Zoom;
               pb[i].Left = current;
               current += h + (int)((w - steps * h) / (steps - 1));
               pb[i].BackgroundImage = stepdone;
               pb[i].Click += StepClick;
               pb[i].Cursor = Cursors.Hand;
               Controls.Add(pb[i]);
           }

           p = new Panel();

           p.Left = (int)(h / 2);
           p.Top = (int)(h / 2);
           p.Height = 3;
           p.Width = w - (int)(h / 2);
           p.BackColor = linecolor;
           p.SendToBack();
           Controls.Add(p);
       }

الحدث الوحيد ضمن الأداة:

كود :

void StepClick(object sender, EventArgs e)
       {
           PictureBox p = (PictureBox)sender;
           CurrentStep = ((Control)p).TabIndex + 1;
       }

خصائص الأداة:

كود :

       [DefaultValue(5)]
       [System.ComponentModel.Category("Eng27 Property")]
       [System.ComponentModel.Description("The maximum steps of the control")]
       public int Steps
       {
           get { return steps; }
           set { steps = value; CreateSteps(); }
       }
       [DefaultValue(0)]
       [System.ComponentModel.Category("Eng27 Property")]
       [System.ComponentModel.Description("Current step")]
       public int CurrentStep
       {
           get { return currentstep; }
           set
           {
               if (value == 0)
               {
                   currentstep = value;
                   CreateSteps();
               }

               else if (value == steps + 1)
               {
                   currentstep = value;
                   FinishSteps();
               }

               else if (value <= steps)
               {
                   currentstep = value; RefreshSteps();
               }
           }
       }
       [System.ComponentModel.Category("Eng27 Property")]
       [System.ComponentModel.Description("The image shown when step is done")]
       public Image StepDone
       {
           get { return stepdone; }
           set { stepdone = value; RefreshSteps(); }
       }
       [System.ComponentModel.Category("Eng27 Property")]
       [System.ComponentModel.Description("The image shown when step is the current step")]
       public Image StepCurrent
       {
           get { return stepcurrent; }
           set { stepcurrent = value; RefreshSteps(); }
       }
       [System.ComponentModel.Category("Eng27 Property")]
       [System.ComponentModel.Description("The image shown when step is not done")]
       public Image StepUnDone
       {
           get { return stepundone; }
           set { stepundone = value; RefreshSteps(); }
       }

       [System.ComponentModel.Category("Eng27 Property")]
       [System.ComponentModel.Description("Color of Line between the images")]
       public Color LineColor
       {
           get { return linecolor; }
           set { linecolor = value; RefreshSteps(); }
       }

فاصل إعلاني، حملوا هذا الكتاب: C# من البداية حتى الإتقان
وهنا نصل لختام المقال.. هذه الأداة هي مثال لا أكثر، يمكنك تطويرها وتحديثها والإضافة عليها لتصبح أكثر فائدة..

والسلام عليكم

لتحميل السورس كود من هنا
لفهم هذا المقال أكثر، يمكنك مشاهدة هذا الفيديو: