Define the look and behavior of the navigational tree layout in your user interface to build an intuitive application that meets your business needs.
- In the navigation pane of Dev Studio, click Records.
- Expand the User Interface category, and then click Section.
- In the section list, select the section that contains the target layout.
- In the Navigational tree header, click the View properties icon.
- In the Layout properties window, click the Presentation tab.
- In the Style list, define how the layout arranges its
Tip: You can see the available styles and their previews in the skin rule. For more information, see Component style formats.
- In the Container format list, define the look of the
layout.For more information, see Styling a layout.
- In the Width of content list, define whether the width
of the layout columns is set as a percentage or in pixels:
- To set minimum column widths that expand if the content exceeds the minimum width, select Pixels (fit content).
- To set specific column widths, select Pixels (fixed).
- To set column widths as fractions of the total width of the layout area, specified in pixels, select Fill (100%).
Note: In each case, you can adjust each column width directly in the column properties:
- For Pixels (fit content) and Fill (100%), the Width field represents the minimum column width.
- For Pixels (fixed), the Width field represents the width of that particular column.
- Optional: To specify a fixed height for the layout, select Fixed (pixel) size grid, and then provide the height in pixels.
- In the Expand/collapse icon field, specify which icon you want to use to represent the hierarchy by clicking the Show image viewer icon, and then selecting an image.
- In the Show +/- icon list, define the visibility of the
expand icon.For more information, see Defining conditions in the condition builder.
- Optional: To define additional layout behavior, select the check boxes that represent specific personalization settings.
- Click Submit.
- On the section form, click Save.