Resource Management In Silverligt 3

Introduction

The files required for any Application to run other than project related files are called resources. It can be a text file or image file or any other file. In this article, we will be seeing how images can be accessed in various ways in a Silverlight application.

Types of Resource Management

There are 3 ways we can manage resources such as:

1. Add Image as Resource
2. Add Image as Content
3. Add Image as Resource in an external assembly

Create a Silverlight Project



Figure 1.1 Creating Silverlight Project

Designing the Application

For our sample application let's put 3 Image Control, 3 Buttons and 3 TextBlocks to display the type of resource. I have used blend to design the application.



Figure 1.2 Designing the Application

Add Images to the Project

In SampleSilverlightApplication project add a folder called images and two images are added. As you can see the images we are going to change the Build Action of the images. We will change the Build Action for firefox.png to Resource and IE.png to Content.



Figure 1.3 Adding images to the project



Figure 1.4 Changing the Build Action of the Images.

Adding another Project

To use Image from another assembly we need to add project to the solution and we will add the Image to it. Then we will add the project refference to our main project (SampleSilverlightApplication).



Figure 1.5 Adding another project to the Solution and adding Images to the added project

We have just added One Silverlight Class Library to the Solution and added the folder images and ofcourse we added chrome.png. The SecondApplicaion reference is added to the SampleSilverlightApplication.

Accessing all the Image Resources

Remember we have added 3 Buttons to our SampleSilverlightApplication; now it's time to use them.
First of all we will access the Image which is made Resource in Build Action

private void btnResource_Click(object sender, RoutedEventArgs e)
        {
            /*Image Resource*/
            Uri uri = new Uri("/SampleSilverlightApplication;component/images/firefox.png", UriKind.Relative);
            StreamResourceInfo streamResource = Application.GetResourceStream(uri);

            BitmapImage image = new BitmapImage();
            image.SetSource(streamResource.Stream);
            MyImageResource.Source = image;
        }

Then we will access the Image which is made Content in Build Action

private void btnContent_Click(object sender, RoutedEventArgs e)
        {
            /*Content Resource*/
            Uri uri = new Uri("images/IE.png", UriKind.Relative);
            StreamResourceInfo streamResource = Application.GetResourceStream(uri);

            BitmapImage image = new BitmapImage();
            image.SetSource(streamResource.Stream);
            MyImageContent.Source = image;|
        }

And last but not the least we will try to access the Image from another project (assembly).

private void btnAssembly_Click(object sender, RoutedEventArgs e)
        {
            /*Add Image as Resource in an external assembly*/
            Uri uri = new Uri("/SecondApplication;component/images/chrome.png", UriKind.Relative);
            StreamResourceInfo streamResource = Application.GetResourceStream(uri);

            BitmapImage image = new BitmapImage();
            image.SetSource(streamResource.Stream);
            MyImageAssembly.Source = image;
        }

Running the Application



Figure 1.6 Accessing all the resources on button click event

Congratulations you have successfully used all the resources, and our Application will look like the following. Enjoy coding.