Skip to content

Crop Images in Android

In this example, we will show you how to use the CreativeEditor SDK’s CreativeEngine to modify a blocks crop through the block Api.

Common Properties

Common properties are properties that occur on multiple block types. For instance, fill color properties are available for all the shape blocks and the text block. That’s why we built convenient setter and getter functions for these properties. So you don’t have to use the generic setters and getters and don’t have to provide a specific property path. There are also has* functions to query if a block supports a set of common properties.

Crop

Manipulate the cropping region of a block by setting its scale, rotation, and translation.

fun supportsCrop(block: DesignBlock): Boolean

Query if the given block has crop properties.

  • block: the block to query.

  • Returns true if the block has crop properties, false otherwise.

fun setCropScaleX(
    block: DesignBlock,
    scaleX: Float,
)

Set the crop scale in x direction of the given design block.

Required scope: “layer/crop”

  • block: the block whose crop scale in x direction should be set.

  • scaleX: the crop scale in x direction.

fun setCropScaleY(
    block: DesignBlock,
    scaleY: Float,
)

Set the crop scale in y direction of the given design block.

Required scope: “layer/crop”

  • block: the block whose crop scale in y direction should be set.

  • scaleY: the crop scale in y direction.

fun setCropScaleRatio(
    block: DesignBlock,
    scaleRatio: Float,
)

Set the crop scale ratio of the given design block.

This will uniformly scale the content up or down. The center of the

scale operation is the center of the crop frame.

Required scope: “layer/crop”

  • block: the block whose crop scale ratio should be set.

  • scaleRatio: the rotation in radians.

fun setCropRotation(
    block: DesignBlock,
    rotation: Float,
)

Set the crop rotation of the given design block.

Required scope: “layer/crop”

  • block: the block whose crop rotation should be set.

  • rotation: the rotation in radians.

fun setCropTranslationX(
    block: DesignBlock,
    translationX: Float,
)

Set the crop translation in x direction of the given design block.

Required scope: “layer/crop”

  • block: the block whose crop translation in x direction should be set.

  • translationX: the translation in x direction.

fun setCropTranslationY(
    block: DesignBlock,
    translationY: Float,
)

Set the crop translation in y direction of the given design block.

Required scope: “layer/crop”

  • block: the block whose crop translation in y direction should be set.

  • translationY: the translation in y direction.

fun adjustCropToFillFrame(
    block: DesignBlock,
    minScaleRatio: Float,
)

Adjust the crop position/scale to at least fill the crop frame.

Required scope: “layer/crop”

  • block: the block to query.

  • minScaleRatio: the minimal crop scale ratio to go down to.

fun setContentFillMode(
    block: DesignBlock,
    mode: ContentFillMode,
)

Set a block’s content fill mode.

Required scope: “layer/crop”

  • block: the block to update.

  • mode: the content fill mode.

fun resetCrop(block: DesignBlock)

Resets the manually set crop of the given design block.

The block’s content fill mode is set to ContentFillMode.COVER.

If the block has a fill, the crop values are updated so that it covers the block.

Required scope: “layer/crop”

  • block: the block whose crop should be reset.
fun getCropScaleX(block: DesignBlock): Float

Get the crop scale in x direction of the given design block.

  • block: the block whose crop scale in x direction should be queried.

  • Returns the crop scale in x direction.

fun getCropScaleY(block: DesignBlock): Float

Get the crop scale in y direction of the given design block.

  • block: the block whose crop scale in y direction should be queried.

  • Returns the crop scale in y direction.

fun flipCropHorizontal(block: DesignBlock)

Adjusts the crop in order to flip the content along its own horizontal axis.

  • block: the block whose crop should be updated.
fun flipCropVertical(block: DesignBlock)

Adjusts the crop in order to flip the content along its own vertical axis.

  • block: the block whose crop should be updated.
fun getCropScaleRatio(block: DesignBlock): Float

Get the crop scale ratio of the given design block.

  • block: the block whose crop scale ratio should be queried.

  • Returns the crop scale ratio.

fun getCropRotation(block: DesignBlock): Float

Get the crop rotation of the given design block.

  • block: the block whose crop scale rotation should be queried.

  • Returns the crop rotation.

fun getCropTranslationX(block: DesignBlock): Float

Get the crop translation in x direction of the given design block.

  • block: the block whose crop translation in x direction should be queried.

  • Returns the crop translation in x direction.

fun getCropTranslationY(block: DesignBlock): Float

Get the crop translation in y direction of the given design block.

  • block: the block whose crop translation in y direction should be queried.

  • Returns the crop translation in y direction.

fun supportsContentFillMode(block: DesignBlock): Boolean

Query if the given block has a content fill mode.

  • block: the block to query.

  • Returns true if the block has a content fill mode, false otherwise.

fun getContentFillMode(block: DesignBlock): ContentFillMode

Query a block’s content fill mode.

  • block: the block to query.

  • Returns the current mode.

Full Code

Here’s the full code:

engine.block.supportsCrop(image)
engine.block.setCropScaleX(image, scaleX = 2F)
engine.block.setCropScaleY(image, scaleY = 1.5F)
engine.block.setCropScaleRatio(image, scaleRatio = 3F)
engine.block.setCropRotation(image, rotation = PI.toFloat())
engine.block.setCropTranslationX(image, translationX = -1F)
engine.block.setCropTranslationY(image, translationY = 1F)
engine.block.adjustCropToFillFrame(image, minScaleRatio = 1F)
engine.block.setContentFillMode(image, mode = ContentFillMode.CONTAIN)
engine.block.resetCrop(image)
engine.block.getCropScaleX(image)
engine.block.getCropScaleY(image)
engine.block.flipCropHorizontal(image)
engine.block.flipCropVertical(image)
engine.block.getCropScaleRatio(image)
engine.block.getCropRotation(image)
engine.block.getCropTranslationX(image)
engine.block.getCropTranslationY(image)
engine.block.supportsContentFillMode(image)
engine.block.getContentFillMode(image)