دنیای باینری

در هنگام کار با ویژوال استودیو و کنترل های آماده موجود در آن٬ پیش می آید که کنترل ها انتظارات را برآورده نکنند. اولین گزینه برای بسیاری از افراد استفاده از کامپوننت های شرکت ثالث (Third party Components) می باشد. اما به دلایلی مانند خریداری این کاموننت ها و یا باز هم برآورده نکردن انتظارات باید دست به ساخت یک کنترل جدید زد.
کنترل های جدیدی که ساخته می شوند بر ۲ گونه اند:
۱- User control که بر پایه کنترل های موجود ساخته می شوند و ساخت آن ها بسیار ساده می باشد که این نوشته به روش ساخت این گونه می پردازد.
۲- Custom control که تمامی کدهای آن ها از ابتدا نوشته می شود و نیاز به تعریف توابع متعدد و تعریف چگونگی رندر کنترل است.
User controlها از کلاس UserControl خصوصیات خود را به ارث می برند که این کلاس نیز خود از کلاس Control مشتق شده که کنترل های دیگر از این کلاس استفاده می کنند. در هنگام ساخت یک User control به تمام properties و متدهای کامپوننت هایی که در User control خود استفاده کرده اید٬ دسترسی ندارید و فقط properties و متدهای کلاس UserControl در اختیار شما قرار می گیرد. اما می توان properties و متدهایی را تعریف کرد که با کامپوننت های استفاده شده٬ در ارتباط باشند.
برای درک بهتر از ساخت User Control یک EditableLabel را می سازیم. روش کار این کنترل به این صورت هست که در ابتدا مانند یک لیبل است ولی در صورت اینکه بر روی آن دبل کلیک شود تبدیل به تکست باکس می شود و متن لیبل را دارد. می توان متن تکست باکس را ویرایش کرد و در صورت فشار دکمه Enter کنترل دوباره تبدیل به یک لیبل با متن ویرایش شده می شود.
ویژوال استودیو را باز کنید و یک پروژه جدید ایجاد کنید. قالب Windows Forms Control Library را انتخاب کنید.

در ابتدا با کادری مانند زیر مواجه می شوید:

این کادر مانند پنجره ویندوزی است که TitleBar و Border نداشته باشد. از این به بعد هر کنترلی را که به این کادر اضافه کنید جزئی از User control است. بر روی کادر کلیک کنید و خاصیت Name آن را به EditableLabel و خاصیت AutoSize را به True تغییر دهید. یک لیبل به کادر اضافه کنید و مقدار خاصیت Text آن را به Label و خاصیت Neme آن را به labelDisplay تغییر دهید. اندازه کادر را برابر اندازه لیبل قرار دهید. مانند تصویر زیر:

اضافه کردن Properties
در هنگام ساهت یک کنترل٬ فقط دارای خواص و متدی است که کلاس UserControl ارائه می کند. این عبارت به این معناست که نمی توان به خواص و متد کنترل های موجود در کنترل در دست ساخت٬ مانند Label موجود در کنترل مورد نظر ما دسترسی پیدا کرد. اگرچه کلاس UserControl دارای خاصیت text است که از کلاس Control به ارث می برد٬ اما ما نیاز به توابع بیشتری برای کار با متن لیبل داریم. برای اضافه کردن خاصیت به کنترل٬ نیاز به ایجاد آن خاصیت در کلاس کنترل داریم. به ویراشگر کد بروید و در داخل کلاس کنترل کد زیر را وارد کنید:

