Skip to main content
Platform
Language

Fills

In this example, we will show you how to use the CreativeEditor SDK's CreativeEngine to modify a block's fill through the block API. The fill defines the visual contents within a block's shape.

Setup#

This example uses the headless CreativeEngine. See the Setup article for a detailed guide. To get started right away, you can also access the block API within a running CE.SDK instance via cesdk.engine.block. Check out the APIs Overview to see that illustrated in more detail.

Creating a Fill#

To create a fill simply use createFill(type: string): number.

createFill(type: FillType): DesignBlockId

Create a new fill, fails if type is unknown.

  • type: The type of the fill object that shall be created.
  • Returns The created fill's handle.

We currently support the following fill types:

  • '//ly.img.ubq/fill/color'
  • '//ly.img.ubq/fill/gradient/linear'
  • '//ly.img.ubq/fill/gradient/radial'
  • '//ly.img.ubq/fill/gradient/conical'
  • '//ly.img.ubq/fill/image'
  • '//ly.img.ubq/fill/video'
  • '//ly.img.ubq/fill/pixelStream'

Note: short types are also accepted, e.g. 'color' instead of '//ly.img.ubq/fill/color'.

Functions#

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

getFill(id: DesignBlockId): DesignBlockId

Returns the block containing the fill properties of the given block.

  • id: The block whose fill block should be returned.
  • Returns The block that currently defines the given block's fill.

Remember to first destroy the previous fill if you don't need it any more. A single fill can also be connected to multiple design blocks. This way, modifying the properties of the fill will apply the changes to all connected design blocks at once.

setFill(id: DesignBlockId, fill: DesignBlockId): void

Sets the block containing the fill properties of the given block. Note that the previous fill block is not destroyed automatically. Required scopes: 'fill/change', 'fill/changeType'

  • id: The block whose fill should be changed.
  • fill: The new fill.
supportsFill(id: DesignBlockId): boolean

Query if the given block has fill color properties.

  • id: The block to query.
  • Returns true, if the block has fill color properties, an error otherwise.
setFillEnabled(id: DesignBlockId, enabled: boolean): void

Enable or disable the fill of the given design block. Required scope: 'fill/change'

  • id: The block whose fill should be enabled or disabled.
  • enabled: If true, the fill will be enabled.
  • Returns An empty result on success, an error otherwise.
isFillEnabled(id: DesignBlockId): boolean

Query if the fill of the given design block is enabled.

  • id: The block whose fill state should be queried.
  • Returns A result holding the fill state or an error.