Container
File: Rhapsodist/Core/Widgets/Container.js · Namespace: Container.
Overview
Container lays out a panel’s existing visible children without hand-placing x/y coordinates. It’s a generic, framework-level primitive. MixerPanel is built on it.
Only children that are currently visible and whose parentComponent is the target panel are considered, so hiding a child and re-running the layout reflows around it.
Usage
// Lay out three existing knobs evenly across a row, vertically centred
const pnlChannelStrip = Container.createRow("pnlChannelStrip", [10, 10, 10, 10], -1, { fill: false, alignment: "middle" });
Options
create() copies every key in options onto the panel’s data object without reading any of them back. createStack()/createRow()/createGrid() each read specific keys from their own options argument:
| Option | Description | Default |
|---|---|---|
fill | createStack()/createRow(). Shares the available height/width equally across children instead of using a fixed or evenly-spread spacing. | false |
justification | createStack(). Cross-axis alignment: "left", "right", or "stretch". | Centred |
alignment | createRow(). Cross-axis alignment: "top", "bottom", or "stretch". | "middle" |
fillX / fillY | createGrid(). Fill behaviour along each axis, same meaning as fill above. | false |
layout | createGrid(). Optional per-item array of {colSpan, rowSpan, justification, alignment} specs, for irregular grids. | — |
Public API
| Function | Description | Returns |
|---|---|---|
create(id: string, options: JSON) | Fetches or creates the panel and copies options onto panel.data. The base entry point the other three build on. | ScriptObject |
createStack(id: string, padding: Array, spacing: number, options: JSON) | Lays children out vertically. padding is [top, right, bottom, left]. options.fill shares height equally; otherwise use a fixed spacing or spacing: -1 to spread children evenly. options.justification ("left"/"right"/"stretch", default centred) sets the cross-axis. | ScriptObject |
createRow(id: string, padding: Array, spacing: number, options: JSON) | Same as createStack but horizontal, with options.alignment ("top"/"bottom"/"stretch", default "middle") for the cross-axis. | ScriptObject |
createGrid(id: string, padding: Array, spacing: Array, columns: number, options: JSON) | Arranges children into a columns-wide grid. spacing is [spacingX, spacingY]. options.fillX/fillY control fill behaviour, and an optional per-item options.layout array ({colSpan, rowSpan, justification, alignment}) allows irregular grids. | ScriptObject |