AX1456

Panel component for Axiom forms

Using the Panel component, you can group multiple components within a single container. This is a design element that can be used to:

  • Move and position components as a group within the Form Designer
  • Display components within the panel area when the file is rendered as a form

Once you have placed a Panel component on the canvas, you must assign one or more "child" components to that panel. For more information about working with panels, see Using panels to group and position components.

Component properties

You can define the following properties for a Panel component.

(missing or bad snippet)(missing or bad snippet)
ItemDescription

Title Text

The title text for the component. This text displays in the header bar for the component within the Axiom form, if the title bar is enabled. If the title bar is disabled, then this text does not display at all in the form.

Show Title Bar

(missing or bad snippet)

Child Layout

Specifies the layout behavior for child components within the panel:

  • Positioned (default): Child components have defined positions in the same way as regular components, except that child component positions are relative to the panel instead of the overall page. For more information, see Using panels to group and position components.

  • Flow: Child components will automatically flow within the panel from left to right (then down as needed), based on a defined flow order. This behavior is intended for forms such as home pages or dashboards, where the specific position of individual controls or charts may not matter, you just want them to fit on the page in a specified order. For more information, see Auto-flow components in a panel.

Flow Layout Direction

Specifies the direction of the flow layout. Only applies when Child Layout is set to Flow.

  • Left to right (default): Child components start in the top left corner of the panel and flow right.
  • Right to left: Child components start in the top right corner of the panel and flow left.

Child Padding X

Child Padding Y

Defines the x-padding and y-padding between child components when using flow layout behavior. These settings only apply when Child Layout is set to Flow.

  • Child Padding X defines the horizontal padding between components. It is applied to the right side of each component.
  • Child Padding Y defines the vertical padding between components. It is applied to the bottom of each component.

The padding can be set in pixels (default) or in percentages. For more information, see Setting the padding between child components.

Overflow

Specifies the behavior if child components extend beyond the panel boundaries. Select one of the following:

  • Visible (default): Child components are visible beyond the panel boundaries. This may cause child components to interfere with the expected display of other components that are not part of the panel (for example, to overlap another component).

  • Hidden: Any part of a child component that extends beyond the panel boundaries will be hidden. This may cause child components to appear "cut off."

  • Scroll: Scroll bars are always present on the panel, regardless of whether they are needed. If child components extend beyond the panel boundaries, the scroll bars are active.

  • Auto: Scroll bars are added to the panel only if child components extend beyond the panel boundaries.
(missing or bad snippet)(missing or bad snippet)

Panel components have access to several useful styles to control the size and position of the panel, as well as properties such as background color.

(missing or bad snippet)(missing or bad snippet)