Image Cropper

Description:

Image Cropper

Image Cropper is an comonenet used to crop an image before uploading.

Allowed Parent Components:

1. Card Body

2. Col

3. Form

Allowed Child Components:

1. Popover

2. Pulse

3. Trigger After Upload Attachment

4. Trigger Before Render

5. Trigger Before Upload Attachment

Properties

➤ View Attribute

Select the view attribute associated to this field.

Allowed Values: Select the view attribute associated to this field.

➤ Src

The image src is an optional property treated like a candidate image with a pixel density descriptor 1x.

Allowed Values: An expression which should return string after evaluation

➤ Alt

Allowed Values: Free text field

➤ Height

Provide numerical values to set height.

Allowed Values: Any number value

➤ Width

Provide numerical values to set width.

Allowed Values: Any number value

➤ Fixed Ratio

Enable this to crop picture with same height and width.

Allowed Values: Yes/No

➤ On Submit

Allowed Values: Controller Function

➤ On After Upload

Allowed Values: Controller Function

➤ On Before Upload

Allowed Values: Controller Function

➤ Margin

Select a value to add margin on all four sides of the component. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.

Allowed Values: Any number value

➤ Margin Bottom

Select a value to add margin on the bottom of the component.

Allowed Values: Any number value

➤ Margin Left

Select a value to add margin on the left of the component.

Allowed Values: Any number value

➤ Margin Right

Select a value to add margin on the right of the component.

Allowed Values: Any number value

➤ Margin Top

Select a value to add margin on the top of the component.

Allowed Values: Any number value

➤ Padding

Select a value to add padding on all four sides of the component. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.

Allowed Values: Any number value

➤ Padding Bottom

Select a value to add padding in the bottom of the component.

Allowed Values: Any number value

➤ Padding Left

Select a value to add padding in the left of the component.

Allowed Values: Any number value

➤ Padding Right

Select a value to add padding in right of the component.

Allowed Values: Any number value

➤ Padding Top

Select a value to add padding in top of the component.

Allowed Values: Any number value