کنترل Image در WPF – آموزش WPF

پنجشنبه ۶ خرداد ۱۴۰۰
بازدید ۱,۳۹۳ نفر
AmRo
(10 امتیاز از 2 رای)
Loading...

تصویر wpf-image_10386 کنترل Image در WPF - آموزش WPF

کنترل Image در WPF

کنترل Image در فریم ورک WPF به منظور نمایش یک تصویر استفاده می شود. شما می توانید هم یک شیء از نوع Image یا یک شیء از نوع ImageBrush را برای نمایش تنظیم کنید. کنترل Image از فرمت های زیر پشتیبانی می کند:

Bitmap(BMP)
Tagged Image File Format (TIFF)
Icons (ICO)
Joint Photographic Experts Group (JPEG)
Portable Network Graphics (PNG)
JPEG XR

در تصویر زیر می توانید سلسله مراتب مربوط به ارث بری کنترل Image را مشاهده کنید:

تصویر wpf-image_10386_1 کنترل Image در WPF - آموزش WPF

خاصیت های پر استفاده

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

ردیف	توضیحات
1	Height به منظور گرفتن یا تنظیم ارتفاع کنترل استفاده می شود (به ارث رسیده از FrameworkElement).
2	HorizontalAlignment به منظور گرفتن یا تنظیم تراز افقی کنترل استفاده می شود (به ارث رسیده از FrameworkElement).
3	Margin به منظور گرفتن یا تنظیم فاصله بیرونی کنترل از سایر کنترل ها استفاده می شود (به ارث رسیده از FrameworkElement).
4	Name به منظور تنظیم یک نام شناسایی برای کنترل استفاده می شود. زمانی که پردازنده XAML درخت اشیاء را ایجاد می کند، کد Run-time می تواند با استفاده از نام یک کنترل به آن ارجاع دهد (به ارث رسیده از FrameworkElement).
5	Opacity میزان شفافیت کنترل را مشخص می کند. مقدار قابل قبول باید بین 0.0 تا 1.0 باشد (به ارث رسیده از UIElement).
5	Resources منابع مربوط به کنترل را مشخص می کند (به ارث رسیده از FrameworkElement).
6	Stretch به منظور گرفتن یا تنظیم مقداری استفاده می شود که توصیف کننده نحوه کش آمدن (Stretch) تصویر در داخل مستطیل است.
7	Style استایل مربوط به کنترل را تنظیم می کند (به ارث رسیده از FrameworkElement).
8	VerticalAlignment به منظور گرفتن یا تنظیم تراز عمودی کنترل استفاه می شود (به ارث رسیده از FrameworkElement).
9	Width میزان عرض کنترل را مشخص می کند (به ارث رسیده از FrameworkElement).
10	Source به منظور گرفتن یا تنظیم منبع تصویری که باید نمایش داده شود استفاده می شود.

رویدادهای پراستفاده

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

ردیف	توضیحات
1	DataContextChanged زمانی که مقدار خاصیت DataContext تغییر کند، این رویداد رخ می دهد (به ارث رسیده از FrameworkElement).
2	DragEnter زمانی که سیستم ورودی یک رویداد drag که هدفش این کنترل است را گزارش دهد، این رویداد رخ می دهد (به ارث رسیده از UIElement).
3	DragLeave زمانی که سیستم ورودی یک رویداد drag که منشاء آن این کنترل است را گزارش دهد، این رویداد رخ می دهد (به ارث رسیده از UIElement).
4	DragOver زمانی که سیستم ورودی یک رویداد drag را با این کنترل به عنوان هدف drop شدن، گزارش دهد، این رویداد رخ می دهد (به ارث رسیده از UIElement).
5	DragStarting زمانی که عملیات drag کردن شروع شود، این رویداد رخ می دهد (به ارث رسیده از UIElement).
6	GotFocus زمانی که بر روی کنترل فوکوس شود، این رویداد رخ می دهد (به ارث رسیده از UIElement).
7	ImageFailed زمانی که خطایی در رابطه با تصویر در حال بارگیری وجود داشته باشد، رخ می دهد.
8	ImageOpened زمانی که تصویر مشخص شده توسط خاصیت Source بدون خطا دانلود و دیکد شود، رخ می دهد.
9	KeyDown زمانی که یک کلید از کیبورد فشار داده شود و فوکوس جاری بر روی کنترل باشد، این رویداد رخ می دهد (به ارث رسیده از UIElement).
10	KeyUp زمانی که کلید فشار داده شده رها شود و فوکوس جاری بر روی کنترل باشد، این رویداد رخ می دهد (به ارث رسیده از UIElement).
11	SizeChanged زمانی که مقدار یکی از خاصیت های ActualHeight و یا ActualWidth تغییر کند، این رویداد رخ می دهد (به ارث رسیده از FrameworkElement).

مثال

برای درک بهتر یک پروژه WPF به نام WPFImageControl ایجاد کرده و آن را به شکل زیر تغییر دهید. کدهای XAML:

<Window x:Class = "WPFImageControl.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   Title = "MainWindow" Height = "500" Width = "604">
	
   <Grid> 
      <Grid.RowDefinitions> 
         <RowDefinition Height = "1*"/> 
         <RowDefinition Height = "1*"/> 
      </Grid.RowDefinitions>
		
      <StackPanel Orientation = "Horizontal"> 
         <Image Width = "200" Source = "Imagesred_rock_01.jpg"  
            VerticalAlignment = "Top" Margin = "30"/> 
         <Image Width = "200" Source = "Imagesred_rock_01.jpg" VerticalAlignment = "Top"
            Margin = "30" Opacity = "0.5"/>             
      </StackPanel> 
		
      <StackPanel Grid.Row = "1"> 
         <Ellipse Height = "100" Width = "200" HorizontalAlignment = "Center" Margin = "30"> 
            <Ellipse.Fill> 
               <ImageBrush ImageSource = "Imagestahoe_01.jpg" /> 
            </Ellipse.Fill> 
         </Ellipse> 
      </StackPanel> 
		
   </Grid> 
	
</Window>