آموزش WPF از مقدماتي تا پيشرفته

در اين بخش مي‌توانيد در مباحث مربوط به زبان هاي برنامه نويسي تحت دات نت به بحث بپردازيد

مدیران انجمن: abbas.m.k, athlon64x2, شوراي نظارت

Captain I
Captain I
نمایه کاربر
پست: 433
تاریخ عضویت: یک‌شنبه ۱۲ اردیبهشت ۱۳۸۹, ۱:۴۸ ب.ظ
سپاس‌های ارسالی: 733 بار
سپاس‌های دریافتی: 1344 بار

بخش چهارم: Content Controls ( کنترل های محتوا) ( قسمت سوم)

پست توسط abbas.m.k »

کنترل های محتوا با خواص ویژه :
همانطور که پیش تر نیز اشاره کردم، در WPF کنترل های بسیاری وجود دارد که علاوه بر قابلیت محتوایی بودن، دارای یک سری خواص کاربردی دیگری می باشند که می توانند محتویات خودشان را به خوبی مدیریت کنند. تعدادی از این کنترل ها که در ادامه به آن ها خواهم پرداخت، عبارتند از :

کنترل ScrollViewer :

این کنترل امکاناتی را در اختیار شما قرار می دهد که بتوانید با آن ها، محتوبات این کنترل را مدیریت کنید. چنانچه محتویات داخلی این کنترل از مقدار فضای موجود بر روی ان بیشتر باشد، کنترل به صورت اتوماتیک Scroll پیدا کرده تا بتواند همه محتویات خود را به خوبی در بر گیرد.

کنترل GroupBox :
با این کنترل آشنا هستید، این کنترل برای گروه بندی تعدادی از کنترل ها به کار می رود، که نسبت به نسخه 2.0 خود دارابی امکانات بیستری می باشد،که در ادامه بیشتر با این کنترل آشنا خواهید شد.

کنترل TabControl :
نمونه این کنترل نیز در نسخه 2.0 دات نت فریم ورک وجود دارد. در اینجا قابلیت های بسیاری به این کنترل اضافه شده است که در جای خود، توضیح داده خواهند شد.

کنترل Expander :
این کنترل، همواره یکی از کنترل هایی بوده است که برنامه نویسیان علاقه زیادی به استفاده از آن دارند. این کنترل در دات نت فریم ورک 2.0 و نسخه های قبل از آن وجود نداشت و برنامه نویسان یا اقدام به نوشتن این کنترل می کردند و یا از کنترل های نوشته شده توسط اشخاص ثالث استفاده می کرند. نمونه این کنترل در ویندوز بسیار استفاده شده است.

حال، در ادامه به توضیح هر یک از این کنترل ها با ذکر مثال هایی در مورد هر یک خواهیم پرداخت:

کنترل ScrollViewer :
همانطور که در بخش قبلی ملاحظه کردید، تعدادی کنترل را به عنوان محتوای کنترل Button قرار دادیم. حال اگر تعداد این کنترل ها، زیاد شود و کنترل Button فضای لازم را برای آن ها نداشته باشد، نمی تواند همه محتویات خود را به درستی نشان دهد.

در این مواقغ از کنترل دیگری به نام کنترل ScrollViewer استفاده می کنیم. این کنترل می توان با هر عنصری به کار رود. زمانی که محتویات این کنترل از فضای موجود، بیشتر شود، این کنترل به صورت اتوماتیک ، محتویات خود را قابل پیمایش کرده و کاربر می تواند با اسکرول کردن، به تمامی محتویات درون کنترل مورد نظر دسترسی داشته باشد.

به قطعه کد زیر که اصلاح شده تکه کد قبل می باشد توجه کنید:

Please Login or Register to see this code
این مثال، مانند مثال قبلی می باشد با این تقاوت که کنترل های بیشتری درون محتوای کنترل Button قرار گرفته اند. علاوه بر این، تمامی محتویات کنترل Button درون کنترل دیگری به نام ScrollViewer قرار گرفته است.
چنانچه فضای لازم برای نمایش تمامی محتویات کنترل Button موجود باشد، کنترل ScrollViewer غیر فعال می شود و زمانی که فضای لازم برای نمایش کنترل های درونی کنترل Button مجود نباشد، کنترل ScrollViewer به صورت اتوماتیک فعال شده تا بتواند تمامی محتویات کنترل Button را نمایش دهد.
این کنترل بسیار پر کاربرد می باشد. به این دلیل که علاوه بر اینکه غیر وابستگی برنامه شما به رزولوشن صفحه نمایش حفظ می گردد، باعث می شود که بتوانید تعداد بسیاری از کنترل ها را درون یک کنترل محتوایی قرار دهید.
نتیجه حاصل از اجرای مثال فوق را در شکل زیر مشاهده می کنید :

تصویر

نکته :
توسط دو خاصیت HorizontalScrollBarVisibility و VerticalScrollBarVisibility می توانید کنترل بیشتری بر روی عملکرد کنترل ScrollViewer داشته باشید. هر یک از این خواص دارای چهار مقدار می باشند که در زیر به توضیح هریک خواهیم پرداخت :

