Include Image Resources into a GOA Winforms for Silverlight Application

Download the sample project

Introduction

Since Silverlight 2 Beta 1, you can include your images directly into your GOA Winforms for Silverlight Application. Images formats can be .jpg, .png or .gif

Note:
You don’t need to reference the resource zip files anymore, like you did for Silverlight 1.1 projects.

Creating the GOA Project Using Visual Studio

Start Visual Studio 2008.
On the File menu, click New Project.
In the Project types tree view on the left of the New Project dialog box, select the Visual C# root node.
In the Templates list on the right, select GOA WinForms Application.
Name your application “MyApp” and click OK.

A new Sliverlight Visual Studio project is created.

Including images into the Project

Copy your directory containing the images into the project. For example ‘Images’
In the Project treeview, right-click the ‘Images’ directory you have just copied and select ‘Include in Project’ from the context menu
Expand the Images directory, richt-click an image and check Properties in the Visual Studio Properties window
The ‘Build action of each image should be ‘Resource’

Creating the index.xml file

Right-click the project, select ‘Add>New Item’ from the context menu.
In the Templates list on the right, select XML File.
Name your file index.xml and click OK.
Double-click on the file to open it in Visual Studio. This file should be formatted as follows:


<Images>
   <ImageResource Path=“Directory/ImageName”
      Name=“ImageName”
      Width =“width”
      Height =“height”
    />
  <ImageResource Path=“Directory/Image2Name”
      Name=“Image2Name”
      Width =“width”
      Height =“height”
    />
</Images>

Reference the index xml file

In your Page.xaml file, add the reference to the index.xml file:


<winformhost
          Width=“600″
          Height=“480″               
          Canvas.Left=“0″
          Canvas.Top=“0″
          FormClass=“IncludeImages_sl2.MyForm”           
          ImageIndexXmlFile=“Images/index.xml” />

Use the image in your application

Now you can use your image. Let’s display it into an ImageBox for example.

Create an imagebox
Set the ResourceName of your imagebox to the image you want
Add the imagebox into your form


private System.Windows.Forms.ImageList imageBox1;
// … / …
   this.imageBox1 = new ImageBox();
   this.imageBox1.Location = new System.Drawing.Point(50, 90);
   this.imageBox1.ResourceName = “logonetika.png”;
// … / …
   this.Controls.Add(this.imageBox1);