Stacks API

Come build with us.
Stacks API v10 for Stacks 3.5


  <  


Image Transform — imageTransform

This content is open source. You can edit it and submit a pull request on GitHub.
This page is generated from this file.


© . YourHead Software all rights reserved.

Image Transform — imageTransform

Available: Stacks API v3

A virtual control to transform any image.

Image transforms give developers access to all the image editing functionality within Stacks, but fully controlled by the developer. You can scale, rotate, and apply borders and shadows.

Image transforms can take an image well or an %image% stack as input. Many transforms can be applied to the same image (e.g., to output several different sizes of an image).

Image transforms are especially useful for creating thumbnail images that must be small and cropped to a specific dimension.


ID

The ID for this control. This ID must be unique within this stack. The ID is used to refer to the control's property. IDs should be alpha-numeric (dashes and underscores are allowed), but should not contain special characters.


Input Image ID

The Input Image ID can come from either another Image control or from an %image% template (an image dropped into your stack by the user). The Input Image ID should be one of the following:




Scale Mode

The scale mode defines how the image is cropped to fit within the specified scale, width, and height. To get a visual idea of how these modes works, double click an image in Stacks and adjust the scale settings there.




Scale

When the Scale Mode property is set to 1 (Scale to Fill), you may either define a scale percent, width/height maximums, or both. If both or set, then the Max Width and Max Height properties take precedence.


Max Width

The Max Width will add a maximum width constraint to the image. This constraint is only applied if the value is non-zero and the Max Width Enable property is enabled. This constraint will take precedence over other properties (such as the Scale property.)


Max Height

The Max Height will add a maximum height constraint to the image. This constraint is only applied if the value is non-zero and the Max Height Enable property is enabled. This constraint will take precedence over other properties (such as the Scale property.)


Max Width Enable

Enabling the Max Width will add the maximum width constraint to the image specified in the Max Width property. This constraint will take precedence over other properties (such as the Scale property.)


Max Height Enable

Enabling the Max Height will add the maximum height constraint to the image specified in the Max Height property. This constraint will take precedence over other properties (such as the Scale property.)


Rotation

The amount of rotation (in degrees) to rotate the image. The rotation is not done in CSS. The image is rotated and rerendered. Note that image rotations of just a few degrees, especially of smaller images, can lead to artifacts.


Border Width

The width of the border. Borders are rendered into the image (not CSS).


Border Color

The color of the border. Borders are rendered into the image (not CSS).


Shadow Color

The color of the shadow. Light colors can be used for a glow effect. Shadows are rendered into the image (not CSS).


Shadow Opacity

The opacity of the shadow. Opacity of `0` is fully transparent and will disable the shadow. Shadows are rendered into the image (not CSS).


Shadow Blur

The amount of blur added to the shadow. Shadows are rendered into the image (not CSS).


Shadow Offset X

The offset of the shadow in the horizontal direction. Shadows are rendered into the image (not CSS).


Shadow Offset Y

The offset of the shadow in the vertical direction. Shadows are rendered into the image (not CSS).


© . YourHead Software all rights reserved.