Skip to content

Start With Blank Canvas

In this example, we will show you how to initialize the CreativeEditor SDK from scratch and add a star shape.

We create an empty scene via engine.scene.create() which sets up the default scene block with a camera attached. Afterwards, the scene can be populated by creating additional blocks and appending them to the scene. See Modifying Scenes for more details.

val scene = engine.scene.create()

We first add a page with fun create(blockType: DesignBlockType): DesignBlock specifying a DesignBlockType.Page and set a parent-child relationship between the scene and this page.

val page = engine.block.create(DesignBlockType.Page)
engine.block.appendChild(parent = scene, child = page)

To this page, we add a graphic design block, again with fun create(blockType: DesignBlockType): DesignBlock. To make it more interesting, we set a star shape and a color fill to this block to give it a visual representation. Like for the page, we set the parent-child relationship between the page and the newly added block. From then on, modifications to this block are relative to the page.

val block = engine.block.create(DesignBlockType.Graphic)
engine.block.setShape(block = block, shape = engine.block.createShape(ShapeType.Star))
engine.block.setFill(block = block, fill = engine.block.createFill(FillType.Color))
engine.block.appendChild(parent = page, child = block)

This example first appends a page child to the scene as would typically be done but it is not strictly necessary and any child block can be appended directly to a scene.

To later save your scene, see Saving Scenes.

Full Code

Here’s the full code:

import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.launch
import ly.img.engine.DesignBlockType
import ly.img.engine.Engine
import ly.img.engine.FillType
import ly.img.engine.ShapeType


fun createSceneFromScratch(
    license: String,
    userId: String,
) = CoroutineScope(
    Dispatchers.Main,
).launch {
    val engine = Engine.getInstance(id = "ly.img.engine.example")
    engine.start(license = license, userId = userId)
    engine.bindOffscreen(width = 100, height = 100)


    val scene = engine.scene.create()


    val page = engine.block.create(DesignBlockType.Page)
    engine.block.appendChild(parent = scene, child = page)


    val block = engine.block.create(DesignBlockType.Graphic)
    engine.block.setShape(block = block, shape = engine.block.createShape(ShapeType.Star))
    engine.block.setFill(block = block, fill = engine.block.createFill(FillType.Color))
    engine.block.appendChild(parent = page, child = block)


    engine.stop()
}