Click here to Skip to main content
13,139,773 members (63,855 online)
Click here to Skip to main content
Add your own
alternative version


18 bookmarked
Posted 7 Oct 2009

ASP.NET MVC ImageHandler for Thumbnails

, 7 Oct 2009
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 Virtual Sales Lab
Belgium Belgium

You may also be interested in...

Comments and Discussions

QuestionDispose Bitmap Pin
wout de zeeuw24-Sep-12 23:50
memberwout de zeeuw24-Sep-12 23:50 
AnswerRe: Dispose Bitmap Pin
Tom Janssens25-Sep-12 0:14
memberTom Janssens25-Sep-12 0: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.

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