Panel Properties

Under Construction

This section is incomplete.


We're working on filling in the missing information as quickly as possible. If there's something you'd like to see here, use the "Report an Issue with this Page" link at the bottom of this page to let us know.

Flow Collapse Button

Flow Collapse buttons allow you to collapse a panel in a Layout flow. In some ways this functions a lot like a row expander, although with Panels rather then rows. This can be useful if there is a general work area in an application that can be made bigger by closing Panels placed before it in the Layout flow. As there are multiple Layout flow directions that can be defined, there are also multiple ways in which Panels can be designed to collapse. The design of the flow collapse button can be defined in this section.

Navigation Buttons

Navigation Buttons help users move between the different defined panels in a Panel Navigator. The Navigation Buttons properties allow you to determine whether a 'Next', 'Previous', and/or 'Back' button should be included in the Navigator. These properties then allow you to assign the pre-defined button in the Navigator's header or footer that should carry out the given navigation task.

Navigation Position Indicator

If you have a multiple panels inside a Panel Navigator, you can use a 'Navigation Position Indicator' as an easy way for users to see which panel they are on. By default the indicator is a series of grey dots, one dot for each panel, that shows up at the bottom of the user's screen. The currently active panel is denoted by a blue dot.

Panel Card Properties

A Panel Card can be added to component through the 'Panels' menu. Panel cards are useful for defining the different screens, or panels, that a user will see as they navigate through an application on a mobile device. If panel cards are being used inside a component, then every control in that component must be inside a specified panel card. Panel card's come with their own set of properties, listed here:

Panel Layout Properties

Panel Layouts are containers that can contain Panels, Panel Navigators, and even other Panel Layout containers. The Panel Layout Properties section allows you to define how the sub-containers inside a panel layout will act. For example, the direction that the containers will flow in, what method of animation will be used to display panels, what buttons reveal hidden panels, and more.

Panel Navigator Properties

Define the behavior and display of the Panel Navigator, including its id, type, classes, and animation behaviors.

Panel Size and Dock Options

A docked panel is a 'hidden' panel that can be revealed when a given event fires. Whether or not a panel is dockable is defined here in the 'Panel Size and Dock Options' properties section of a given Panel or Panel Navigator. The assignment of buttons to dock and or undock panels can be done in the Panel Layout using the 'Docked Panel controller buttons' property in the Panel Layout Properties section of the Properties list.

Parent Navigation Buttons

Parent Navigation buttons allow users to move between multiple panels on a mobile application.


Settings for configuring the scroll behavior for a Panel.

For guides on implementing panels in a UX component see the Panels section of the documentation.