Skip to content

Layout Primer

Layouts are ways to arrange multiple different pieces of content on the screen at the same time. Currently there are a few primitive layouts available, but there are plans to rework them to be more flexible in the future.

The layouts that are avilable today support two abstract components, “A” and “B”. These components can be any engine, including another layout. This allows for nesting layouts inside of other layouts to create more complex arrangements. Let’s look at an example:

h-split:
a:
image: placeholders/example-ad.webp
b:
generator: color-bars

This layout uses the h-split layout to arrange two components side-by-side. The “A” component is an image engine that displays an example ad, and the “B” component is a generator engine that displays color bars. The result is a screen that shows the ad on the left and the color bars on the right. As a general rule, “A” is the first or primary component, and “B” is the secondary component.