MorkaLork Development

Interesting stuff I've picked up over the years...

Using embedded resources

2009-04-16 18:00:02 | 270 views | images embed embedded image resources browse picture

The basics



What we are gonna make in this tutorial is an application that uses embedded images. The application will be a simple one that let's a user browser through a number of cars, showing the user the picture of the selected car together with some information about the car.

This is what the application will look like:

imagehttp://admin.morkalork.com/uploads/images/VV/VV2.png


Getting into it



The first thing you will need to know is how to get pictures into your application. The easy way is to just set a link to the image path on the computer, but that's gonna make it hard when you're exporting the application. Embedding the picture means that you can refer to the picture within the assembly rather than on the harddrive.

Add images


First, create a new folder in your project. Open up the project explorer(View -> Projects) and right click on the project and select Add -> New Folder.
Then right click on that folder and select Add -> Existing Item. Select to show image files if using Visual Studio or all files if you're using SharpDevelop.
Like this:
imagehttp://admin.morkalork.com/uploads/images/VV/VV3.png

After you've done that, select the image, open the properties windows(View -> Properties) and change the property Build Action to EmbeddedResource.

imagehttp://admin.morkalork.com/uploads/images/VV/VV4.png

For every picture you want to add, do the above over and over again =D


The app



The application we will create contains two classes, MainForm.cs and Vehicles.cs. Vehicles.cs will define a vehicle and will be used as a list object in our MainForm.

Vehicle looks like this:


using System;

namespace VisualVehicles
{
/// <summary>
/// Sums up the features of a vehicle, including the path to the picture.
/// </summary>
public class Vehicle
{
//Fields
private string brand;
private string bType;
private int conceptYear;
private string color;
private string imageAddress;

//Properties
public string Brand
{
get{return brand;}
set{brand = value;}
}
public string BType
{
get{return bType;}
set{bType = value;}
}
public int ConceptYear
{
get{return conceptYear;}
set{conceptYear = value;}
}
public string Color
{
get{return color;}
set{color = value;}
}
public string ImageAddress
{
get{return imageAddress;}
set{imageAddress = value;}
}

//Constructor
public Vehicle (string brand, string bType, string color, int conceptYear, string imageAddress)
{
Brand = brand;
BType = bType;
Color = color;
ConceptYear = conceptYear;
ImageAddress = imageAddress;
}
}
}


We only define what we're gonna show the user + an adress to the image. The address to an embedded image is not just the image folder and image name, you'll have to add a namespace too, like this: namespace[.folder.].filename.extension (like VisualVehicles.images.pic1.png). More about this later in the MainForm code.

The actual figures I use in this application are taken either from Wikipedia or from what I can make out from the photos ?=)

Let's look at how to implement an embedde image. There are three namespaces that you'll have to add: System.Reflection, System.IO and System.Drawing.



using System.Drawing;
using System.Reflection;
using System.IO;


And two fields to create:



private Assembly assembly;
private Stream stream;


This is the code to implement the picture(somewhat syntax like).



assembly = Assembly.GetExecutingAssembly();
stream = assembly.GetManifestResourceStream("Namespace.filename.extension");
pictureBox1.Image = Image.FromStream(stream);


Tadaa, you have a picturebox with a picture in it!


MainForm.cs



We have the following controls:

lsbIndex = The listbox where the user selects a car
pbCar = The picturebox where the car will be shown
txtBrand = The textbox that will contain the car name
txtType = The textbox that will contain the car type
txtColor = The textbox that will contain the car color
txtYear = The textbox that will contain the production year of the car.




using System;
using System.Collections.Generic;
using System.Drawing;
using System.Windows.Forms;
using System.Reflection;
using System.IO;

namespace VisualVehicles
{

public partial class MainForm : Form
{
//Fields
private List<Vehicle> carList;
private Assembly assembly;
private Stream stream;

public MainForm()
{
InitializeComponent();
}


void MainFormLoad(object sender, EventArgs e)
{
//Create the list we will be using
carList = new List<Vehicle>();

//Create some cars to work with
CreateCars();

//List the cars
foreach(Vehicle v in carList)
{
lsbIndex.Items.Add(v.Brand + " " + v.BType);
}
}

private void CreateCars()
{
//Add som cars according to the Vehicle class constructor
//The last parameter, imageAddress is the location of the
//embedded picture.

carList.Add(new Vehicle("Jaguar", "XF", "Silver", 2007, "VisualVehicles.images.jaguarXF.jpg"));

carList.Add(new Vehicle("Jaguar", "XKR Silverstone", "Silver", 2001, "VisualVehicles.images.2001JaguarXKRsilverstone.jpg"));

carList.Add(new Vehicle("Jaguar", "XJR-15", "Black", 1990, "VisualVehicles.images.1990JaguarXJR-15.jpg"));

carList.Add(new Vehicle("Saab", "9-3 Convertible \"Yellow Edition\"", "Yellow", 2008, "VisualVehicles.images.2008Saab9-3ConvertibleYellowEdition.jpg"));

carList.Add(new Vehicle("Saab", "9-5", "Blue", 1997, "VisualVehicles.images.Saab9-5.jpg"));

carList.Add(new Vehicle("Nissan", "X-Trail", "Red", 2001, "VisualVehicles.images.2001NissanX-trail.jpg"));

carList.Add(new Vehicle("Honda", "Alfa Romeo", "Blue", 2007, "VisualVehicles.images.2007HondaAlfaRomeo.jpg"));

carList.Add(new Vehicle("Honda", "Delta", "Silver", 2009, "VisualVehicles.images.2009HondaDelta.jpg"));
}



void LsbIndexSelectedIndexChanged(object sender, EventArgs e)
{
//Get the selected index from the listbox
int idx = lsbIndex.SelectedIndex;

//Get the assembly that contains the code that is currently executing
assembly = Assembly.GetExecutingAssembly();

//Load the resources from this assembly, find the one that matches our imageAddress!
stream = assembly.GetManifestResourceStream(carList[idx].ImageAddress.ToString());

//Load the image from the stream we got above
pbCar.Image = Image.FromStream(stream);

//Set the textboxes from the list
txtBrand.Text = carList[idx].Brand;
txtType.Text = carList[idx].BType;
txtColor.Text = carList[idx].Color;
txtYear.Text = carList[idx].ConceptYear.ToString();

//Set the form text to brand + type
this.Text = carList[idx].Brand + " " + carList[idx].BType;
}
}
}



Here are is an exe file and a source file for the project:

Source code : Debug.rar
.EXE : VisualVehicles.exe



Article comments

Feel free to comment this article using a facebook profile.

I'm using facebook accounts for identification since even akismet couldn't handle all the spam I receive every day.