Image thumbnails

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • tmeers
    New Member
    • Mar 2007
    • 16

    Image thumbnails

    I have done some reading on this and my thumb nail generation works great with a few exceptions, this is what I need help with.

    My code:

    Code:
            public static byte[] ResizeImageFile(byte[] imageFile, int targetSize)
            {
                using (System.Drawing.Image oldImage = System.Drawing.Image.FromStream(new MemoryStream(imageFile)))
                {
                    Size newSize = CalculateDimensions(oldImage.Size, targetSize);
    
                    using (Bitmap newImage = new Bitmap(newSize.Width, newSize.Height, PixelFormat.Format24bppRgb))
                    {
                        using (Graphics canvas = Graphics.FromImage(newImage))
                        {
                            canvas.SmoothingMode = SmoothingMode.AntiAlias;
                            canvas.InterpolationMode = InterpolationMode.HighQualityBicubic;
                            canvas.PixelOffsetMode = PixelOffsetMode.HighQuality;
                            canvas.DrawImage(oldImage, new Rectangle(new Point(0, 0), newSize));
                            MemoryStream m = new MemoryStream();
                            newImage.Save(m, ImageFormat.Jpeg);
                            return m.GetBuffer();
                        }
                    }
    
                }
            }
    
            private static Size CalculateDimensions(Size oldSize, int targetSize)
            {
                Size newSize = new Size();
                if (oldSize.Width > oldSize.Height)
                {
                    newSize.Width = targetSize;
                    newSize.Height = (int)(oldSize.Height * (float)targetSize / (float)oldSize.Width);
                }
                else
                {
                    newSize.Width = (int)(oldSize.Width * (float)targetSize / (float)oldSize.Height);
                    newSize.Height = targetSize;
                }
                return newSize;
            }
    I am passing the targetSize and imageFile byte stream from the front end and streaming out 4 different sizes to be saved into a database for later use. And agian all is working well for large images. But when it comes to protrait and and images smaller than those being thumbnailed it goes astray. I read the post on dontnetslackers .com and changed a little in the CalculateSize method. Heres what happens:

    Case 1: Images smaller than the thumbnailed size (small 100px, medium 250px, large 500px, and xlarge 700px respectivly) expand the width to the target size and the height gets chopped off.
    Samples: Original, large, xLarge

    Case 2: Images that are portrait and the width is smaller than the target size, expand the width to the target size and grow the height to meet the new width respectivly.
    Samples: Original, large, xLarge

    What I'm needing to do:

    Case 1, If the width is smaller than the target size I want to keep the existing width, and height.
    Case 2, Adjust the height to be the new target size wile maintaining the correct aspect ratio.

    Any help would be grand. Also currently I do not have cacheing in place for the UI to use but that will come with time (maybe). Currently the system operates solely from the database with no dependance on the file system and I'm trying to keep it that way hence why I'm storing the thumbs in the database.

    Thanks,
    Tim
  • Plater
    Recognized Expert Expert
    • Apr 2007
    • 7872

    #2
    Is there a reason why you don't use the built in .GetThumbnailIm age() function?

    Comment

    • tmeers
      New Member
      • Mar 2007
      • 16

      #3
      The goal is to create images with an aspect ratio that is the same as the original image. Also doing it this way I can tweak the quality of the generated image and crank it as high or low as I need it to be, from garbage windows 3.1 looking images to as perfect as the original (or darn close).

      The code works perfect for the 100px and 250px images, it's just when it starts to get larger than the original in width or height that it gets the glitch.

      Tim

      Comment

      • Plater
        Recognized Expert Expert
        • Apr 2007
        • 7872

        #4
        Well in those situations that you mentioned, could you use DrawImageUnscal ed() to your advantage?

        Comment

        • tmeers
          New Member
          • Mar 2007
          • 16

          #5
          Maybe? I'm really not sure because the images are generated correctly when the original is at least as large as the reduced sized image. Correct examples: Large http://gettinlucky.dyndns.org/large/612, Original http://gettinlucky.dyndns.org/612.ashx

          How would the DrawImageUnscal ed() even work?
          Tim

          Comment

          • Plater
            Recognized Expert Expert
            • Apr 2007
            • 7872

            #6
            Actually I guess I am still not clear what you want to do with the special cases.
            I understand that if the original image is smaller then what you are trying to make, it can do wierd streching things.
            What I would propose is that you compute the largest inscrbibed rectangle that matches the correct aspect ratio of the original image, but that still fits withen the thumbnail size bounds. Draw you image to that size(with stretching) and the draw it UNSCALED onto a blank image of the thumbnail size.
            This will produce a white(or whatever background color you want) border in places where the original image did match the thumbnail size exactly.
            Kind of like the way letterboxing works when you watch a widescreen format video on a regular tv.

            Comment

            Working...