Rabidwolff's Alehouse
"Your place for fun and knowledge."
HOME | Quotes | SAS | C# | BEER

ASP.NET C# - Working with Images

1. Read in and iterate through all files in a directory
2. Read in an image from file path and convert to byte array
3. Display an image byte array straight to HTML image tag/ASP.NET Image Control
4. Method to resize image for display
5. Compare images to find dupicates
6. Use IHttpHandler (Handler.ashx) to display images
7. Use IHttpHandler (Handler_Image_Thumbnail.ashx) to display images for thumbnails
8. Read an image file from user

1. Read in and iterate through all files in a directory:

This will read in all files from a directory location. You can use path on local system for testing or root of website for when on the server. This example iterates through all files and displays some info for each into a label control.



(Back to Top)

2. Read in an image from file path and convert to byte array:

This method takes the path of the file location and returns a byte array for the file.



(Back to Top)

3. Display an image byte array straight to HTML image tag/ASP.NET Image Control:

Byte[] arrays can be directed straight into the HTML tag/controls for images. This is fine to use for a few smaller images but otherwise, it can be slow. For the code behind, the variable bytes was set as a byte[] for an image file.

HTML Tag/ASP.NET Image Control:



Code behind:



(Back to Top)

4. Method to resize image for display:

Most of the time you want to display an image into a fixed width by side ratio or by a maxium side length for either a thumbnail or so the image just doesn't fill the whole screen. This method takes a byte[] array of the image and resizes based on fixed width or height or a maxium longest side (see third parameter for selector).



(Back to Top)

5. Compare images to find dupicates:

The method below takes two string full file names (path and filename) and compares each. It will first look at the length of the file, then calculate the hash of it and compare that. I have read that comparing the hash can return false positives although it is very rare. When using a SQL database, it is better to calculate the hash and length and load those the database and compare than have SQL do it all for you (something about SQL hash types being less efficient in compares and limited to size). This uses 'using System.Security.Cryptography;'.



(Back to Top)

6. Use IHttpHandler (Handler.ashx) to display images

Using the IHttpHandler is probabily the most efficient way to display multiple images pulled from a database such as through a gridview. The draw backs is that it requires double hitting of the database to get the data (once for other data to display from the apsx page and then once from the ashx handler for the image.

The ID (primary unique key for the record for the image) is used. The handler takes this parameter from the URL and then uses that as a paramter in select statment to get the image file. The image file is saved as a Varbinary(max) in the database.

HTML control:



Handler.ashx file:



(Back to Top)

7. Use IHttpHandler (Handler_Image_Thumbnail.ashx) to display images for thumbnails

This uses IHttpHandler with two paramters, the id number to pull from SQL databse by primary key and the length of the longest side to scale down by ratio the image for display.

HTML control:



Handler_Image_Thumbnail.ashx file:



(Back to Top)

8. Read an image file from user

This uses the control FileUpload to get image file from a user. It then checks that the file exists, that it has one of the accepted image extensions, that is less than 5MB (prevent flooding, etc), and then converts to byte[] variable. It will display errors message to a status label or out of try/catch block.

HTML control:



C# Codebehind:



(Back to Top)

Rabidwolff Industries | Establisted: 10/15/2011 | Version: 4 8/4/2012 | Page Last Generatated: 9/25/2021 5:14:31 PM