Skip to content

ItemLayout

Defined in: core/items/ilayout.ts:500

new ItemLayout(): ItemLayout

ItemLayout

bringForward(): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:1204

return: Promise

Move item one level up in the z-index (to the front)

Chainable.

item.bringForward().then(function(item) {
// Promise resolves with same Item instance
});

Promise<ItemLayout>

IItemLayout.bringForward


bringToFront(): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:1220

return: Promise

Move item to highest level in the z-index (to the absolute front)

Chainable.

item.bringToFront().then(function(item) {
// Promise resolves with same Item instance
});

Promise<ItemLayout>

IItemLayout.bringToFront


getCanvasRotate(): Promise<number>

Defined in: core/items/ilayout.ts:728

return: Promise

Get canvas rotation of the item

item.getCanvasRotate().then(function(deg) {
// The rest of your code here
});

Promise<number>

IItemLayout.getCanvasRotate


getCropping(): Promise<Object>

Defined in: core/items/ilayout.ts:683

return: Promise

Get the cropping of the item

This returns an object with properties of left, top, right, and bottom whose values are between 0 - 1. This object is not a coordinate system. Top value indicates the portion of the item removed(cropped) from the top, left value indicates the portion of the item removed from the left, and so on.

item.getCropping().then(function(crop) {
// The rest of your code here
var left = crop.left;
var top = crop.top;
var right = crop.right;
var bottom = crop.bottom;
});

Promise<Object>

IItemLayout.getCropping


getEnhancedRotate(): Promise<number>

Defined in: core/items/ilayout.ts:753

return: Promise

Get the z-rotation value as can be seen in the item properties window. This value takes into account rotateZ along with canvas rotation.

item.getEnhancedRotate().then(function(deg) {
// The rest of your code here
});

Promise<number>

IItemLayout.getEnhancedRotate


getPosition(output?): Promise<Rectangle>

Defined in: core/items/ilayout.ts:590

return: Promise

Get the position of the item

See also: #util/Rectangle Util/Rectangle

item.getPosition().then(function(pos) {
// The rest of your code here
});

number = 0

Promise<Rectangle>

IItemLayout.getPosition


getRotateX(): Promise<number>

Defined in: core/items/ilayout.ts:639

return: Promise

Get Rotate X value of the item

item.getRotateX().then(function(deg) {
// The rest of your code here
});

Promise<number>

IItemLayout.getRotateX


getRotateY(): Promise<number>

Defined in: core/items/ilayout.ts:617

return: Promise

Get Rotate Y value of the item

item.getRotateY().then(function(deg) {
// The rest of your code here
});

Promise<number>

IItemLayout.getRotateY


getRotateZ(): Promise<number>

Defined in: core/items/ilayout.ts:661

return: Promise

Get Rotate Z value of the item.

item.getRotateX().then(function(deg) {
// The rest of your code here
});

Promise<number>

IItemLayout.getRotateZ


isEnhancedResizeEnabled(): Promise<boolean>

Defined in: core/items/ilayout.ts:574

return: Promise

Check if Enhance Resize is Enabled or Disabled

item.isEnhancedResizeEnabled().then(function(bool) {
// The rest of your code here
});

Promise<boolean>

IItemLayout.isEnhancedResizeEnabled


isKeepAspectRatio(): Promise<boolean>

Defined in: core/items/ilayout.ts:542

return: Promise

Check if Aspect Ratio is set to ON or OFF

item.isKeepAspectRatio().then(function(bool) {
// The rest of your code here
});

Promise<boolean>

IItemLayout.isKeepAspectRatio


isPositionLocked(): Promise<boolean>

Defined in: core/items/ilayout.ts:558

return: Promise

Check if Position Locked is set to ON or OFF

item.isPositionLocked().then(function(bool) {
// The rest of your code here
});

Promise<boolean>

IItemLayout.isPositionLocked


sendBackward(): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:1212

return: Promise

Move item one level down in the z-index (to the back)

Chainable.

item.sendBackward().then(function(item) {
// Promise resolves with same Item instance
});

Promise<ItemLayout>

IItemLayout.sendBackward


sendToBack(): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:1260

return: Promise

Move item to lowest level in the z-index (to the absolute back)

Chainable.

item.sendToBack().then(function(item) {
// Promise resolves with same Item instance
});

Promise<ItemLayout>

IItemLayout.sendToBack


