كيفية إجراء عملية السحب والإفلات Drag And Drop!!

هل تعلم ان في هذه المقالة سوف نتناول ليس طعاما وانما موضوعا هاما، ألا هو إمكانية السحب والافلات في الادوات، ربما لم تفهم شيئا لذلك دعني أطرح عليك السؤال التالي:

اريد تصميم واجهة تحتوي على قائمة ببعض الاسماء (ربما الاصدقاء أو ما شابه)، وايضا إمكانية كتابة نص ما!! 

06.jpg

 

 اي بمعنى آخر اريد ListBox كما قلت تحتوي على قائمة من اسماء الاصدقاء وايضا الاداة RichTextBox التي تسمح لي بكتابة نص معين، والان كل ما اريده أن أقوم بسحب أحد الاسماء من ListBox ووضعه في RichTextBox، ولتحقيق ذلك فنحن نحتاج إلى ما يعرف بتقنية Drag And Drop.

دعنا من خلال تنفيذ المثال السابق ذكره التعرف على سهولة تحقيق ذلك، بعد أن تقوم بإنشاء مشروع جديد من نوع Windows Application وضع العناصر السالف ذكرها لتصبح الفورم على الشكل التالي:

6.jpg

والان  قم من خلال الحدث Load الخاصة بالفورم بإضافة بعض اسماء اصدقاءك، و من خلال نفس الحدث أعطي الخاصة AllowDrop الخاصة بالاداة richTextBox1   القيمة true ليصبح الكود على الشكل التالي: مثلا:

private void Form1_Load(object sender, EventArgs e)
{
    richTextBox1.AllowDrop =
true;

   
listBox1.Items.Add(
“Abdulkarim Kanaan”);
    listBox1.Items.Add(“Fadi”);
    listBox1.Items.Add(“Rami”);
    listBox1.Items.Add(“Turki”);
    listBox1.Items.Add(“Ismaeel”);
}
 

والان بعد ذلك اختر الحدث MouseDown الخاص بالاداة listBox1، وقم بكتابة ما يلي:

private void listBox1_MouseDown(object sender,
    MouseEventArgs e)
{
    listBox1.DoDragDrop(listBox1.SelectedItem,
        DragDropEffects.All);
}

حيث قمنا باستدعاء التابع DoDragDrop التابع للاداة listBox1، مع تحديد القيمة التي اجرينا عليها عملية السحب، بالاضافة إلى نوع عملية السحب هل هي عملية نقل Move أم نسخ Copy أم كافة العمليات All، طبعا هنا يظهر من الكود اننا قد اخترنا عملية النسخ Copy.والان هناك حدثان هامان للاداة richTextBox1 سوف نقوم باستخدامهما والا وهما DragEnter و DragDrop.حيث ان الحدث DragEnter: يقع عندما عندما يدخل مؤشر الفارة إلى الاداة richTextBox1 طبعا بعد إجراء عملية السحب
أما الحدث الثاني
DragDrop: يقع هذا الحدث عندما نقوم بعملية الافلات على العنصر richTextBox1.
الكود التالي من اجل الحث
DragEnter:

void richTextBox1_DragEnter(object sender,
     DragEventArgs e)
{
    if (e.Data.GetDataPresent(DataFormats.Text))
    {
        e.Effect = DragDropEffects.Copy;
    }
    else
    {
        e.Effect = DragDropEffects.None;
    }
}

طبعا من خلال التابع GetDataPresent يمكننا من فحص نوع البيانات المسحوبه هل هي نص أم صورة أم ….
اما الكود المطبق على الحدث
DragDrop فهو:

void richTextBox1_DragDrop(object sender,
     DragEventArgs e)
{
    int i;
    String s;
 
    // Get start position to drop the text.
    i = richTextBox1.SelectionStart;
    s = richTextBox1.Text.Substring(i);
 
  
richTextBox1.Text =
       richTextBox1.Text.Substring(0, i);
 
    // Drop the text on to the RichTextBox.
    richTextBox1.Text = richTextBox1.Text +
        e.Data.GetData(DataFormats.Text).ToString();
 
    richTextBox1.Text = richTextBox1.Text + s;
}

