Skip to main content
Platform
Language

Hierarchies

In this example, we will show you how to use the CreativeEditor SDK's CreativeEngine to modify the hierarchy of blocks through the block API.

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.

Manipulate the hierarchy of blocks#

Only blocks that are direct or indirect children of a page block are rendered. Scenes without any page child may not be properly displayed by the CE.SDK editor.

getParent(id: DesignBlockId): DesignBlockId | null

Query a block's parent.

  • id: The block to query.
  • Returns The parent's handle or null if the block has no parent.
getChildren(id: DesignBlockId): DesignBlockId[]

Get all children of the given block. Children are sorted in their rendering order: Last child is rendered in front of other children.

  • id: The block to query.
  • Returns A list of block ids.
insertChild(parent: DesignBlockId, child: DesignBlockId, index: number): void

Insert a new or existing child at a certain position in the parent's children. Required scope: 'editor/add'

  • parent: The block whose children should be updated.
  • child: The child to insert. Can be an existing child of parent.
  • index: The index to insert or move to.
appendChild(parent: DesignBlockId, child: DesignBlockId): void

Appends a new or existing child to a block's children. Required scope: 'editor/add'

  • parent: The block whose children should be updated.
  • child: The child to insert. Can be an existing child of parent.

When adding a block to a new parent, it is automatically removed from its previous parent.