باسمه تعالی

باعرض سلام خدمت تمامی دوستان عزیزم. از اینکه مدت زیادیه مطالب وبلاگ رو بروزرسانی نکردم عذر خواهی میکنم. ان شاالله جبران میشه

باسمه تعالی

برای شروع کار با WPF باید Visual Studioi 2008 رو نصب کرده باشین. اگر VS 2008 نصب بود ،اونرو اجرا کرده و در کادر Recent Project  بر روی لینک Project در مقابل  Create کلیک کنید  ویا از منوی فایل اقدام به ایجاد پروژه جدیدی کنید.

بعد ،در قسمت Project Types گزینه Windows و از قسمت Templates گزینه WPF Application رو انتخاب نمایید. بعد از مشخص کردن نام و محل پروژه روی دکمه OK کلیک کنید.

پروژه را که ایجاد کردید،همانطور که در قسمت اول هم گفته شد،محیط Window به دو قسمت به نام های XAML , Design تقسیم میشود. که البته ظاهر پنجره را میتوانید به دلخواه تنظیم کنید. مثلا بجای چینش افقی قسمت ها،چینش عمودی را انتخاب نمایید و یا تنظیمات رو بگونه ای اعمال کنید که Window در هر لحظه یکی از قسمت ها را نمایش دهد و غیره. به هر حال...

ممکن است کدهایی که در قسمت XAML میبینید شبیه این باشند:

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    Title="Window1" Height="300" Width="300">

   

       

   

 

خطوط دوم و سوم که با xmlns مشخص شده اند به فضاهای نامی اشاره میکنند که شما برای ایجاد کنترل های خود در WPF به اونها احتیاج دارید. درست مثل اینکه در پروژه های Window Application  برای کار با کلاس های ADO.NET برای کار با پایگاه داده NameSpace های System.Data , System.Data.SqlClient رو Using مینمودید.

در زبان های نشانه گذاری(Markup) مثل HTML و XML خصوصیات هر عنصر را هم می توان بصورت Inline تنظیم نمود.(مانند آنچه که در کد بالا برای تنظیم خصوصیات Window مانند Title,Height,Widthمیبینید.) و هم میتوان در خطوطی جداگانه تعریف نمود. که در این حالت در بین تگ شروع و تگ پایان ( و )

 خصوصیات برای آن کنترل تنظیم میشوند. به کد زیر دقت کنید:

 

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

     Height="300" Width="300">

   

        Window_1

   

   

       

   

همانطور که مشاهده میکنید میتوان بطور همزمان از هر دو روش برای تنظیم خصوصیات کنترل ها استفاده نمود.

و اما این بستگی به نظر شما دارد که از کدام روش استفاده کنید. روش درون خطی یا خطوط جداگانه و یا هر رو. ولی ظاهرا روش اول یهتر است زیرا به کدنویسی کمتری احتیاج دارد.

همانطور که از قسمت اول به یاد دارید یکی از مهمترین خصوصیات XML و هر زبان نشانه گذاری دیگری خود توصیف بودن آن است. شما با دیدن کدهای فوق به راحتی متوجه میشوید  که یک پنجره بطول 300، عرض 300  و  با عنوان Window_1  ایجاد شده است. در واقع برای تمامی عناصر به همین صورت است. ویژگی Intellisense IDE Visual Studio هم که به طریق اولی کار را برای ما ساده تر میکند. فقط کافی است که کلیدهای Ctrl+Space را بفشارید تا تمامی خصوصیات و متدهای یک کنترل نمایش داده شوند. متدها هم در XAML مانند خصوصیات بصورت درون خطی تنظیم میشوند.  هر عنصری که درون WPF Window قرار میگیرد(Label,Image,Buttonو...) از UIElement مشتق میشود(ارث بری میکند). UIElementتعدادی رویداد مرکزی تعریف می کند.مانند  Mouse Down,Mouse Upو... و هر کلاسی(عنصری)که از UIElement  مشتق شود دارای این رویدادها خواهد بود. در مورد متدها در آینده توضیح خواهم داد. اگر فراموش کردم خواهشا یادآوری کنید.  J

تعدادی از خصوصیات پرکاربرد عبارتند از:

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

خاصیت HorizontalAlignment :
مقادریر خاصیت HorizontalAlignment عبارتند از :

Left : این مقدار، باعث می شود که کنترل مورد نظر از سمت چپ کنترل پدرش تراز شود.
Right : این مقدار، باعث می شود که کنترل مورد نظر از سمت زاست کنترل پدرش تراز شود.
Center : این مقدار، باعث می شود که کنترل مورد نظر در قسمت وسط کنترل پدرش تراز شود.
Stretch : این مقدار باعث می شود که کنترل تمامی عرض کنترل پدرش را پوشش دهد.

 

