Children

Objects can have children, that are specified in the children: property of an object.

Using child objects makes it easy to align, position, and disable a group of objects.

• Child objects get disabled if the parent object is disabled. Enabled

• The origin position (0, 0) of child objects is the top left corner of the parent object. Position

• Child objects are aligned to the area of the parent object. Centered child object

• Percentage based size properties use the dimensions of the parent object to determine the size of child objects. Size

Centered child image

## background1 is the parent object
background1:
  type: background
  size: 512 512
  color: red
  children:
    ## child_image1 is the child object
    ## it will be centered inside of the background object
    ## the size of the image will be half the size of the background object
    child_image1:
      type: image
      ## width and height will be 50% of the parent, in this case
      ## the image size will be (512 * 0.5, 512 * 0.5) = (256, 256)
      size: '50% 50%'
      position: 0 0
      
      ## horizontal alignment of the image (left, center, right)
      alignment: center
      ## vertical alignment of the image (top, center, bottom)
      vertical-alignment: center
      
      image:
        name: 'image.png'