Image Resizing Methods

For use with image resizing functions like GfxResizeImageBlobWithMethod.

The following properties can be set in the resizing method:

Only the method is required, all other cells are optional, unless required for specific methods. See below for a description of each of the supported methods.

To illustrate the different methods, the following reference image is used:
 (225x150)

none

The image is left untouched and returned as-is.

fit

If either the width of the image is larger than setwidth or the height is larger than setheight, the image is scaled down proportionally to fit within setwidth and setheight. If only one of setwidth or setheight is given, only the given direction is checked. This only make the image smaller if it's too big.

[ method := "fit", setwidth := 100, setheight := 100 ]
 (100x67)

[ method := "fit", setwidth := 300, setheight := 300 ]
 (225x150)

[ method := "fit", setwidth := 100, setheight := 0 ]
 (100x67)

[ method := "fit", setwidth := 0, setheight := 100 ]
 (150x100)

[ method := "fit", setwidth := 300, setheight := 0 ]
 (225x150)

[ method := "fit", setwidth := 0, setheight := 300 ]
 (225x150)

scale

The same as fit, but if the image is also scaled up proportionally if it's smaller than the given setwidth or setheight. Equivalent to CSS: "background-size: contain;".

[ method := "scale", setwidth := 100, setheight := 100 ]
 (100x67)

[ method := "scale", setwidth := 300, setheight := 300 ]
 (300x200)

[ method := "scale", setwidth := 100, setheight := 0 ]
 (100x67)

[ method := "scale", setwidth := 0, setheight := 100 ]
 (150x100)

[ method := "scale", setwidth := 300, setheight := 0 ]
 (300x200)

[ method := "scale", setwidth := 0, setheight := 300 ]
 (450x300)

crop

The image is cropped to the given dimensions without being resized. Both setwidth and setheight must be specified.

[ method := "crop", setwidth := 100, setheight := 100 ]
(100x100)

[ method := "crop", setwidth := 300, setheight := 300 ]
(225x150)

[ method := "crop", setwidth := 100, setheight := 300 ]
(100x150)

fitcanvas, scalecanvas, cropcanvas

The same as fitscale and crop but if both setwidth and setheight are given, the resulting image will always be setwidth by setheight pixels. Any portion of the resulting canvas not covered by the orignal (scaled) image is filled with bgcolor.

[ method := "fitcanvas", setwidth := 100, setheight := 100, bgcolor := "red" ]
 (100x100)

[ method := "fitcanvas", setwidth := 300, setheight := 300, bgcolor := "red" ]
 (300x300)

[ method := "scalecanvas", setwidth := 100, setheight := 100, bgcolor := "red" ]
 (100x100)

[ method := "scalecanvas", setwidth := 300, setheight := 300, bgcolor := "red" ]
 (300x300)

[ method := "cropcanvas", setwidth := 300, setheight := 300, bgcolor := "red" ]
(300x300)

[ method := "cropcanvas", setwidth := 100, setheight := 300, bgcolor := "red" ]
(100x300)

fill

The image is scaled proportionally until it covers the setwidth by setheight area. If only one of setwidth and setheight is given, it behaves like the scale method, otherwise equivalent to CSS: "background-size: cover;".

[ method := "fill", setwidth := 100, setheight := 100 ]
 (100x100)

[ method := "fill", setwidth := 300, setheight := 300 ]
 (300x300)

stretch

The image is resized to setwidth by setheight pixels, regardless of its proportions. If only one of setwidth and setheight is given, it behaves like the scale method.

[ method := "stretch", setwidth := 100, setheight := 100 ]
 (100x100)

[ method := "stretch", setwidth := 300, setheight := 300 ]
 (300x300)

stretch-x, stretch-y

stretch-x scales the image to the width and then constrains the height, resizing if necessary, while stretch-y scales the height and then constrains the width.

[ method := "stretch-x", setwidth := 100, setheight := 100 ]
 (100x67)

[ method := "stretch-x", setwidth := 300, setheight := 300 ]
 (300x200)

[ method := "stretch-y", setwidth := 100, setheight := 100 ]
 (100x100)

[ method := "stretch-y", setwidth := 300, setheight := 300 ]
 (300x300)

Comments