Take the following steps to start a project and to add some code that demonstrates the various Interactive Modes in Windows Phone 7.
- Start Visual Studio .NET 2010 or higher
- Start with the project that you created in Loading and displaying an image in Windows Phone 7.
- Open the MainPage.xaml file and copy the below xaml code into the editor:
[XAML]
<phone:PhoneApplicationPage x:Class="LoadingAndDisplayingAnImageWindowsPhone.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" shell:SystemTray.IsVisible="True" xmlns:my="clr-namespace:Leadtools.Windows.Controls;assembly=Leadtools.Windows.Controls" Loaded="PhoneApplicationPage_Loaded"> <!--LayoutRoot is the root grid where all page content is placed--> <Grid x:Name="LayoutRoot" Background="Transparent"> <StackPanel Orientation="Vertical"> <my:RasterImageViewer Name="rasterImageViewer" Height="480" Width="480" SizeMode="Fit" InteractiveMode="None"/> <Button Name="_btnLoadFromLibrary" Click="_btnLoadFromLibrary_Click" Content="Load From Library"></Button> <Button Name="_btnLoadFromURL" Click="_btnLoadFromURL_Click" Content="Load From URL"></Button> <ListBox Name="_lbInteractiveMode" SelectionChanged="_lbInteractiveMode_SelectionChanged" HorizontalAlignment="Center"> <ListBoxItem Name="_lbiMagGlass" Content="Magnify Glass"></ListBoxItem> <ListBoxItem Name="_lbiZoomTo" Content="Zoom To"></ListBoxItem> <ListBoxItem Name="_lbiCenterAt" Content="Center At"></ListBoxItem> <ListBoxItem Name="_lbiScale" Content="Scale"></ListBoxItem> <ListBoxItem Name="_lbiPan" Content="Pan"></ListBoxItem> </ListBox> </StackPanel> </Grid> </phone:PhoneApplicationPage>
- Switch to MainPage.xaml code view (right-click Page.xaml in the solution explorer then select View Code) and add the following class function:
[C#]
private void _lbInteractiveMode_SelectionChanged(object sender, SelectionChangedEventArgs e) { switch (_lbInteractiveMode.SelectedIndex) { case 0: rasterImageViewer.InteractiveMode = Leadtools.Windows.Controls.InteractiveMode.MagnifyGlass; break; case 1: rasterImageViewer.InteractiveMode = Leadtools.Windows.Controls.InteractiveMode.ZoomTo; break; case 2: rasterImageViewer.InteractiveMode = Leadtools.Windows.Controls.InteractiveMode.CenterAt; break; case 3: rasterImageViewer.InteractiveMode = Leadtools.Windows.Controls.InteractiveMode.Scale; break; case 4: rasterImageViewer.InteractiveMode = Leadtools.Windows.Controls.InteractiveMode.Pan; break; default: rasterImageViewer.InteractiveMode = Leadtools.Windows.Controls.InteractiveMode.None; break; } }
-
Build, and Run the program to test it.
Click the "Load From URL" button to load an image from a URL.
Click the "Load From Library" button to load an image from the Windows Phone photo library.
Click the various Interactive Mode options in the listbox.
NOTE: If you encounter and "Invalid File Format" or "Feature Not Supported" exception, please refer to the topic Invalid File Format/Feature Not Supported.