The SMIL Layout is defined via a section in the head area.
The tag root-layout defines the width and height of the display area. It makes sense to use the resolution of the entire screen area for digital signage.
The root layout is defined in pixel only by default. It is not necessary to add px. like in regions
The region-tag defines properties like position, z-index, width, height and some more of an area. With this technique, you create multiple zones. Some calls them split screens, too, but this is not correct. We call this multi zone because zones can overlap each other. That is more than only a simple “split”.
regionName: An unique identification for this region. You can also use SMIL.20 ID or the correct SMIL 3.0 xml:id for that. If you specified both, regionName is used.
top: Top position of the region (px or %)
left: Left position of the region (px or %)
width: Region width (px or %)
height: Region height
backgroundColor: The background color of the region. You can use RGB values #000 or CSS names. backgroundColor property is not supported by the IAdea player.
By default, px is assumed for the top, left, width, and height properties.
Assign Content to Regions
You assign content to regions with the content attribute. In this example, we use a parallel playlist to display the content simultaneously.
Let's enhance our regions example from above with a body area