طبعا ما فعلناه هنا عمايات بسيطة من اجل كتابة ما تم افلاته في المكان المحدد من النص أي ما قمنا به في المختصر المفيد هو عملية حشر الاسم المسحوب من قائمة الاسماء في المكان المجدد من النص الموجود داخل الاداة richTextBox1.طبعا بقي شيء واحد واخير أحب التنويه علي أن الاحداث آنفة الذكر DragEnter و DragEnter لن تظهر لك في قائمة أحدث الاداة richTextBox1، لذلك يجب عليك كتابتها يدويا وسوف أقوم بكتابتها في الحدث الخاص بالفورم ليصبح الكود السابق على النحو التالي:

private void Form1_Load(object sender, EventArgs e)
{
    richTextBox1.AllowDrop = true;
 
    listBox1.Items.Add(“Abdulkarim Kanaan”);
    listBox1.Items.Add(“Fadi”);
    listBox1.Items.Add(“Rami”);
    listBox1.Items.Add(“Turki”);
    listBox1.Items.Add(“Ismaeel”);
 
    richTextBox1.DragEnter += new
        DragEventHandler(richTextBox1_DragEnter);
    richTextBox1.DragDrop += new
        DragEventHandler(richTextBox1_DragDrop);
} 

 ملاحظة: أثناء عملية السحب لا تنسى أن تضغط على زر Ctrl لأننا حددنا DragDropEffected.Copy.

 رابط تحميل: http://www.eclasshome.com/attach/upload3/wh_55529785.zip

 ————————————————————–

مثال آخر:

إنشاء برنامج يمكنك من فتح الملفات النصية من خلال السحب والافلات:

انشىء برنامج جديد Windows Application، اضف الاداة RichTextBox، أضف في الحدث Load للفورم الكود التالي:

 private void Form1_Load(object sender, EventArgs e)
{
    richTextBox1.AllowDrop = true;
 
    richTextBox1.DragEnter += new
        DragEventHandler(richTextBox1_DragEnter);
    richTextBox1.DragDrop += new
        DragEventHandler(richTextBox1_DragDrop);
}

 والان بعدها اكتب الكود التالي للحدث DragEnter على النحو التالي:

 void richTextBox1_DragEnter(object sender, DragEventArgs e)
{
    if ((e.Data.GetDataPresent(DataFormats.FileDrop)) &&
       (System.IO.Path.GetExtension(
      ((string[])e.Data.GetData(DataFormats.FileDrop))[0])
        == “.txt”))
    {
        e.Effect = DragDropEffects.Copy;
    }
    else
    {
        e.Effect = DragDropEffects.None;
    }
}

 طبعا في الكود التالي تحققت أن الكائن المسحوب وهو ملف من خلال DataFormat.FileDrop واخذت مسر الملف من خلال:

 ((string[])e.Data.GetData(DataFormats.FileDrop))[0];

 أما كود الحدث DragDrop هو التالي:

 void richTextBox1_DragDrop(object sender, DragEventArgs e)
{
    string fileName =
    ((string[])e.Data.GetData(DataFormats.FileDrop))[0];
 
    richTextBox1.Text =
        System.IO.File.ReadAllText(fileName);
}  

رابط التحميل: http://www.eclasshome.com/attach/upload3/wh_41223144.zip

أضف تعليقاً

إملأ الحقول أدناه بالمعلومات المناسبة أو إضغط على إحدى الأيقونات لتسجيل الدخول:

WordPress.com Logo

أنت تعلق بإستخدام حساب WordPress.com. تسجيل خروج   / تغيير )

صورة تويتر

أنت تعلق بإستخدام حساب Twitter. تسجيل خروج   / تغيير )

Facebook photo

أنت تعلق بإستخدام حساب Facebook. تسجيل خروج   / تغيير )

Google+ photo

أنت تعلق بإستخدام حساب Google+. تسجيل خروج   / تغيير )

Connecting to %s