setCanvasRotate(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:741

param: (value: number)

return: Promise<Item>

Set canvas rotation of the item (possible values - 0, 90, 180, 270)

Chainable.

item.setCanvasRotate(90).then(function(item) {
// Promise resolves with same Item instance
});

number

Promise<ItemLayout>

IItemLayout.setCanvasRotate


setCropping(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:697

param: (value: Object)

Set Item cropping.

This accepts an object with properties left, top, right, and bottom whose values are between 0 - 1. This object is not a coordinate system. Top value indicates the portion of the item removed(cropped) from the top, left value indicates the portion of the item removed from the left, and so on.

Chainable.

Please do note that this method will NOT automatically modify/calculate the height and width of the item whenever you modify cropping, unlike the behavior of XBC when modifying it through the properties window.

You will need to manually modify the height and width of the item each time you modify this value to get the best results. If not, it might result to the stretching and/or shrinking of the item.

var obj = {};
obj.left = 0.1;
obj.top = 0.2;
obj.right = 0;
obj.bottom = 0.1;
item.setCropping(obj).then(function(item) {
// Promise resolves with same Item instance
});

Object

Promise<ItemLayout>

IItemLayout.setCropping


setCroppingEnhanced(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:869

param: (value: Object)

Set item cropping while automatically calculating and modifying width and height to account for the cropped value.

This accepts an object with properties left, top, right, and bottom whose values are between 0 - 1. This object is not a coordinate system. Top value indicates the portion of the item removed(cropped) from the top, left value indicates the portion of the item removed from the left, and so on.

Chainable.

This behaves the same as in the item properties window and is done to prevent item stretching.

var obj = {};
obj.left = 0.1;
obj.top = 0.2;
obj.right = 0;
obj.bottom = 0.1;
item.setCroppingEnhanced(obj).then(function(item) {
// Promise resolves with same Item instance
});

Object

Promise<ItemLayout>

IItemLayout.setCroppingEnhanced


setEnhancedResizeEnabled(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:582

param: (value: boolean)

return: Promise<Item>

Set Enhance Resize to ON or OFF

Chainable.

item.setEnhancedResizeEnabled(true).then(function(item) {
// Promise resolves with same Item instance
});

boolean

Promise<ItemLayout>

IItemLayout.setEnhancedResizeEnabled


setEnhancedRotate(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:772

param: (value: number)

return: Promise<Item>

Set Rotate Z value of the item, also taking into account canvas rotation.

Chainable.

This method automatically modifies/calculates the height and width of the item whenever you modify the z-rotation value, changing its orientation (vertical / horizontal) at certain angles. This behavior is what is exhibited in the item properties window.

item.setEnhancedRotate(30).then(function(item) {
// Promise resolves with same Item instance
});

number

Promise<ItemLayout>

IItemLayout.setEnhancedRotate


setKeepAspectRatio(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:550

param: (value: boolean)

return: Promise<Item>

Set Aspect Ratio to ON or OFF

Chainable.

item.setKeepAspectRatio(true).then(function(item) {
// Promise resolves with same Item instance
});

boolean

Promise<ItemLayout>

IItemLayout.setKeepAspectRatio


setPosition(value, output?): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:605

param: (value: Rectangle, output: number = 0)

Set Item Position. Relative coordinates (0-1) are required.

Chainable.

var rect = xjs.Rectangle.fromCoordinates(0, 0, 1, 1);
item.setPosition(rect).then(function(item) {
// Promise resolves with same Item instance
});

See also: #util/Rectangle Util/Rectangle

Rectangle

number = 0

Promise<ItemLayout>

IItemLayout.setPosition


setPositionLocked(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:566

param: (value: boolean)

return: Promise<Item>

Set Position Lock to ON or OFF

Chainable.

item.setPositionLocked(true).then(function(item) {
// Promise resolves with same Item instance
});

boolean

Promise<ItemLayout>

IItemLayout.setPositionLocked


setRotateX(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:647

param: (value: number)

return: Promise<Item>

Set Rotate X value of the item

Chainable.

item.setRotateX(30).then(function(item) {
// Promise resolves with same Item instance
});

number

Promise<ItemLayout>

IItemLayout.setRotateX


setRotateY(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:625

param: (value: number)

return: Promise<Item>

Set Rotate Y value of the item

Chainable.

item.setRotateY(30).then(function(item) {
// Promise resolves with same Item instance
});

number

Promise<ItemLayout>

IItemLayout.setRotateY


setRotateZ(value): Promise<ItemLayout>

Defined in: core/items/ilayout.ts:669

param: (value: number)

return: Promise<Item>

Set Rotate Z value of the item.

Chainable.

Please do note that this method will NOT automatically modify/calculate the height and width of the item whenever you modify the rotate Z value, unlike the behavior of XBC when modifying it through the properties window.

You will need to manually modify the height and width of the item each time you modify this value to get the best results. If not, it might result to the stretching and/or shrinking of the item.

item.setRotateZ(30).then(function(item) {
// Promise resolves with same Item instance
});

number

Promise<ItemLayout>

IItemLayout.setRotateZ