In this quick tutorial, using the LEADTOOLS for WPF ImageViewer with Microsoft Expression Blend, you will design a layout and create an application that mounts a digital picture inside a digital frame. No coding is required to do this, and the entire XAML application can be created in a couple of minutes.
You can use the ImageViewer control to display almost any kind of image, anywhere in your window. In this case, we will use it to add a "picture frame" image.
This will make the ImageViewer the active control:
You can even display images on top of one another! In this project, we will use that feature to put a picture into the frame. The steps are the same as for the first image, except for where you draw, and which image you select for the image source. Also, because the ImageViewer is already the active control, you do not need to select it again:
When it is done, you'll have a "framed" digital picture that you can resize like any window, with the "frame" and the "picture" resized together, but treated as separate objects:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MyProject.Window1"
x:Name="Window"
Title="PictureThis!"
Width="640" Height="480" xmlns:Leadtools_Windows_Controls="clr-namespace:Leadtools.Windows.Controls;assembly=Leadtools.Windows.Controls">
<Grid x:Name="LayoutRoot">
<Leadtools_Windows_Controls:ImageViewer x:Name="Frame" Width="Auto" Height="Auto" Content="" SizeMode="Stretch">
<Leadtools_Windows_Controls:ImageViewer.Source>
<BitmapImage UriSource="file:///C:/users/Public/Documents/LEADTOOLS Images/Images/TestFrame1.jpg"/>
</Leadtools_Windows_Controls:ImageViewer.Source>
</Leadtools_Windows_Controls:ImageViewer>
<Leadtools_Windows_Controls:ImageViewer Margin="99,82,97,83" x:Name="Picture" Width="Auto" Height="Auto" Content="" SizeMode="Stretch">
<Leadtools_Windows_Controls:ImageViewer.Source>
<BitmapImage UriSource="file:///C:/users/Public/Documents/LEADTOOLS Images/Images/ScarletMaCaws.jpg"/>
</Leadtools_Windows_Controls:ImageViewer.Source>
</Leadtools_Windows_Controls:ImageViewer>
</Grid>
</Window>