Click here to Skip to main content
12,077,169 members (49,247 online)
Click here to Skip to main content
Add your own
alternative version


17 bookmarked

ASP.NET MVC ImageHandler for Thumbnails

, 7 Oct 2009 CPOL
Rate this:
Please Sign up or sign in to vote.
Handling all your images through a custom ActionResult/Controller.


As some of you might know, I am a really big fan of community-driven technologies. I also like to contribute myself in order to exchange new ideas and meet new people with common interests. Since I am quite new to ASP.NET MVC, I was thinking I would submit my first contribution: handling all your images through a custom ActionResult/Controller. This allows me to do several things:

  • uniform access to images
  • possibility for custom types (this example always renders as PNG)
  • generation of thumbnails.

The Code

Let's start with the code for the ActionResult (initially inspired by/copy-pasted from this, but since the new RC, it is my own code):

using System.IO;
using System.Web.Mvc;
using System.Drawing;
using System.Drawing.Imaging;

namespace Be.Corebvba.MVC
  public class ImageResult : FileStreamResult 
    public ImageResult(Image input):this(input,input.Width,input.Height) { } 
    public ImageResult(Image input, int width,int height) : 
   { } 

    static MemoryStream GetMemoryStream(Image input,int width, 
                        int height,ImageFormat fmt) 
       // maintain aspect ratio 
       if (input.Width > input.Height) 
          height = input.Height * width / input.Width; 
          width = input.Width * height / input.Height; 
       var bmp = new Bitmap(input, width, height); 
       var ms = new MemoryStream();
       bmp.Save(ms, ImageFormat.Png); 
       ms.Position = 0; 
       return ms; 

The code for the controller is pretty straightforward as well:

public ActionResult ThumbImage(int id,int width,int height)
   var d = _rDocument.GetById(id);
   Image i=null;
      i = Image.FromFile(d.PhysicalFilename);
      return new Be.Corebvba.MVC.ImageResult(i, width, height);
   catch (Exception ex)
      i = new Bitmap(1, 1);
      return new Be.Corebvba.MVC.ImageResult(i,1,1);
      if (i != null) i.Dispose();

This does need some better error handling, but I suppose you get the idea... (The _rDocument is a pointer to a Document repository which stores physical files.) If you access your images from a database, you could simply use Image.FromStream instead of an Image.FromFile. In my document, I reference the image as follows, et voila, automatic thumbnails:

<% var imgurl = Url.Action("ThumbImage", "Documents", 
                new { id = d.ID,width=100,height=100 }); %>
<img src="<%=imgurl %>" style="float:left"/>


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Tom Janssens
Founder Core bvba
Belgium Belgium
Tom Janssens, owner of Core, a software and consultancy company.
Father of two sons named Quinten & Matisse, and married to a beautiful woman named Liesbeth.


You may also be interested in...

Comments and Discussions

QuestionDispose Bitmap Pin
wout de zeeuw25-Sep-12 0:50
memberwout de zeeuw25-Sep-12 0:50 
AnswerRe: Dispose Bitmap Pin
Tom Janssens25-Sep-12 1:14
memberTom Janssens25-Sep-12 1:14 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.160212.1 | Last Updated 7 Oct 2009
Article Copyright 2009 by Tom Janssens
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid