Appearance
Component reference
A component is the smallest building block of a Raylux screen — a label, a button, a tank, a container. Every component has a fixed set of properties (its static configuration, such as a min/max range or a color) and, for most, a binding: a live connection from one property to a tag, an expression, or another component's property, so the component reflects — and for writable controls, changes — a real process value. See Build the screen for how components, properties and bindings fit together while authoring a screen.
Components are grouped in the Studio palette into three categories; a fourth group below lists component types that exist in the product but are not offered directly from the palette in this version.
Components
| Component | Summary |
|---|---|
| Label | Displays static or bound text, optionally formatted. |
| Button | A clickable control that writes a value to a tag when pressed. |
| Value Display | A read-only numeric or text readout with a caption and unit. |
| Text Input | An editable text field that reads and writes a tag on commit. |
| Multistate Label | A colored chip that shows one of a fixed list of named states, selected by a numeric value. |
| Progress Bar | A horizontal bar that fills to show where a value sits between a minimum and a maximum. |
| Trend Chart | Plots one or more tags' historical values over a selectable time range. |
| Gauge | An analog radial dial showing a single process value against a fixed range. |
| Moving Analog Indicator | A linear pointer-on-a-track indicator showing a process value in context, with an optional desired-operating band, setpoint marker, and up to four alarm limits. |
| Status Indicator | A colored dot with a caption showing an ON/OFF process state. |
| Toggle | A pill-style switch that reflects and writes a two-state tag. |
| Slider | A draggable control that reads and writes a numeric setpoint within a range. |
| Alarm Table | A live table of active alarms, or a historical alarm journal. |
| Icon | A Material Symbols glyph, colored and sized by the component's style. |
| Image | Displays a project asset or same-origin image. |
| SVG Drawing | A vector drawing built from a data-described element tree, with per-element bindings. |
| Embedded View | Renders another screen inline, scaled to fit the component's box. |
| Flex Repeater | Instances another screen once per entry in a bound or authored array, laid out in a row or column. |
| Report Viewer | Renders a Nexus report inline as a PDF, with an optional run-history list. |
| Iris Summary | A short, cited, AI-labeled status summary of a tag folder, UDT instance, device, screen or alarm group, written by Iris. |
| Iris Chat | A chat box where an operator asks Iris about the running plant, in plain words, from a Spectrum screen. |
| Dropdown | Pick one value from a list and write it to the bound tag. |
| Checkbox / Radio Group | A checkbox group or a radio group, in classic, card or segmented style. |
| Numeric Stepper | Minus and plus buttons around a large readout for touch setpoints. |
| Sparkline | A tiny trend of one tag's recent history, inline beside a value or in a table cell. |
| Data Table | A table of rows from a dataset, with sort, filter and row select. |
| Multistate Button | Hand / Off / Auto and other pick-one states, with a ring while the PLC catches up. |
| Date / Time Range | Picks a start and end time for trends, reports and tables. |
| Bar Chart | Columns, horizontal bars or stacked columns for shift totals and runtimes. |
| Map | Sites, lift stations, pipelines and zones on a map, with alarm status on each marker. |
| Tree | A collapsible tree of areas, equipment or tags, with selection, search and alarm roll-up. |
| Tree Table | A hierarchy in the first column with live values or fixed fields in the other columns. |
| Video Player | Live camera video, one camera or a grid, relayed by the gateway. |
| Loop Indicator | A control loop at a glance: process value, setpoint, output, controller mode and deviation. |
| Alarm Banner | The newest unacknowledged alarm with its Acknowledge button and a "+N more" count, for the top or bottom of every screen. |
| Sequence Indicator | Where a batch or state machine is, from one integer step tag and a list of step names. |
| Tag Table | Live tag values in rows, with units and quality, and an editable setpoint where one is given. |
| Editable Grid | A grid of values the operator edits, stages and then saves as one batch, for recipes and setpoint tables. |
| Event Log | One log of what happened: operator actions, alarms and logins, switched by chips. |
| State Timeline | Equipment states over time, drawn as colored bars from tag history. |
| Schedule Editor | A weekly schedule of start and stop times for equipment, edited on screen and written to PLC tags. |
| Document Viewer | PDFs and images from the project assets, such as manuals, procedures and drawings. |
Process
| Component | Summary |
|---|---|
| Tank | A vessel-shaped analog level indicator. |
| Motor | A smart-object symbol showing a motor's Stopped / Running / Fault state. |
| Pump | A smart-object symbol showing a pump's Stopped / Running / Fault state. |
| Valve | A smart-object symbol showing a two-port valve's Closed / Open / Fault state, with optional partial-travel position. |
| Multi-Port Valve | A smart-object symbol for a 3-way or 4-way valve, showing which ports are currently connected. |
| Equipment | A smart-object symbol for process equipment — tanks, heat exchangers, fans, conveyors, line items and separators — chosen from a library by name. |
Containers
| Component | Summary |
|---|---|
| Coordinate | The free-positioning root container — children are placed by explicit X/Y coordinates. |
| Flex Row | A container that lays its children out left-to-right using CSS flexbox. |
| Flex Column | A container that lays its children out top-to-bottom using CSS flexbox. |
| Tab | A container that shows one child pane at a time, selected by a row of tab buttons. |
Not in the palette
| Component | Summary |
|---|---|
| Pipe | A two-tone process pipe drawn as a polyline, with optional animated flow. |
| P&ID Line | A simple P&ID schematic line, drawn as a polyline with optional arrowheads. |
| Mimic Pipe | A realistic pipe with flange fittings, drawn as a polyline with optional animated flow. |