Post
Ask Question

Resize Image before Uploading

For this task we use some library and method.

Steps:

  1. Create a sample ASP.NET Website, add new web form.

  2. Paste the below design code into aspx page.
    1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
    2.   
    3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    4. <html xmlns="http://www.w3.org/1999/xhtml">  
    5. <head runat="server">  
    6.     <title></title>  
    7. </head>  
    8. <body>  
    9.     <form id="form1" runat="server">  
    10.     <div>  
    11.         <asp:FileUpload ID="FileUpload1" runat="server" />  
    12.         <br />  
    13.         <asp:Button ID="Button1" runat="server" Text="Upload" onclick="Button1_Click" />  
    14.         <br />  
    15.         <!-- To display the Size of image -->  
    16.         <span>Size Before Resize : </span>  
    17.         <asp:Label ID="Label1" runat="server" Text=""></asp:Label>  
    18.         <br />  
    19.         <span>Size After Resize : </span>  
    20.         <asp:Label ID="Label2" runat="server" Text=""></asp:Label>  
    21.         <br />  
    22.         <!-- To display the Resize Image -->  
    23.         <asp:Image ID="Image1" runat="server" />  
    24.     </div>  
    25.     </form>  
    26. </body>  
    27. </html>  
  3. Now use the following code into Button1_Click event on aspx.cs page:
    1. protected void Button1_Click(object sender, EventArgs e)  
    2. {  
    3.     // Check file exist or not  
    4.     if (FileUpload1.PostedFile != null)  
    5.     {  
    6.         // Check the extension of image  
    7.         string extension = Path.GetExtension(FileUpload1.FileName);  
    8.         if (extension.ToLower() == ".png" || extension.ToLower() == ".jpg")  
    9.         {  
    10.             Stream strm=FileUpload1.PostedFile.InputStream;  
    11.             using (var image = System.Drawing.Image.FromStream(strm))  
    12.             {  
    13.                 // Print Original Size of file (Height or Width)   
    14.                 Label1.Text = image.Size.ToString();  
    15.                 int newWidth = 240; // New Width of Image in Pixel  
    16.                 int newHeight = 240; // New Height of Image in Pixel  
    17.                 var thumbImg = new Bitmap(newWidth, newHeight);  
    18.                 var thumbGraph = Graphics.FromImage(thumbImg);  
    19.                 thumbGraph.CompositingQuality = CompositingQuality.HighQuality;  
    20.                 thumbGraph.SmoothingMode = SmoothingMode.HighQuality;  
    21.                 thumbGraph.InterpolationMode = InterpolationMode.HighQualityBicubic;  
    22.                 var imgRectangle = new Rectangle(0, 0, newWidth, newHeight);  
    23.                 thumbGraph.DrawImage(image, imgRectangle);  
    24.                 // Save the file  
    25.                 string targetPath = Server.MapPath(@"~\Images\") + FileUpload1.FileName;  
    26.                 thumbImg.Save(targetPath, image.RawFormat);  
    27.                 // Print new Size of file (height or Width)  
    28.                 Label2.Text = thumbImg.Size.ToString();  
    29.                 //Show Image  
    30.                 Image1.ImageUrl = @"~\Images\" + FileUpload1.FileName;  
    31.             }  
    32.         }  
    33.     }  
    34. }  
    Note: Before using above code you must use the Following Namespace:

     

    1. using System.Drawing;  
    2. using System.Drawing.Drawing2D;  
    3. using System.IO;  

     

  4. Now run the website and upload and image.

    upload image

Thanks for reading.
Next Recommended Reading How To Upload Image And Save Image In Project Folder In MVC