Image control in WPF using VB.NET
In this article we will learn how to use Image control in WPF.
In this article we will learn how to use Image control in WPF (Window Presentation Foundation).
Image Control:
The image control can be used to display images.
Properties: These are the following properties of this control.
Figure 1.
Stretch property
This property can have the following values:
Figure 2.
None
This will do no modification on the size of the image. If the image size is more than the size of the container, then the image will be cut to fit in the container.
Fill
In this case, the image will be expanded to fill the region of the container. The aspect ratio (proportion of width and height) will not be maintained.
Uniform
This is the default value. In this case, the image will be resized to fit the container, but the aspect ratio will be maintained. So, there may be blank space in the container depending on the width and height of the image and container.
UniformToFill
In this case, the image will be resized and will fill the container, but aspect ratio will be maintained by trimming some portion of the image if required.
Width and Height properties
The width and height properties of the image can be used to override the stretch property. If width and height properties are specified, then Stretch property will be ignored.
Clip property
The clip property of Image control can be used in Silverlight to make certain portion of the image visible and hide some part of it.
For example:
Drag a Image control on the form.
Figure 3.
XAML code:
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Image Height="150" HorizontalAlignment="Left" Margin="10,10,0,0" Name="Image1"Stretch="Fill"
VerticalAlignment="Top" Width="200" />
</Grid>
</Window>
Now select image control and press F4 for property and click on the source property from the property window.
Figure 4.
Now select an Image and click on the OK Button.
Figure 5.