Skip to main content

Layout container components

Layout containers group widgets inside wm-page-content (and inside other containers). They control alignment, spacing, and how content flows on phone and tablet screens.

WaveMaker mobile apps ship these layout widgets in the component panel. Each maps to a WML tag and renders as native views in the generated Expo app.

Container widgets

WidgetWML tagUse when
Containerwm-containerGeneral grouping, rows and columns, Auto Layout (direction, fill, hug, gap)
Accordionwm-accordion / wm-accordionpaneStacked sections with one pane expanded at a time
Panelwm-panelTitled block with optional footer actions
Tabswm-tabs / wm-tabpaneRelated content in tabs on the same page
Tilewm-tileCompact dashboard-style metric or summary blocks
Wizardwm-wizard / wm-wizardstepMulti-step flows with Next, Previous, and Done

Place containers on a page markup, then drop inputs, lists, charts, and other widgets inside them. Partials can sit inside accordion panes, tab panes, and similar regions when you need reusable sections.

  • Auto Layout: configure wm-container layout properties in Studio without hand-writing styles for every child.
  • Container types: markup patterns and Storybook links for accordion, tabs, wizard, panel, and tile.
  • Responsive design with layouts: device visibility and layout behavior across screen sizes.