CodeCarvings Piczard V1.2 Help
Interactively crop and/or resize an image
Send Feedback
Piczard Fundamentals - Web > PictureTrimmer > Interactively crop and/or resize an image

Glossary Item Box


  1. Crop enabled
  2. Crop disabled
  3. The image resize feature


You can choose to enable / disable the crop feature while loading a new image in the PictureTrimmer control.

The following methods are available in order to load a new image in the PictureTrimmer control:

Each method provides several overloads that allow to use different kind of parameters.



1. Crop enabled

In order to enable the crop feature, you have to pass an instance of the CropConstraint class to one of the "Load" method of the PictureTrimmer control

The CropConstraint class is an Image processing filter (please see How Piczard Works).
However the PictureTrimmer controls use the same class to handle the crop settings.

You can use every type of crop constraint:

Fixed size crop 350x250 pixel Copy Code
CropConstraint cropConstrant = new FixedCropConstraint(GfxUnit.Pixel, 350, 250);
cropConstrant.DefaultImageSelectionStrategy = CropConstraintImageSelectionStrategy.WholeImage;
"~/src.jpg", cropConstrant);
Please see the Example A.302 - "Web - PictureTrimmer / Crop enabled".



2. Crop disabled

If you want to disable the crop feature there are 2 ways:

  1. Use one of the "Load" method which do not require the parameter CropConstraint
  2. Pass null as CropConstraint parameter to one of the "Load" method
Crop disabled Copy Code
Please see the Example A.303 - "Web - PictureTrimmer/ Crop disabled".



3. The image resize feature

First of all let's say that you cannot force a PictureTrimmer control to not automatically resize an image if it is necessary to do so.
For example, suppose that you use the following code to load an image having size 50x50 pixel:

Copy Code
CropConstraint cropConstrant = new FixedCropConstraint(GfxUnit.Pixel, 100, 100);
cropConstrant.DefaultImageSelectionStrategy = CropConstraintImageSelectionStrategy.Slice;
"~/src_50x50.jpg", cropConstrant);

As you can see, the code uses a fixed size crop constraint (100 x 100 pixels / no margins) - while - the source image is 50 x 50 pixels.
In this case the PictureTrimmer control is forced to resize the image (ResizeFactor = 200%).

The first step in order to control the resize feature is to use the right CropConstraint parameters.

For example, if you absolutely don't want to resize the image, you can use the CropConstraintImageSelectionStrategy.DoNotResize option and use the automatic margins feature:

Copy Code
CropConstraint cropConstrant = new FixedCropConstraint(GfxUnit.Pixel, 100, 100);
// Disable resize
cropConstrant.DefaultImageSelectionStrategy = CropConstraintImageSelectionStrategy.DoNotResize;
// Load the image
InlinePictureTrimmer1.LoadImageFromFileSystem("~/src_50x50.jpg", cropConstrant);
// Set the canvas color (if the image is smaller than 100x100 pixel)
InlinePictureTrimmer1.CanvasColor = BackgroundColor.GetStatic(System.Drawing.Color.Red);

Obviously, if the crop feature is disabled, this problem does not exist and you only need to configure the parameters that control the interactive resizing of images.


You can always configure a PictureTrimmer control so that users cannot interactively resize images.

Users can interactively resize images in 2 ways:

  • By using the controls contained in the "resize panel" (please see the figure 1 - point 1)
  • By dragging the "crop handles"* (please see the figure 1 - point 2)

* = Only if the crop feature is enabled - and - the current CropConstraint is a FixedCropConstraint.

Figure 1: How users can resize images in an interactive way.


You can control the interactive resize feature by using the following 2 properties of the PictureTrimmer control:


The zoom feature (please see ShowZoomPanel) does not control the final size of the generated image.
It 's just a function that lets you enlarge or shrink the view within a PictureTrimmer control.


©2013 Sergio Turolla. All Rights Reserved.