[Browsable(true)]
[DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
public override string Text
{
    get { return labelDisplay.Text; }
    set { labelDisplay.Text = value; }
}

یه ۲ خاصیت بالای property دقت کنید. Browsable به خاصیت امکان می دهد تا در پنجره Properties Window ویژوال استودیو نشان داده شود. DesignerSerializationVisibility نیز این امکان را می دهد تا خواص کنترل را با استفاده از تغییر در پنجره Properties Window ویژوال استودیو تغییر داد. در کدها از override نیز استفاده می کنیم چون خاصیت Text در کنترل مورد نظر نیز هست.

اضافه کردن Event ها
حال زمان اضافه کردن رخداد ها به کنترل می باشد. در توضیحات کنترل گفتم که قرار است که با دبل کلیک بر روی لیبل٬ لیبل تبدیل به تکست باکس شود. پس نیاز به تعریف رخداد DoubleClick برای کنترل هستیم. چون فقط یک کنترل داخل کادر داریم لیبل را انتخاب کنید و به Properties Window بروید و سپس در بخش Events بر روی رخداد DoubleClick دبل کلیک کنید. با این کار یک رخداد برای DoubleClick بوجود می آید.

ما نیاز به اضافه کردن یک کنترل TextBox به کنترل خود داریم. پس در کلاس EditableLabel کد زیر را وارد کنید:

private TextBox editableTextBox;

حالا در تابع سازنده EditableLabel و بعد از متد InitializeComponent کدهای زیر را وارد کنید:

editableTextBox = new TextBox();
this.Controls.Add(editableTextBox);
editableTextBox.Hide(); 

با کدهای بالا تکست باکس را به مجموعه کنترل های کنترل خود اضافه کردیم. برای اینکه در ابتدا لیبل نمایش داده شود و تکست باکس مخفی باشد از متد Hide استفاده کردیم.
حال کد های زیر را به رخداد DoubleClick لیبل اضافه کنید:

private void labelDisplay_DoubleClick(object sender, EventArgs e)
{
    editableTextBox.Size = this.Size;
    editableTextBox.Text = labelDisplay.Text;
    labelDisplay.Hide();
    editableTextBox.Show();
    editableTextBox.Focus();
}

در رخداد بالا اندازه تکست باکس برابر با اندازه کنترل شد. سپس متن آن نیز برابر متن موجود در لیبل قرار گرفت و با استفاده از متد Hide لیبل پنهان شد. در آخر نیز بر روی تکست باکس فوکوس شد تا کاربر بتواند آن را ویرایش کند.
بعد از اینکه کاربر متن تکست باکس را ویرایش کرد نیاز به متدی است که بتوان تغییرات را ثبت کرد. پس تابع سازنده کلاس EditableLabel را به صورت زیر تغییر دهید.

public EditableLabel()
{
    InitializeComponent();

    editableTextBox = new TextBox();
    this.Controls.Add(editableTextBox);
    editableTextBox.KeyDown += new KeyEventHandler(editableTextBox_KeyDown);
    editableTextBox.Hide();
}

به وسیله تغییرات بالا (خط ۷) رخداد KeyDown تکست باکس تعریف شد. کاربر پس از ویرایش متن تکست باکس دکمه Enter را می زند. رخداد KeyDown تکست باکس به شرح زیر است:

void editableTextBox_KeyDown(object sender, KeyEventArgs e)
{
    if (e.KeyCode == Keys.Enter)
    {
        labelDisplay.Text = editableTextBox.Text;
        editableTextBox.Hide();
        labelDisplay.Show();
    }
}

در رخداد KeyDown تکست باکس ابتدا چک می کنیم که کاربر دکمه Enter را زده است یا نه. سپس متن لیبل را برابر با متن کنونی تکست باکس قرار می دهیم. تکست باکس را مخفی و لیبل را نمایش می دهیم. حالا لیبل دارای متن جدید و تغییر یافته تکست باکس است.
وقتی لیبل اندازه اش تغییر می کند٬ کنترل نیز باید اندازه اش برابر اندازه لیبل شود. در قسمت رخداد های مربوط به لیبل بر روی رخداد Resize لیبل دبل کلیک کنید تا رخداد ساخته شود و مانند زیر آن را کامل کنید:

private void labelDisplay_Resize(object sender, EventArgs e)
{
    this.Size = labelDisplay.Size;
}

بخش اول این نوشته تمام شد. در بخش بعد به استفاده از کنترل ساخته شده در پروژه ها و تست آن پرداخته می شود.

نوشته های مرتبط

1. ساخت پیشنهاد دهنده کلمات در سی شارپ
2. رخدادهای موس در سی شارپ
3. کار با فونت ها در سی شارپ
4. کنترل Timer
5. رخدادهای کیبورد
6. ویرایش دیتابیس با LINQ to SQL بخش اول
7. Media Player ساده در سی شارپ