Silverlight Tip of the Day #10 – How to Dynamically Load and Display Images

[Blog Mirrored from https://silverlight.net/blogs/msnow/default.aspx]

Loading images in Silverlight is fairly straight forward. The first step is to create what’s called a Uniform Resource Identifier (URI). The URI is essentially a string that points to a resource. The resource can be locally in the project or out on the Internet. Images that are loaded locally must be first added to your Visual Studio project.

 Image image = new Image();
 Uri uri = new Uri("images/myImage.png", UriKind.Relative);
 ImageSource img = new System.Windows.Media.Imaging.BitmapImage(uri);
 image.SetValue(Image.SourceProperty, img)

Now, to display the image you will need to add it to the Children of an element that you have declared in your XAML. For example, let’s say you have created a Canvas object in your Page.xaml under the parent Grid object. Using the x:Name tag, give it the name “Map”:

 <Grid x:Name="MainGrid">
   <Canvas x:Name="Map">
    </Canvas>
 </Grid>

Now, back in your Page.xaml.cs file you can dynamically add the image you just created to the canvas object like this:

 Map.Children.Add(image);

Btw, declaring an image in your XAML works the same way. Example:

 <Image Source="images/MyImage.png"></Image>

Thank you,
--Mike Snow

 Subscribe in a reader

Comments