Resizing an image after loading it from the database using asp.net, C#

Question

I have a user-uploaded image pulled from the database that I am resizing smaller to display on a web page that I intend to print. I thought about saving a smaller version when the user uploads it, but since the design of this document hasn't been finalized yet, I was looking for something more dynamic. Also, this document only needs to be printed up once, while the image uploaded is displayed at various places in the app numerous times.

Using javascript to resize it while keeping its proportions, it was printing fine for a while. After adding a margin for styling, the printer started printing the image at its full size. I'm assuming it's the margin. It looks fine on screen but pushes everything off the page on paper.

This led me to look into resizing it on the server, in the C# code, but we use user images uploaded to the database, and I can't seem to find the right time or place in the page life cycle to access and change the width and height. I've tried the various methods on the web using Bitmaps, but they all want a file, when I am using a FileDownloader page as the image url.

Perhaps I'm looking in the wrong place entirely and need to go back to the client. Advice and help is appreciated.

Answer 1

Could you implement such a process:

• User sends an image
• Image is opened by a function/routine/script, while the user waits
• Image is resized on the fly and saved in the correct location which returns a code for success
• User receives a message depending of the return value of the script.

EDIT:

I agree with most of the replies you got here.

If the pictures are stored in a database you need to first make thumbmails for all pictures and put them in the same database, then you need to implement a process to create the thumbmails on the fly when adding new pictures.

Answer 2

When you are going to have to resize an image to known constraints, and there's the possibility of having to do that multiple times, I'd always advocate doing the resize once (on upload) and storing the result. Of course, you don't say that you need to retain the original image size, but if you do, then you just have to store the image twice - once original size and once at the resized dimensions.

Once you've done that, you can worry about defining your print layout based on the known dimensions of the resized image, and not have to faff about resizing for each use.

Answer 3

I would suggest converting on upload and possibly saving both images in case you want to let the user click through to the full image. Using this model you only do the conversion once and can render either size image. The GetThumbnailImage() method on the Image class will do what you desire, something like this:

String imageFile = uploadedFileName;
Image baseImage = Image.FromFile(imageFile);
Image thumbImage = baseImage.GetThumbnailImage(300,300,..., ...);
SaveMyImage(baseImage);
SaveMyImage(thumbImage);

Be sure to check the documentation for the parameters to GetThumbnailImage() to verify scaling issues and callback handling.

Answer 4

As long as your FileDownloader page returns the proper resized image, it shouldn't matter that you're not point to an actual image.

I'd something like this in your FileDownloader page (pseudo code):

using (Image img = LoadImageFromDatabase())
{
    using (Image resized = ResizeImage(img))
    {
     Response.Clear();
     // Set proper headers
     using (MemoryStream ms = new MemoryStream())
     {
      resized.Save(ms); // maybe the function isn't called Save, can't remember a 100%
      ms.Seek(0); // Can't remember if this is necessary
      Response.BinaryWrite(ms);
     }
    }
}

Like I mentioned it's highly pseudo code, but it should be straight forward with a Visual Studio open, I just haven't access to it right now, and it's been quite a while since I last used this (since I'm stored the resized images like most other in this question recommends - I do so too, however I realize this is not an option for you)