تعرف على الأداة TableLayoutPanelفي الفجول بيسك

[الناشر]

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

http://kanaan85.files.wordpress.com/2008/02/16.jpg
*

دعنا ندع الحديث جانبا ونبدأ سوية بالتعرف على هذه الاداة، طبعا في بادئ الأمر بعد أن تقوم بإنشاء مشروع من نوع WindowsApplication ، نذهب إلى الفورم ونختار الاداة من شريط الادوات التي تحمل الاسم المذكور سابقا TableLayoutPanel *لتظهر لنا الفورم على الشكل التالي:



http://kanaan85.files.wordpress.com/2008/02/12.jpg



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



http://kanaan85.files.wordpress.com/2008/02/13.jpg
قد قمت بوضع زرين أحدهما في الخلية الاول من السطر الاول ولاخر في الخلية الاولى من السطر الثانيوهنا تجد الاشارة إلى أنه لا يمكنك وضع أكثر من عنصر واحد في الخلية الواحدة، ولكنك إن كنت تريد فعل ذلك فبكل بساطة يمكن وضع أحد أدوات الاحتواء مثل Panel و FlowLayoutPanel أو حتى TableLayoutPanel داخل خلية ما، ثم قم بما يتوجب عليك القيام به.أما إذا اردت اضافة العناصر من خلال الكود فيمكنك ذلك بكل بساطة، دعنا نستخدم الحدث Load للقيام بذلك، واضف الشيفرة التالية:


private void Form1_Load(object sender, EventArgs e)
{
*** Button btn = new Button();
*** btn.Text = “Test”;
*
*** tableLayoutPanel1.Controls.Add(btn, 2, 1);
}


قم بتشغيل البرنامج ولاحظ الشكل التالي:



http://kanaan85.files.wordpress.com/2008/02/14.jpg
هل لاحظت الزر المكتوب عليه Test، ولان لتعد إلى الشيفرة السابقة ولتأملها سوية:


Button btn = new Button();
btn.Text = “Test”;


*إذا من خلال السطرين السابقين قمنا بتعريف أو التصريح عن زر جديد واعطينا الخاصية Text له القيمة Test، هذا جميل، والان لنكمل ما تبقى من الشيفرة:



tableLayoutPanel1.Controls.Add(btn, 2, 1);


لقد استخدمنا التابع Add التابع للخاصة Controls، واعطناه الاداة التي نرغب بإضافتها بالاضافة إلى مكان توضع الاداة وهي في العمود الثاني من السطر الثاني مع الملاحظة إلى أن ترقيم الاسطر يبدأ من الصفر وترقيم الاعمدة يبدأ من الواحد.والان بقي شيء أخير أنه في حال رغبتنا في جعل العنصر (الزر) الأول button1 يحتل مساحة العمودين من السطر الأول، دعنا نقم بذلك سوية، حتى نلاحظ عمليات التغير التي ستطرأ على الزر دعنا نضبط الخاصية Dock للزر button1 إلى Fill ليصبح شكل الفورم على النحو التالي:



http://kanaan85.files.wordpress.com/2008/02/15.jpg


والان كل ما عليك أن تقوم بما يلي إذهب إلى الخاصية ColumnSpan الخاصة بالزر button1 وغير قيمتها من 1 إلى 2 وهي تمثل عدد الاعمدة التي تريد ان يمتد الزر فيها، لتصبح الفورم على النحو التالي:



http://kanaan85.files.wordpress.com/2008/02/16.jpg
وهناك خاصية مقابلة للأسطر وهي RowSpanشيئ أخير إذا اردت إضافة سطر أو عمود جديدين بشكل سريع ما عليك سوى الذهاب إلى Smart Tag الموضحة بالشكل التالي:



http://kanaan85.files.wordpress.com/2008/02/17.jpg





يمكنك تحميل المثال من الرابط التالي: http://www.eclasshome.com/attach/upload3/wh_38264160.zip



http://feeds.wordpress.com/1.0/categories/kanaan85.wordpress.com/30/ http://feeds.wordpress.com/1.0/tags/kanaan85.wordpress.com/30/ http://feeds.wordpress.com/1.0/delicious/kanaan85.wordpress.com/30/ (http://feeds.wordpress.com/1.0/godelicious/kanaan85.wordpress.com/30/) http://feeds.wordpress.com/1.0/stumble/kanaan85.wordpress.com/30/ (http://feeds.wordpress.com/1.0/gostumble/kanaan85.wordpress.com/30/) http://feeds.wordpress.com/1.0/digg/kanaan85.wordpress.com/30/ (http://feeds.wordpress.com/1.0/godigg/kanaan85.wordpress.com/30/) http://feeds.wordpress.com/1.0/reddit/kanaan85.wordpress.com/30/ (http://feeds.wordpress.com/1.0/goreddit/kanaan85.wordpress.com/30/) http://stats.wordpress.com/b.gif?host=kanaan85.wordpress.com&blog=2943185&post=30&subd=kanaan85&ref=&feed=1

منقول... (http://kanaan85.wordpress.com/2008/02/27/usinglablelayoutpanel/)