Responsiveness

Built-in responsive components

Each component delivered with App Builder is responsive in itself. This means it can automatically adapt to the size of your screen. This is the default responsive behavior. However, as each component can have its own responsive behavior, it is recommended to test and evaluate the result.

If you want an alternative to the default responsive behavior, then you must change the boundaries and component settings, where you can manipulate the visibility, style, size, or other settings of each component. Thus enabling you to change the look and feel of your app without creating different versions.

Slider

You can use the slider on the canvas to simulate different screen sizes. Select (+) to create a boundary at the current location, or select (…) to create standard boundaries for different devices.

Boundaries

Boundaries control the responsive behavior that you create. You can create a boundary by selecting (+) on the slider, or by double-clicking the ruler.

If you have one or more boundaries in your app, then you can set the component settings to to apply to a subset of your boundaries. For example, hiding an image if the screen size is too small.

The more boundaries you add, the more complicated it becomes for you to control all the associated settings. This does not, however, affect the performance of the app.