Displaying Images from Server Folder and SQL Server 2000 Database

In the last article Uploading Images to Server Folder and SQL SERVER 2000 Database we saw that you we can upload an image to the server's folder as well as the save the image in the SQL SERVER 2000 Database. In this article we will see how we can read images from the server's folder as well as database and display it on the screen.

Introduction:

Reading Images from the Server's Folder:

I will discuss two methods of reading images from the folder. The first method is much better in which we can display all the images from the folder using an Image control. Second method uses conversion from the FileInfo object to the Stream object and uses Response.BinaryWrite method to display the image.

Here is the code for the first method:

DirectoryInfo dir = new DirectoryInfo(Server.MapPath(FILE_PATH));

FileInfo[] fileInfo = dir.GetFiles();

for(int i=0;i<fileInfo.Length;i++)

{

System.Web.UI.WebControls.Image picture = new System.Web.UI.WebControls.Image();

picture.ImageUrl = FILE_PATH + fileInfo[i].Name;

Panel1.Controls.Add(picture);

}

Panel1.DataBind();

We are simply looping through the folder and retrieving all the files which in this case are image files. We make an Image object and set its ImageUrl property to the path of the image. And finally add the image in the panel control and bind the panel to the page.

private const string FILE_PATH = @"images\";

Now let's see the second approach of displaying images from the server's folder. First we loop through the images. We get the size of each image and make the byte[] depending on the size of the image. We open the file using the OpenRead() method and we read the stream in the byte array and puts everything in the imageList which is an ArrayList object. And finally we used the Response.BinaryWrite method to display the image on the screen. The problem I found using this approach is that you can output only one image at a time on the page. If you find a way to display multiple images using this approach than send me an email at azamsharp@gmail.com.

// Reads the Server's Folder and prints out the images

for(int i=0;i<fileInfo.Length;i++)

{

// Gets the file size

fileSize = Convert.ToInt32(fileInfo[i].Length);

byte[] imageBinary = new byte[fileSize];

Stream myStream = fileInfo[i].OpenRead();

int n = myStream.Read(imageBinary,0,fileSize);

byte[] imageData = imageBinary;

imageList.Add(imageData);

}

Response.BinaryWrite( (byte[]) imageList[0]);

Okay ! enough of the server folder, let's now look how we can display an image from the database. In the code below we are simply using a string query to retrieve an image and use the same Response.BinaryWrite method to display the image.

string query = @"SELECT Picture FROM Person WHERE PersonID = 7"; // This is hardcoded you can use SPROC

SqlCommand myCommand = new SqlCommand(query,myConnection);

myCommand.CommandType = CommandType.Text;

myConnection.Open();

SqlDataReader reader = null;

reader = myCommand.ExecuteReader();

reader.Read();

Response.BinaryWrite( (byte[]) reader.GetValue(0) ); // GetValue(0) since we are only getting a single item

reader.Close();

myConnection.Close();

I hope you liked the article, happy programming !