خاصیت VerticalAlignment :

این خاصیت دارای چهار مقدار زیر می باشد :
Top: که باعث می شود کنترل از سمت بالای کنترل پدر خویش تراز شود.
Bottom : که باعث می شود کنترل از سمت پایین کنترل پدر خویش تراز شود
Center: که باعث می شود کنترل دروسط کنترل پدر خویش تراز شود.
Stretch: که باعث می شود، کنترل از تمامی فضای موجود، استفاده کند.

 

خاصیت Margin:
این خاصیت، فاصله کنترل را از کنترل های اطراف خودش مشخص می کند . این خاصیت دارای چهار مقدار Left،Top،Bottom و Right می باشد.
نحوه مقدار دهی این خاصیت در اسناد XAML به صورت زیر می باشد :"Margin="5,5,5,5

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

Margin="5" 

 

Layout ها در WPF :

هر پنجره WPF تنها یک عنصر را میتواند نگهداری کند.برای اینکه عناصر بیشتری در برنامه تان بتوانید استفاده کنید و Interface کارایی ایجاد کنید(مطمئنا با یک کنترل نمیتوان چنین کاری نمود) باید ابتدا یک کنترل Container در Window خود قرار دهید و سپس عناصر دیگر را درون Container  قرار دهید. بنابراین  Controlهای کانتینر کنترل های خاصی هستند که میتوانند شامل کنترل های دیگری شوند. در WPF لایوت ها بوسیله Container ها مشخص میگردند. یعنی از هر کانتینری(Container) که استفاده نمایید در واقع همان لایوت را خواهید داشت.

تمامی کنترل های قالب بندی WPF از کنترل پایه ای به نام Panel ارث بری می کنند. این کنترل نیز طی ارث بری هایی به آبجکت Dispatcher Object ختم می شود.

مطالبی که در ادامه همین بخش  در رابطه با معرفی کنتر لهای Container  می آورم نوشته آقای مهدی کیانی می باشد.
کنترل های اساسی کانتینر در WPF عبارتند از:
Stack Panel
Canvas
 Dockpanel
 WrapPanel
UniformGrid

 Grid

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

کنترل StackPanel :
همانطور که از نام آن مشخص است، این کنترل, عناصر را به صورت پشته ای مرتب می کند. به دو صورت افقی و عمودی می توانید کنترل ها را قرارد هید.

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

کنترل DockPanel :
این کنترل عملکردی شبیه به خاصیت Dock در کنترل های دات نت فریم ورک2.0 را دارد. با این کنترل می توانید، عناصر خود را نسبت به لبه های مختلف آن تنظیم نمایید.

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

کنترل UniformGrid :
این کنترل شبیه به کنترل Grid میباشد. با این تفاوت که در این کنترل، سایز تمامی سلول ها یکسان می باشد.

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

 

کنترل StackPanel :

این کنترل، عناصر داخل خودش را را بر اساس جهتی که شما مشخص می کنید ( افقی یا عمودی) به صورت پشته ای مرتب می کند.

به عنوان مثال کد زیر، سه کنترل TextBox و یک کنترل Button بر روی StackPanel قرار می دهد.

       

       

       

        Get Sum

       

همانطور که اشاره شد، کنترل StackPanel قابلیت چیدن عناصر را به صورتی افقی نیز دارا می باشد. با به کار گیری خاصیت Orientation از این کنترل می توانید، نحوه قرار گیری عناصر را مشخص سازید.
این حاصیت دارای دو مقدار Horizontal و Vertical می باشد. که به ترتیب برای تراز کردن عناصر به صورت افقی و عمودی بر روی StackPanel به کار می رود.
به عنوان مثال در کدزیر، چهار دکمه به صورت افقی قرار گرفته اند :



 

   

   

   

   

نکته :
مقدار پیش فرض خاصیت Orientation برابر با Vertical می باشد. در واقع اگر خاسیت Orientation را برای StackPanel تنظیم نکنید، عناصر به صورت پشته عمودی قرار خواهد گرفت

 

کنترل Canvas :

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

خاصیت ZIndex :

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

کنترل Grid:

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

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

همانطور که گفته شد  مطالبی که در رابطه با معرفی کنتر لهای Container  آورده شد نوشته آقای مهدی کیانی بود. از جلسه بعد کنترل Grid را مفصلتر معرفی خواهم کرد و با تنظیمات رنگ پس زمینه بصورت Gradient (گرادیان) آشنا خواهیم شد.ان شاالله

راستی نظر شما باعث دلگرمی ماست. نظر فراموشتون نشه.

پیشاپیش میلاد مولود کعبه حضرت علی(ع) را خدمت همه بزرگواران تبریک عرض میکنم.

عید میلاد امام علی(ع) بر محبانش مبارک...

یا علی