Layout

A layout defines how to place content on a layout container. The content can include a widget, section, or screen group, the layout container can be a page, view, or dialog, etc. ArcGIS Experience Builder has some layout rules. For instance, when creating a new page, you can select a Fixed layout or Flow layout, or you can use Layout widgets to create different layouts.

In the app config, the layouts are defined by the layouts property and the layout container refers to the layout by the layout id. A layout container has a layout object property, which defines the layouts on different size modes. Experience Builder supports Large, Medium, and Small size modes. For size modes that do not have a layout defined, the mainSizeMode layout defined in the app config will be used.

Besides the framework layout containers, a widget can be a layout container as well. When a widget is a layout container, the user can drag and drop other widgets into it. For example, the Map and the Card widgets are layout container widgets. A layout container widget must declare the layouts property in its manifest.json and use the LayoutEntry component. For performance reasons, you should use the following logic:

1
2
3
4
5
6
7
8
  import {LayoutEntry} from 'jimu-layouts/layout-runtime'

  let LayoutEntryComponent
  if (window.jimuConfig.isInBuilder) {
    LayoutEntryComponent = this.props.builderSupportModules.LayoutEntry
  } else {
    LayoutEntryComponent = LayoutEntry
  }