Proportionally Resize an Image: Creating Thumbnail Graphics

Young woman usign laptop in office
Geber86 / Getty Images

In graphics "programming" a thumbnail is a reduced-size version of a picture.

Here's an idea for your next application: create a "form picker" to let users easily select and navigate through open forms by displaying thumbnails of them all in a dialog window.

Interesting idea? Sounds like the "Quick Tabs" feature of the IE 7 browser :)

Before actually creating such a neat feature for your next Delphi application, you need to know how to grab the image of the form ("form-screen shot") and how to proportionally resize it to the desired thumbnail image.

Proportional Picture Resizing: Creating Thumbnail Graphics

Below you will find a block of code to take the image of a form (Form1) by using the GetFormImage method. The resulting TBitmap is then resized to fit the maximum thumbnail width (200 pixels) and/or height (150 pixels).
Resizing maintains the aspect ratio of the image.

The resulting image is then displayed in a TImage control, named "Image1".

   maxWidth = 200;
   maxHeight = 150;
   thumbnail : TBitmap;
   thumbRect : TRect;
   thumbnail := Form1.GetFormImage;
     thumbRect.Left := 0;
     thumbRect.Top := 0;
     //proportional resize
     if thumbnail.Width > thumbnail.Height then
       thumbRect.Right := maxWidth;
       thumbRect.Bottom := (maxWidth * thumbnail.Height) div thumbnail.Width;
       thumbRect.Bottom := maxHeight;
       thumbRect.Right := (maxHeight * thumbnail.Width) div thumbnail.Height;
     thumbnail.Canvas.StretchDraw(thumbRect, thumbnail) ;
//resize image
     thumbnail.Width := thumbRect.Right;
    thumbnail.Height := thumbRect.Bottom;
     //display in a TImage control
     Image1.Picture.Assign(thumbnail) ;

Note: The GetFormImage only copies the form client area - if you need to take the entire "screen shot" of a form (including its border) you'll need a different approach ...more about it next time.

mla apa chicago
Your Citation
Gajic, Zarko. "Proportionally Resize an Image: Creating Thumbnail Graphics." ThoughtCo, Jun. 5, 2017, Gajic, Zarko. (2017, June 5). Proportionally Resize an Image: Creating Thumbnail Graphics. Retrieved from Gajic, Zarko. "Proportionally Resize an Image: Creating Thumbnail Graphics." ThoughtCo. (accessed March 18, 2018).