Share a simple and practical thumbnail Method

Source: Internet
Author: User

I don't know how to scale down the thumbnails on your website?

A new project will be started soon. The company has developed a new habit of saving some practical programs.

I think this is a good habit. In the past, I just thought it was useful. Now I actually did this: "save all the useful programs"

This is what we want to be different from what we do.

 

There are several ways to create a thumbnail:

1. Filling Method

2. scale down by height

3. scale down by width

4. Removal Method

 

I will give a simple example to describe these methods and their shortcomings (because of their advantages ):

1. scale down image A according to A certain width and height. For example, the width and height of image A are 400*500, which is reduced to 200*250. In this way, the image is reduced by 1/2, but there is a problem. Suppose I want to scale down a 400*500 image to a 200*200 image. this figure is distorted.

2. scale by height and width refers to scale by the specified scale by height or width. For example, the width and height of A is 400*500, And I scale by width to 200, the width is 500*200/400 = 250. If I scale down to 200 by height, the height is 400*200/500 = 160. There is no big problem in this way, when displayed on the page, an arrangement is difficult to handle. friends who have handled the problem should remember the distress.

3. it is the width and height I want. For example, it is 300*300. I want to cut the image from 400*500 to 300*300. the rest will be abandoned. this scaling will make the image uploaded by the user invisible to some of them.

 

I want to come up with a method that is a compromise, that is, a fixed-size thumbnail is usually required on the webpage. If I am in an Information Section, scale down all images regardless of width or height to produce a 200*200 image as a news image. Using the 1st scaling method may deform the image, the second method cannot be used to scale down an image to 200*200. The third method will lose the image elements. so I think the better solution is this: first draw a 200*200 white background image, and then determine which side of the width and height of the image is large, assuming that the height> width, then scale down the image according to the height, and place the scaled image in the center to the 200*200 white background image to complete the scale-down.

 

The Code is as follows:

Thumbnail Method /// <Summary>
/// Generate a thumbnail
/// </Summary>
/// <Param name = "originalImagePath"> source image path (physical path) </param>
/// <Param name = "thumbnailPath"> thumbnail path (physical path) </param>
/// <Param name = "destLengthwidth"> width and height of the thumbnail </param>
Public static void MakeThumbnail (string originalImagePath, string thumbnailPath, int destLength ){
Image originalImage = Image. FromFile (originalImagePath );

Int ow = originalImage. Width;
Int oh = originalImage. Height;

If (ow> oh ){
Oh = oh * destLength/ow;
Ow = destLength;
}
Else {
Ow = ow * destLength/oh;
Oh = destLength;
}

Int x = (destLength-ow)/2;
Int y = (destLength-oh)/2;

Image bitmap = new System. Drawing. Bitmap (destLength, destLength );

// Create a canvas
Graphics g = System. Drawing. Graphics. FromI

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.