1-مقدار Auto : این مقدار باعث می شود که نوار های اسکرول ( برای هر کدام که تنظیم شده باشد) در حالتی که غیر فعال هستند، نشان داده نشوند.

2-مقدار Disabled : این مقدار باعث می شود که نوار های اسکرول همیشه در حالت غیر فعال باشند.

3-مقدار Hidden : این مقدار باعث می شود که نوار های اسکرول ( برای هر کدام که تنظیم شده باشد) مخفی باشند. در این حالت می توانید عمل اسکرول را با کلید های جهت نما انجام دهید و یا با کلید Tab بین کنترل ها حرکت کنید که در این صورت زمانی که به کنترلی می رسید که در محدوده فضایی کنترل مورد نظر ( در مثال قبلی Button ) نیست، عمل اسکرول به صورت اتوماتیک انجام می شود.

4-مقدار Visible : این گزینه که مقدار پیش فرض برای هر دوخاصیت نیز می باشد، در زمانی که اسکرول در حالت غیر فعال می باشد، همچنان به صورت Visible هستند و کاربر می تواند آن ها را مشاهده نماید.
[HIGHLIGHT=#1F497D] بهترين مترجم كيست كه سكوت را ترجمه كند.  
Captain I
Captain I
نمایه کاربر
پست: 433
تاریخ عضویت: یک‌شنبه ۱۲ اردیبهشت ۱۳۸۹, ۱:۴۸ ب.ظ
سپاس‌های ارسالی: 733 بار
سپاس‌های دریافتی: 1344 بار

بخش چهارم: Content Controls ( کنترل های محتوا) ( قسمت چهارم)

پست توسط abbas.m.k »

ادامه کنترل Scroll Viewer

کنترل اسکرول با برنامه نویسی :
همانطور که در بخش قبل دیدیدريال می توانستید با موس و یا با کنترل های جهت نما، کنترل اسکرول خود را مدیریت کنید.
در این بخش با توابعی آشنا خواهید شد که می توانید توسط آن ها کنترل ScrollViewer را در زمان اجرای برنامه و با کد نویسی مدیریت نمایید.


نکته :
این توابع هر کدام دارای دو نسخه می باشند، یکی برای اسکرول عمودی و دیگری برای اسکرول افقی. در اینجا توابع مربوط به اسکرول عمودی و عملکرد آن ها را خواهیم دید و در مورد توابع مروبط به اسکرول افقی تنها نام آن ها ذکر می گردند. چون عملکرد آن ها دقیقا مشابه عملکر نسخه خود برای اسکرول عمودی هستند.

متد LineUp() :

عملکر این متد مانند کلیک کردن بر روی علامت جهت نمای بالایی اسکرول عمودی می باشد. پس میزان جا بجایی که توسط این متد انجام می گیرید بستگی به میزان جابجایی توسط علامت جهت نمای بالایی دارد.
معادل این متد برای نوار اسکرول افقی ، متد LineLeft می باشد.

متد LineDown() :
عملکر این متد مانند کلیک کردن بر روی علامت جهت نمای پایینی اسکرول عمودی می باشد. پس میزان جا بجایی که توسط این متد انجام می گیرید بستگی به میزان جابجایی توسط علامت جهت نمای بالایی دارد.
معادل این متد برای نوار اسکرول افقی ، متد LineRight می باشد


متد PageUp :

عملکر این متد مانند کلیک کردن بر روی فاصله بین علامت جهت نمای بالایی و دستگیره اسکرول در اسکرول عمودی می باشد.
معادل این متد برای نوار اسکرول افقی ، متد PageLeft می باشد

متد PageDown : عملکر این متد مانند کلیک کردن بر روی فاصله بین علامت جهت نمای پایینی و دستگیره اسکرول در اسکرول عمودی می باشد.
معادل این متد برای نوار اسکرول افقی ، متد PageRight می باشد

متد ScrollToHome :

این متد اسکرول را به پایین ترین قسمت ممکن انتقال می دهد.
معادل این متد برای نوار اسکرول افقی ، ScrollToLeftEnd می باشد.

متد ScrollToEnd :

این متد اسکرول را به بالاترین قسمت ممکن انتقال می دهد.
معادل این متد برای نوار اسکرول افقی ، متد ScrollToRightEnd می باشد.

متد ScrollToVerticalOffset :
این متد بر اساس مقداری که به عنوان آرگومان می گیرد عمل اسکرول را انجام می دهد.
معادل این متد برای نوار اسکرول افقی؛ متد ScrollToHorizontalOffset می باشد


قطعه کد زیر نحوه استفاده از این متد ها را نشان می دهد :

Please Login or Register to see this code

در قطعه کد فوق، دکمه هایی برای کنترل متد ها برای اسکرول عمودی و نیز دکمه هایی برای کنترل متد ها در اسکرول افقی بر روی دو کنترل WrapPanel قرار گرفته اند. در این مثال نحوه به کارگیری کنترل های کانتینر جهت چیدمان عناصر WPF به خوبی مشخص است.

شکل زیر، نتیجه حاصل از اجرای کدهای فوق را نشان می دهد:

تصویر
[HIGHLIGHT=#1F497D] بهترين مترجم كيست كه سكوت را ترجمه كند.  
Captain I
Captain I
نمایه کاربر
پست: 433
تاریخ عضویت: یک‌شنبه ۱۲ اردیبهشت ۱۳۸۹, ۱:۴۸ ب.ظ
سپاس‌های ارسالی: 733 بار
سپاس‌های دریافتی: 1344 بار

بخش چهارم: Content Controls ( کنترل های محتوا) ( قسمت پنجم)

پست توسط abbas.m.k »

کنترل GroupBox :
همانطور که گفته شد، بعضی از کنترل های محتوا دارای دو بخش برای قرار دادن کنترل ها به عنوان محتوای خود دارند. یکی از این بخش ها همانطور که در کنترل های قبل نیز دیدید، خاصیت Content می باشد. دیگر خاصیتی که می تواند به عنوان محتوا به کار برود و فقط تعدادی ازکنترل ها دارای این خاصیت می باشند، خاصیت Header می باشد. ه این نوع کنترل ها اصطلاحا کنترل های HeaderedContentControls می گویند.
کنترل هایی که از این دسته می باشند و در این بخش بررسی آن ها خواهیم پرداخت، عبارتند از کنترل GroupBox ، آبجکت TabItem از کنترل TabControl و کنترل Expander که کنترل جدیدی در ویژوال استودیو 2008 می باشد.

ساده ترین کنترل بین این سه کنترل، کنترل GroupBox می باشد. همانطور که از نام این کنترل مشخص است این کنترل برای گروه بندی دسته ای از کنترل ها به کار می رود. یکی از کاربرد های موثر این کنترل در زمان استفاده از عناصر RadioButton در برنامه می باشد.

از RadioButton ها که به دکمه های رادیویی نیز معروف می باشند، زمانی استفاده می شود که کاربر مجاز به انتخاب تنها یک آیتم از بین چندین آیتم مختلف باشد. به عنوان مثال در فرمی از برنامه کاربر می خواهد که جنسیت خود را مشخص کند، در این حالت از دو دکمه رادیویی ، یکی برای زن و دیگری برای آیتم مرد استفاده خواهیم کرد. حال اگر این دکمه ها در قالب یک گروه مشخص نشوند، کاربر می تواند هر دو این دکمه ها را انتخاب کند ( به اصطلاح تیک بزند) که خلاف منطق برنامه نویسی می باشد. در این زمان این دو دکمه را در قالب یک گروه معرفی می کنیم. از این پس برنامه به صورت اتوماتیک اجازه انتخاب فقط یکی از این دو دکمه را در هر لحظه به کاربر می دهد.

به قعطه کد زیر توجه فرمایید:

Please Login or Register to see this code

در کد فوق، برای گرید اصلی پنجره دو سطر تعریف شده است. یکی از GroupBox ها در سط اول یا سطر شماره 0 و دیگری درون سطر شماره 1 از کنترل گرید قرار گرفته است. هر کنترل GroupBox دارای 4 دکمه رادیویی می باشد.همچنین در کنترل های GroupBox از کنترل StackPanel نیز برای چیدمان بهتر دکمه های رادیویی استفاده شده است.
همانطور که در شکل می بینید، دکمه های رادیویی در هر گروه از دکمه های رادیویی گروه دیگر کاملا مجزا می باشند و انتخاب شدن و تیک خوردن آن ها تاثیری بر یکدیگر ندارد. ولی در هر گروه تنها می توانید یک دکمه رادیویی را انتخاب نمایید.
نتیجه اجرای کد های فوق را در شکل زیر مشاهده می کنید :

تصویر

خاصیت Groupname :
این خاصیت مربوط به کنترل GroupBox نمی باشد و مربوط به کنترل های رادیوی می باشد. ولی چون از این دکمه ها در این مثال استفاده کردیم، این خاصیت را در اینجا توضیح میدهم.
در بعضی از موارد ممکن است حالتی پیش آید که بخواهید کنترل ها را در GroupBox های مختلف ولی در قالب یک گروه سازماندهی کنید. در این حالت نیز کاربر بایستی در هر لحظه فقط انتخاب یکی از آیتم ها را داشته باشد. اگر چه این آیتم ها در GroupBox های مختلفی چیده شده باشند. در این حالت از خاصیت GroupName مربوط به دکمه های رادیوی استفاده می کنیم. حال به کد زیر که تغییر کرده کد فوق می باشد، دقت کنید:

Please Login or Register to see this code

در کد فوق، خاصیت GroupName همه دکمه های رادیویی با یک اسم یکسان مشخص شده اند. این عمل با عث می شود که هر دو یا چند دکمه رادیویی که دارای مقدار یکسان در خاصیت GroupName می باشند به عنوان یک گروه
مشخص شوند. همانطور که در شکل زیر مشاهده می کنید

تصویر

اگر چه دارای دو کنترل GroupBox جدا هستیم، و کنترل های رادیویی در دو GroupBox مختلف چیده شده اند، ولی چون خاصیت GroupName همه ان ها دارای یک مقدار مشخص می باشند، در هر لحظه تنها می توانید یکی از هشت دکمه رادیویی فوق را انتخاب نمایید.

نکته :
در به کارگیری خاصیت GroupName محتاط باشید!!! در به کار گیری خاصیت GroupName به این نکته دقت داشته باشید، که تنها ئکمه هایی که دارای مقدار یکسان برای این خاصیت باشند، به عنوان یک گروه تلقی می شوند. به عنوان مثال اگر تنها دو دکمه از هشت دکمه رادیویی بالا (یکی در GroupBox1 و دیگری در GroupBox2 )را با خاصیت GroupName داده شده، مقدار دهی کنید، تنها همین دو دکمه به عنوان یک گروه مشخص می
شوند و کاربر می تواند همزمان دو دکمه را در GroupBox1 و یا دو دکمه را در GroupBox2 انتخاب نماید.
**
هدر های پیشرفته در کنترل GroupBox :
همانطور که اشاره شد، کنترل GroupBox از ان دسته کنترل های محتوایی است که دارای یک بخش به نام header می باشد. این بخش که با خاصیت Header مشخص می شود، می توانند مانند خاصیت Content دارای یک عنصر باشد. حال این عنصر می تواند یک متن ساده باشد و یا می تواند یک کنترل کانتینر باشد که خود شامل چندین کنترل فرزند می باشد.

شکل ساده خاصیت Header در کنترل GroupBox همانی است که در مثال قبل دیدید. یعنی قرار دادن تنها یک متن ساده به عنوان هدر کنترل GroupBox .

اما در WPF می توانید با کمی به کار گیری ذوق و سلیقه و با به کار گیری کنترل های کانتینر که همانطور که گفتم از اساسی ترین مباحث WPF می باشند و در بخش قبلی به صورت کامل با آن ها آشنا شدید، کنترل های GroupBox سفارشی زیبایی
بسازید و دیگر نیاز مند کنترل های نوشته شده توسط شرکت و یا اشخاص ثالث نباشید.
به عنوان مثال به نمونه کد زیر دقت کنید :

Please Login or Register to see this code

قبل از توضیحات مربوط به کد فوق، نتیجه حاصل از اجرای آن را در شکل زیر با هم مشاهده می کنیم
تصویر

همانطور که در شکل فوق مشاهده می کنید، دو کنترل GroupBox سفارشی برای امتیاز ها و کشور ها ایجاد شده است. همانطور که می بینید، هدر کنترل های GroupBox از حالت متنی خارج شده است.
در کد فوق، خاصیت Header هر یک GroupBox ها به صورت زیر تعریف شده است:


Please Login or Register to see this code

دلیل اینکه خاصیت Header به صورت فوق تعریف شده است، این است که می خواهیم درون این خاصیت عکس و متن را در کنار یکدیگر قرار دهیم و یک هدر سفارشی برای آن ایجاد نماییم.
قبلا نیز اشاره کرده بودم که در زمانی که می خواهیم از مقادیر پیچیده و پیشرفته ای برای یک خاصیت استفاده کنیم بایستی آن ها را از حالت Attribute خارج کنیم و به شکل خود عناصر تعریف نماییم.
حال می توانیم درون خاصیت Header یک کنترل کانتینر ( متناسب با نیاز) تعریف کنیم و کنترل های خود را درون ان قرار دهیم. به عنوان مثال، در مثال قبل، در خاصیت Header هر یک از GroupBox ها یک عنصر StackPanel تعریف کرده ایم که خاصیت Orientation آن بر روی Horizontal تنظیم شده است.
سپس درون عنصر StackPanel مذکور، دو عنصر دیگر، یکی از نوع Image و دیگری از نوع TextBlock تعریف کرده ایم. عنصر Image وظیفه نگه داری عکسی را که در خاصیت Source آن مشخص
شده است را دارد و عنصر TextBlock متن مشخص شده درون ان را نشان می دهد.
علاوه بر این ، خاصیت Content مربوط به هر یک از دکمه های رادیویی نیز از حالت ساده تک متنی خارج شده و توسط کنترل های کانتیر به مقادیر پبچشده و پیشرفته نسبت داده شده اند. و بدین ترتیب کنترل های GroupBox کاملا سفارشی
ایجاد شده اند.
دقت کنید که کد، فوق یکی از ساده ترین شکل ها برای تعریف عناصر سفارشی می باشد. در WPF امکانات بسیاری برای شما ایجاد شده اند که می توانید توسط آن ها کنترل های سفارشی زیبا و متناسب با پروژه های خود را ایجاد نمایید.
به عنوان مثال با تغییر کوچکی در کد فوق، و بدون تغییر دادن عکس های استفاده شده می توانید GroupBox سمت چپ را به شکلی در آورید که در زیر مشاهده می کنید:

تصویر

همانطور که می بینید، کنترل GroupBox مربوط به Score ها، ظاهر بسیار زیباتری نسبت به نمونه قبلی خودش پیدا کرده است.
[HIGHLIGHT=#1F497D] بهترين مترجم كيست كه سكوت را ترجمه كند.  
Captain I
Captain I
نمایه کاربر
پست: 433
تاریخ عضویت: یک‌شنبه ۱۲ اردیبهشت ۱۳۸۹, ۱:۴۸ ب.ظ
سپاس‌های ارسالی: 733 بار
سپاس‌های دریافتی: 1344 بار

بخش چهارم: Content Controls ( کنترل های محتوا) ( قسمت ششم)

پست توسط abbas.m.k »

کنترل TabControl :

با نام این کنترل و عملکرد این کنترل در دات نتفریم ورک 2.0 آشنا شدید. در این جا قصد صحبت کردن در مورد این کنترل را ندارم، و بیشتر به شرح خاصیت TabItem از این کنترل خواهیم پرداخت. ولی به عنوان اشاره کوچکی در مورد ساخت این کنترل در WPF به کد زیر دقت کنید

Please Login or Register to see this code

نتیجه حاصل از اجرای کد فوق ( درون یک window را در شکل زیر مشاهده می کنید)

تصویر

خاصیت TabItem :
خاصیت TabItem شبیه به TabPage در کنترل TabControl در دات نت فریم ورک 2.0 می باشد. در واقع هر TabItem یک صفحه را در کنترل tabControl مشخص می کند. عنصر TabItem نیزاز ان دسته از عناصری است که دارای خاصیت header می باشد. همانند GroupBox خاصیت Header از عنصر TabItem نیز می تواند، شامل یک متن ساده باشد و یا اینکه شامل یک محتوای پیچیده تشکیل شده از چندین عنصر باشد.
به کد زیر دقت کنید


Please Login or Register to see this code

نتیجه اجرا:
تصویر

حال به مثال جامع تر زیر که تر کیب، پست های قبلی با مطالب این پست می باشد نیز توجه فر مایید..
Please Login or Register to see this code

حال، نگاهی به نتیجه اجرای مثال فوق خواهیم انداخت و توضیحات مربوطه را در هر بخش خواهید دید. مثال فوق که کد کاملی می باشد،( می توانید آن را در یک پنجره و در داخل عنصر Grid کپی کنید و اجرا نمایید) یک پنجره که دارای یک عنصر TabControl می باشد را نشان می دهد. عنصر TabControl دارای چهار Page یا جهار TabItem می باشد که به ترتیتب در شکل های زیر مشاهده می کنید :

صفحه اول :

تصویر

اولین عنصر TabItem دارای یک متن ساده در header خود می باشد و نیز یک عنصر TextBlock در خاصیت Content خود می باشد. این ساده ترین شکل از یک عنصر TabItem می تواند باشد.
صفحه دوم :

تصویر

این صفحه دارای یک کنترل StackPanel با خاصیت Orientaion با مقدار Horizontal می باشد. درون این کنترل یک عکس و یک متن درون عنصر TextBlock قرار گرفته است. مقدار خاصیت Content این عنصر همان GroupBox سمت چپ مثال قبل می باشد که یک محتوای پیچیده و پیشرفته را برای شما ایجاد می کند.
صفحه سوم :

تصویر

این صفحه دارای یک کنترل StackPanel با خاصیت Orientaion با مقدار Horizontal می باشد. درون این کنترل یک عکس و یک متن درون عنصر TextBlock قرار گرفته است. مقدار خاصیت Content این عنصر همان GroupBox سمت راست مثال قبل می باشد که یک محتوای پیچیده و پیشرفته را برای شما ایجاد می کند.
صفحه چهارم:

تصویر

این صفح در header خود کمی متفاوت تر از header ها صفحات قبلی می باشد. اولین تفاوت اینکه در این صفحه و در قسمت هدر ان چهار عنصر مجزا قرار گرفته است. دو عنصر برای نگه داری عکس ها و دو عنصر برای نگهداری متن های مروبوطه. دو مین تفاوت ان این است که کنترل StackPanel موجود در هدر این صفحه به صورت نرمال می باشد. یا در واقع خاصیت Orientation آن تنظیم نشده است که باعث می شود به صورت پیش فرض Vertical در نظر گرفته شود. خاصیت Content این صفحه نیز، با GroupBox های مثال قبلی مقدار دهی شده است.
مثال فوق، نشان دهنده این است که شما می توانید با بهری گیری از عناصر کانتینر کنترل های کاملا سفارشی خود را ایجاد نمایید.
[HIGHLIGHT=#1F497D] بهترين مترجم كيست كه سكوت را ترجمه كند.  
Captain I
Captain I
نمایه کاربر
پست: 433
تاریخ عضویت: یک‌شنبه ۱۲ اردیبهشت ۱۳۸۹, ۱:۴۸ ب.ظ
سپاس‌های ارسالی: 733 بار
سپاس‌های دریافتی: 1344 بار

بخش چهارم: Content Controls ( کنترل های محتوا) ( قسمت آخر)

پست توسط abbas.m.k »

کنترل Expander :
این کنترل بدون شک یکی از کنترل های پر کاربردی است که برنامه نویسان همیشه به دنبال آن جهت استفاده در برنامه های خود بوده اند. از زمان ظهور دات نت، این کنترل به صورت پیش فرض در ویژوال استودیو وجود نداشت و برنامه نویسان مجبور بودند یا خود اقدام به ایجاد چنین کنترلی نمایند و یا به سمت کنترل های نوشته شده توسط اشخاص و شرکت های ثالث روی آورند.
ماکروسافت در ویژوال استودیو 2008 و در تکنولوژی WPF ، این کنترل را برای استفاده کاربران قرار داد. این کنترل دارای دو بخش می باشد، بخش هدر و یک بخش محتوا. بخش هدر شامل یک دکمه که غالبا به صورت فلش است، می باشد. کاربر با کلیک کردن بر روی این دکمه می تواند بخش Content را مخفی کند و یا آن را از حالت مخفی خارج نماید.

بخش Content این کنترل نیز مانند همه عناصر WPF می تواند شامل هر عنصر دیگری باشد.

نحوه استفاده از این کنترل بسیار ساده می باشد. با استفاده از قطعه کد زیر می توانید یک کنترل Expander ایجاد نمایید:

Please Login or Register to see this code

قطعه کد فوق ساده ترین حالت تعریف یک کنترل Expander می باشد که شامل یک متن ساده به عنوان هدر و یک متن ساده دیگر به عنوان محتوا می باشد. چنانچه بخواهید از هدر و محتواهای پیچیده تر و پیشرفته تر و سفارشی خود در کنترل Expander استفاده کنید، بایستی کنترل Expander را به صورت زیر تعریف کنید:
Please Login or Register to see this code

در این حالت میتوانید با قرار دادن یک کنترل کانتیر در بخش مورد نظر، اقدام به ایجاد هدر و محتواهای مورد نظر خود کنید.
جهت در ک بیشتر به مثال زیر توجه کنید :

Please Login or Register to see this code

کد فوق، چهار کنترل Expander ایجاد می کند. هر کنترل Expander دارای هدر و محتوای خاص خود می باشد.
نتیجه اجرای کد فوق را در شکل زیر مشاهده می کنید:




همانطور که مشاهده می کنید، هر یک از کنترل های Expander در شکل فوق به نحو دلخواهی ساز ماندهی شده اند و دارای مقادیر هدر و محتوای خود می باشند.

خاصیت IsExpanded :
این خاصیت حالت کنترل Expander را نشان می دهد. به طور کلی کنترل Expander دارای دو حالت می باشد:
حالت اول: زمانی که مقدار خاصیت IsExpanded را برابر با False قرار می دهید. در این حالت، بخش محتوای کنترل Expander به صورت مخفی در خواهد آمد.
حالت دوم: این حالت عکس حالت اول می باشد. در این حالت بخش محتوای کنترل Expander در حالت نمایش می باشد.
نکته: مقدار پیش فرض خاصیت IsExpanded برابر با False می باشد.
**
نحوه استفاده از این خاصیت در کد XAML به صوزت زیر می باشد:

Please Login or Register to see this code

مشخص کردن جهت Expand در کنترل Expander :
کنترل Expander دارای خاصیتی به نام ExpanderDirection می باشد که جهت باز و بسته شدن کنترل Expander را مشخص می کند. این خاصیت داراری چهار مقدار Down، Up، Left و Right می باشد که مقدار پیش فرض آن برابرا با Down می باشد.
نحوه به کار بردن این خاصیت در کد XAML به صورت زیر می باشد:

Please Login or Register to see this code
خاصیت FlowDirection
این خاصیت دارای دو مقدار LeftToRight و RightToLeft می باشد که مقدار LeftToRight حالت پیش فرض آن می باشد. این خاصیت نحوه چیدمان کنترل Epander را نشان می دهد. مقدار RightToLeft برای زبان هایی همچون فارسی، عربی و ... که چیدمان الفبای آن ها از سمت راست می باشد، مناسب می باشد.
[HIGHLIGHT=#1F497D] بهترين مترجم كيست كه سكوت را ترجمه كند.  
Captain I
Captain I
نمایه کاربر
پست: 433
تاریخ عضویت: یک‌شنبه ۱۲ اردیبهشت ۱۳۸۹, ۱:۴۸ ب.ظ
سپاس‌های ارسالی: 733 بار
سپاس‌های دریافتی: 1344 بار

بخش پنجم: Dependency properties and routed events ( قسمت اول

پست توسط abbas.m.k »

خواص CLR :
هر برنامه نویس دات نتی، با مفهومی به نام خواص یا همان Property ها آشنا می باشد.

مفاهیمی مانند:

Please Login or Register to see this code

به این گونه خواص، اصطلاحا خواص CLR می گویند. (CLR Property ) . در این قسمت، قصد بیان این موضوع را که این خواص چه هستند و چگونه پیاده سازی می شوند و چرا از آن ها استفاده می کنیم، را ندارم. برای مطالعه خواص CLR به لینک زیر مراجعه کنید.
[External Link Removed for Guests]
هدف از بحث فوق، یک یاداوری در مورد اینگونه خواص، مقایسه آن ها با خواص جدید در تکنولوژی WPF ، جهت تشریح خواص WPF که به Dependency Property معروف هستند، می باشد.

خواص وابسته : (Dependency properties)

تکنولوژی WPF سرویس های جدیدی را برای گسترش خواص CLR در اختیار شما، قرار می دهد. این سرویس ها باعث می شود که بتوانید از این خواص در موارد زیادی از جمله متحرک سازی ها، استایل ها، قالب ها و عملیات بایند کردن و ... استفاده کنید. به چنین خواصی اصطلاحا Dependency Property می گویند.

خواص وابسته و خواص CLR :

در ساده ترین حالت، می توانید خواص وابسته را به مانند خواص CLR در نظر بگیرید. این وضوع را از ابتدای مباحث آموزشی تا بدین جا نیز، با آن برخورد داشته اید. به عنوان مثال، در هنگام استفاده از خواص WPF احتمالا به این نکته توجه کرده اید که روش استفاده از این خواص نیز مانند خواص CLR می باشند.
به عنوان مثال دو قطعه کد زیر مشابه هم می باشند :

Please Login or Register to see this code
با این تفاوت که در کد اول، خاصیت Text یک خاصیت CLR می باشد ولی در کد دوم خاصیت Text یک Dependency Properrty می باشد. اما واقعیت این است که این خواص و قدرت آن ها بسیار فراتر از این موضوع می باشد.

این گونه خواص می توانند مقادیر خود را بر مبنای ورودی های دیگر محاسبه نمایند. این ورودی ها هر چیزی می توانند باشند. به عنوان مثال در بحث Trigger ها، خواهید دید که چگونه بر مبنای تغیر یک خاصیت، خواص دیگر می توانند به صورت اتوماتیک مقادیر خود را تنظیم کرده و آن رفتاری را از خود بروز دهند که شما انتظار دارید.
علاوه بر این، اینگونه خواص، سیستم جدیدی را در اعتبار سنجی مقادیر به شما ارائه می
دهند.
خواص وابسته :
شما می توانید، با پیاده سازی خواص CLR به عنوان Dependency Property ،در سیستم WPF Properties، قابلیت های بسیاری از جمله ارث بری، انیمیشن، پشتیبانی از استایل ها، مقید سازی داده ها و ... به کار برید.

Dependency property ها ، خواصی هستند که در سیستم WPF Properties توسط متد Register ، ثیت شده باشند. هر Dependency property توسط کلاسی پیاده سازی می شود که در آن کلاس فیلدی با امضای public static از نوع Dependency Property وجود دارد که به آن شناسه آن خاصیت می گویند.
در نام گذاری شناسه ها اینگونه عمل میشود که پس از نام خاصیت، کلمه Property در
ادامه آن ذکر می گردد. به عنوان مثال شناسه خاصیت Background Property، background می باشد.
این شناسه، اطلاعاتی راجع به خاصیت خود به هنگام ثیت شدن را درون خود نگه داری می کند.
دقت داشته باشید که Dependency property ها تنها توسط نوع های Dependency object قابل استفاده می باشند.
اما همانطور که قبلا اشاره کردم، کلاس Dependency object در بالای هرم ساختاری کلاس ها در معماری wpf قرار دارد،. به همین دلیل بسیاری از کلاس های اصلی این سیستم می توانند از Dependency property ها پشتیبانی کنند.

چرا و چه زمانی از Dependency property ها استفاده کنیم؟

زمانی که درون کلاسی که از کلاس Dependency object ارث بری می کند، حاصیتی را تعریف می کنید، می توانید این خاصیت را به صورت Dependency پیاده سازی نمایید. اما سوال این است که آیا همیشه و در همه حال بایستی از این نوع خواص استفاده کرد؟ یقینا جواب خیر می باشد. در بسیاری از مواقع پیاده سازی یک خاصیت CLR با یک فیلد خصوصی کافی است.
اما با این حال، ممکن است در بعضی مواقع نیاز به تعریف و پیاده سازی خواص یه شیوه Dependency property را داشته باشید. در ادامه چند دلیل برای تعریف این خواص آورده می شود:

زمانی که می خواهید، خاصیت شما قابل مقدار دهی در استایل ها ( Styles) و قالب ها (Templates) باشد.

زمانی که می خواهید، خاصیت شما قابل استفاده در مقید سازی داده ها (Data Bindings) باشد.

زمانی که می خواهید، خاصیت شما به صورت اتوماتیک بتواند مقدار خودش را از مقدار
والد خود ارث بری کند.

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

اگر چه در سناریو های بالا، شما نیاز به خواص Dependency دارید، ولی در بسیاری از موارد می توانید به جای نوشتن خاصیت های جدید، با دوباره باز نویسی کردن متا داده های خواص Dependency موجود، به هدف خود دست یابید.

تعریف و پیاده سازی خواص Dependency :

تعریف و پیاده سازی خواص Dependency دارای چهار مرحله زیر می باشد.دقت داشته باشید که این چهار مرحله، مراحل ترتیبی نیستند. علاوه بر این، این مراحل قابل اقدام در یکدیگز نیز می باشند.

تعریف متا داده برای خاصیت. این مرحله اختیاری می باشد. می تواند در تعریف خاصیت مقدار null داشته باشد.

تعریف یک فیلد با امضای readonly public static به عنوان شناسه خاصیت . این فیلد بایستی از نوع Dependency property باشد.

ثیت کردن خاصیت، در سیستم wpf توسط متد Register.

ایجاد یک پوشاننده (wrapper) برای خاصیت، که همنام با نام خاصیت می باشد.

مثال:
فرض کنید کلاسی به نام MyControl ایجاد کرده اید. این کلاس از کلاس UserControl ارث بری می کند. می خواهیم خاصیتی به نام CornerRadius برای این کنترل تعریف کنیم.

Please Login or Register to see this code
ابندا شناسه خاصیت را تعریف می کنیم.
Please Login or Register to see this code

همانطور که مشاهده می کنید، شناسه به صورت CornerRadiusProperty نام گذاری شده است که CornerRadius نام خاصیت می باشد.

در مرحله بعدی می بایستی خاصیت خود را ثبت کنیم. برای این منظوراز متد Register استفاده می کنیم.

Please Login or Register to see this code
همانطور که مشاده می کنید از متد Register از کلاس Dependency Property که یک کلاس مهر شده ( درای امضای seald) می باشد، استفاده شده است.

آرگومان اول این متد، نام خاصیت را مشخص می کند. در اینجا نام خاصیت، CornerRadius می باشد.

آرگومان دوم نوع خاصیت را مشخص می کند. نوع خاصیت همانطور که مشاهده می
کنید، از نوع CornerRadius در نظر گرفته شده است.

نکته:
CornerRadius یک ساختار (Structure) در فضای نام System.Windows می باشد که اینترفیس ژنریک IEquatable را پیاده سازی میکند.

آرگومان سوم، مالک(owner) خاصیت را مشخص می کند. که در این مثال، کلاس
MyControl می باشد.

آرگومان چهارم، متا داده ای است که برای این خاصیت در نظر گرفته شده است. مقدار صفر درون آن، معرف مقدار پیش فرض خاصیت، می باشد. موارد دیگری را نیز می توانید در تعریف متا داده های یک خاصیت، لحاظ کنید که در ادامه توضیح داده می شوند.

علاوه بر این، همانطور که پیش تر گفته شد، تعریف متا داده برای یک حاصیت اختیاری
می باشد ولی تنظیم آن اغلب موارد دارای مزایایی است که در ادامه خواهید دید.
قبل از بررسی آرگومان FrameworkPropertyMetadata به صورت عمیق تر، به آرگومان دیگری که می توان به متد Register پاس داد، می پردازیم.

ValidateValueCallback:

آرگومان دیگری که به متد Register می توان پاس داد، نمونه ای از Delegat ای به نام ValidateValueCallback می باشد. این Delegate دارای تعریفی مانند زیر می باشد:

Please Login or Register to see this code

از این Delegate می توان جهت اعتبار سنجی مقدار خاصیت، که توسط کاربر نهایی(end user) مقدار دهی شده است، استفاده کرد. همانطور که در امضای این Delegate مشخص است، نوع برگشتی متد هایی که این Delegate می تواند، مرجعی برای آن ها باشد، از نوع bool می باشد. در واقع چنانچه مقدار خاصیت، دارای اعتبار باشد، مقدار بازگشتی true و در غیر این صورت مقدار بازگشتی false می باشد پس می توان نعریف متد Register را به شکل زیر کامل تر کرد:
Please Login or Register to see this code
که متد CornerRadiusValidateCallBack به صورت زیر می باشد:

Please Login or Register to see this code

مرحله آخر پوشانیدن خاصیت می باشد.

Property Wrapper :
در این مر حله بایستی خاصیت شما به شکل یک خاصیت CLR پوشانیده شود تا قابل
استفاده باشد. به این خاصیت اصطلاحا property wrapper می گویند.

نحوه تعریف یک wrapper برای خواص Dependency به صورت زیر می باشد:

Please Login or Register to see this code
متد های GetValue و SetValue توسط کلاس Dependency Object مورد استفاده قرار می گیرند تا خاصیت شما را مقدار دهی کنند. به همین دلیل، نبایستی در Property Wrapper ها، منطقی را پیاده سازی کنید چون ممکن است که نا دیده گرفته شوند.
[HIGHLIGHT=#1F497D] بهترين مترجم كيست كه سكوت را ترجمه كند.  
ارسال پست

بازگشت به “Dot Net Programming”