Cropping/resizing image online

INTRODUCTION
We have come across many sites that upload the images and allow us to do cropping of images online. In this article I will show you, how to crop images online according to the requirement.

EXAMPLE

In this example I have made use of library file which has been provided by http://www.codeplex.com for cropping images. This example has been developed using this library file and jQuery.The library file can be accessed through the following link http://webcropimage.codeplex.com/.

Here I will demonstrate here a small example of cropping image using this library file.

In this example I will make use of file upload control to upload the image file and then crop the image using this library file.

The page will look somewhat like this.

First include the library (CS.WebControls.WebCropImage.dll) in to the project and add a reference to it.Add the library file to the toolbox.

Add the file upload control, two buttons, image control and webcropimage control in to the page.

Add the following property to the webcropimage control as shown below.

Add the following method to the .aspx.cs file.

The above method will check for the file type while uploading images files.

The above method will check for the file type and then upload a valid image file and show it in an image control.

The above code will crop the image and save it to a destination folder.

All the functionality is carried out by the library file, except some additional functionality which you will be requiring to upload image file.

You just need to set the required property of webcropimage control and the rest of the thing will be carried out by just adding few lines of code.

The demo project can be downloaded by accessing the following link