The Edit and Show view patterns use a drag-and-drop Builder to configure their views. You can create flexible layouts for Forms or Show rows in the database.
There are four key areas in the builder:
The main canvas is the middle area, surrounded by a stitched border. This shows the elements in your current view. Click on elements to select them. The outline of the selected element is blue.
The toolbar panel on the left holds the elements that you can drag into the main canvas.
The layers panel is at the top right. Because some elements can contain other elements, the elements in the view will be arranged hierarchically in layers.
Use the small arrow to the right of the element to expand or collapse the elements inside that element.
Use the layers area to select items that are difficult to select by clicking in the main canvas.
Below the layers is the settings panel for the currently selected element. The settings depend on the element itself.
Add an element
Select the element from the toolbar and drag it into the main canvas. A green line, vertical or horizontal, will appear where the element will be dropped. You can place some elements
next to each other (inline display)
above or below other elements (block display)
Move or Place elements
There are 4 ways to move or place elements.
Drag and drop
Drag and drop
You can move the element in the canvas by selecting and dragging to a new location.
If you want an element to be on a line by itself, select Block display from the Settings panel. This moves an element to be on a separate line inside its current container. In block display, nothing can be next to the element.
Drag and drop the break element from the Elements panel into the canvas. This creates a line break between elements.
Drag and drop elements within the Layers panel. This is useful when you are building Cards or moving elements between columns or tabs. If elements are nested (one inside the other) you can open and close the top level elements using the arrow.