Introduction
Resources are always a vital part for web application and here in Silverlight application too, it plays an important role for creating Rich internet applications. In this context, Resource means Images, audio, videos, object, which can be styles or datatemplate used for creating rich applications. Silverlight does support various ways of storing resources and managing it. In this post, we will discover the different options available.
The complete information on resources will span across multiple posts, where we will cover Binary Resource (Resource Files) and XAML Resource.
Various Ways of Managing Resources
In Silverlight, Resources can be managed in the following ways:
- Resource at server Side, Loading on Demand
- Resource embedded inside XAP/Assembly
- Resources from external assemblies
The most important point is that we should not confuse between Assembly Resource and XAML Resource although both are termed as resource. We can divide resource types into two categories:
- Files other than executable or Binary/Assembly Resource (Managed through Resource Files)
- Objects such as Styles, Templates, etc. or XAML Resource (Managed through Resource Dictionary)
Basically, the scope of this post is to give you a brief about Resource Files or Binary Resource or Assembly Resource. In this post, we will explore how these resource files can be stored and managed from Silverlight. The subsequent post will focus on Resource Dictionary or XAML Resource.
Managing Resource Files
Before moving on the Resource Files, let's have quick look into some important terminologies we will come across frequently.
Application Package – The files packaged as an XAP file which includes the Silverlight assemblies and Application manifest files, also Resources if any.
Application Root – The location where XAP files reside in the deployed solution most of the time ClientBin
URI - Stands for Uniform Resource Identifier, is the path to the Resource. It can be either:
| Absolute URI |
Relative URI |
|
Exact location of the Resource, for e.g., a qualified URL (www.manaspatnaik.com/image1.jpg)
|
Location of file with respect to the application root (where Application package resides) For e.g. “/image1.jpg” |
| Used when files are other than application root |
A common scenario of storing resource within the domain under application root |
|
Files must be inside the same application root folder where package exists. |
The application root is the folder where the application package XAP file resides. So all the files must be within the same folder as XAP file. The relative URI does not look for content outside this folder but it does support folder structure inside the application root. So we can have our file image1.jpg inside Resource folder inside application root folder.
Other than Uri, there is BuildAction property for each file which we will discover as we go through with a sample as follows.
Resource File
As we know, Silverlight application is nothing but a package of files compressed and stored as a single file. Any resource added to the client side inside the Silverlight project will be transferred to client side based on the Mode of Deployment. Let's check with the example as below:
Mode Of Deployment, BuildAction
Here, the most important thing to note is how the resource is configured for deployment. By default, the file’s BuildAction properties set as a Resource. Silverlight does offer various options which can be handy at some time.
Generally the resources can be deployed with the following options BuildAction as:
With each option, the application package and the URI defers. Also make a note that in Silverlight project, although there are various options, only the above mentioned build actions can be used.
Content
Content option adds the file to application package as loose resource.
Here, in the project, Change the file BuildAction as Content and Rebuild the solution. The XAP file size is almost 42 KB which includes Image.
Here to locate the resource file, you can follow either of the methods mentioned.
XAML
<Grid x:Name="LayoutRoot" Background="White">
<Image Margin="12,12,12,77" Name="image1" Stretch="Fill" Source="/BananaTECH.jpg" />
</Grid>
Code
image1.Source = new BitmapImage(new Uri("/BananaTECH.jpg",UriKind.Relative));
Resource
This Option will add the resource within the application package inside the Silverlight assembly.
On rebuilding the project, after changing the BuildAction type of image, the XAP file size remains the same 43 KB but the image is embedded inside the MySilverlightApp.dll. You can mark the difference in size of assembly compared to the above content type.
To locate the resource, there should not be any leading trails.
XAML
<Grid x:Name="LayoutRoot" Background="White">
<Image Margin="12,12,12,77" Name="image1" Stretch="Fill" Source="BananaTECH.jpg" />
</Grid>
Code
image1.Source = new BitmapImage(new Uri("BananaTECH.jpg", UriKind.Relative));
None
This option neither adds the resource to the application package nor to the Silverlight assembly. You need to add resource to the server manually.
With None build action, the XAP file size reduced dramatically as the resource is not embedded inside the package or assembly. The screenshots below show the XAP file with 4 KB of size. To make your deployed code work, we need to place the resource file inside the published project under clientbin.
XAML
<Grid x:Name="LayoutRoot" Background="White">
<Image Margin="12,12,12,77" Name="image1" Stretch="Fill"
Source="BananaTECH.jpg" /></Grid>
Code
image1.Source = new BitmapImage(new Uri("BananaTECH.jpg", UriKind.Relative));
Resource from an External Assembly
It's wise to refactor the resource into a separate assembly for reuse amongst the applications.The best example of external assembly for resource is the theme libraries. The Silverlight too supports using external Silverlight assemblies in projects. Let's create a Silverlight assembly project.
Then adding a reference to the Silverlight project will allow you to use the resource file inside the application.
Resources can be used by using the following syntax:
/assemblyName;component/resourceLocation
For example, in this project, the image file from MyResources assembly can be fetched with URI “/MyResources;component/Rupees.jpg”. The component here is the keyword.
<Grid x:Name="LayoutRoot" Background="White">
<Image Margin="12,12,12,77" Name="image1" Stretch="Fill"
Source="/MyResources;component/Rupees.jpg" /></Grid>
Conclusion
Hope this post will give you a clear idea about Resource files. The subject Resource is not complete yet, here we discussed only about Files/ Binaries however there is a lot more to discuss and share. In my subsequent posts, I will try to cover more about this topic. Send me your suggestions and queries.
History
- 19th May, 2011: Initial post
