Skip to content

Blur

In this example, we will show you how to use the CreativeEditor SDK’s CreativeEngine to modify a block’s blur through the block API. Blurs can be added to any shape or page. You can create and configure individual blurs and apply them to blocks. Blocks support at most one blur at a time. The same blur may be used for different blocks at the same time.

Creating a Blur

To create a blur, simply use createBlur.

public func createBlur(_ type: BlurType) throws -> DesignBlockID

Create a new blur.

  • type:: The type of the blur object that shall be created.
  • Returns: The created blur’s handle.

We currently support the following blur types:

  • BlurType.uniform
  • BlurType.linear
  • BlurType.mirrored
  • BlurType.radial
let radialBlur = try engine.block.createBlur(.radial)

Configuring a Blur

You can configure blurs just like you configure design blocks. See Modify Properties for more detail.

try engine.block.setFloat(radialBlur, property: "radial/radius", value: 100)

Functions

public func setBlur(_ id: DesignBlockID, blurID: DesignBlockID) throws

Connects block’s blur to the given blur block. Required scope: “appearance/blur”

  • id: The block to update.
  • blurID: A ‘blur’ block.
public func setBlurEnabled(_ id: DesignBlockID, enabled: Bool) throws

Enable or disable the blur of the given design block.

  • id: The block to update.
  • enabled: The new enabled value.
public func isBlurEnabled(_ id: DesignBlockID) throws -> Bool

Query if blur is enabled for the given block.

  • id:: The block to query.
  • Returns: true, if the blur is enabled. false otherwise.
public func supportsBlur(_ id: DesignBlockID) throws -> Bool

Checks whether the block supports blur.

  • id:: The block to query.
  • Returns: true, if the block supports blur.
public func getBlur(_ id: DesignBlockID) throws -> DesignBlockID

Get the ‘blur’ block of the given design block.

  • id:: The block to query.
  • Returns: The ‘blur’ block.

Full Code

Here’s the full code:

// Create and configure a radial blur
let radialBlur = try engine.block.createBlur(.radial)
try engine.block.setFloat(radialBlur, property: "radial/radius", value: 100)
try engine.block.setBlur(block, blurID: radialBlur)
try engine.block.setBlurEnabled(block, enabled: true)
let isBlurEnabled = try engine.block.isBlurEnabled(block)


// Access an existing blur
if try engine.block.supportsBlur(block) {
  let existingBlur = try engine.block.getBlur(block)
}