# Organize controls with a Folder Section

> Arrange controls as navigable folder pages within one area of a position, with generated or custom navigation.

Use a Folder Section to arrange related controls as navigable pages within one area of a position. This works well when the same surface area must hold several recognizable groups, such as lighting, displays, and audio controls for a room. Before you begin, create a position and open its editor . Add the controls only to a position that is safe to edit and operate. Create a Folder Section Select the canvas cells that should contain the section. Right-click the selection, then choose Create... → Folder Section . Select the new Folder Section and open the Navigation tab in the inspector. In the Pages list, double-click Folder 1 , Folder 2 , and Folder 3 in turn to rename them for the groups people need to find. For the room example, use Lighting , Displays , and Audio . Select Apply to save the section. A new Folder Section has a Main page and three folders. During operation, the Main page presents the folder controls. Opening a folder shows the controls assigned to that page and a return control. Add controls to each folder Select Lighting in the Pages list. Add the controls for that group to the section. Repeat for Displays and Audio . Select Apply . Selecting a page in the editor displays its contents without changing the live position. The section's label bar on the canvas shows the path to the page you're viewing, such as Main › Lighting . Add and arrange folders Select Add Folder to create another folder. The selected page becomes its parent; when no child folder is selected, the new folder is added under Main . Drag folders in the Pages list to reorder them or place one inside another. You can also change each folder control's label, color, icon, and style in the list. Nested folders can keep a large set of controls organized, but every level adds another navigation step. Tip Keep the generated Return Button visible unless custom navigation provides an equally clear route back. Position the navigation controls Use the Folder Section's navigation settings to fit the generated controls around the content: Folders/Shift Buttons shows or hides the folder controls and sets where they appear. Return Button shows or hides the control that returns from the current folder and sets its position. Scroll makes controls beyond the visible area reachable. When scrolling is on, Scrollbar controls where its indicator appears. Select Apply after changing the layout. Use custom navigation The generated folder and return controls provide the shortest setup. If the position needs navigation controls elsewhere, add a button with the Buttons internal action Set Active Page , then select the Folder Section and destination page. After the custom controls provide a clear way into and out of every folder, you can hide the generated controls under Folders/Shift Buttons or Return Button . Do not remove the only visible route back to Main . Example: turn a Folder Section into a menu With the generated controls hidden, a row or column of ordinary buttons outside the section works as a menu: each one opens its own folder, and the Folder Section becomes the area that shows the chosen group. In this example, three menu buttons next to the room's Folder Section open Lighting , Displays , and Audio , and the button for the open folder lights up. Select the Folder Section, open the Navigation tab, and turn off Folders/Shift Buttons and Return Button . The section no longer shows folder or return controls of its own. Add a position variable to remember which folder is open: on any button's Variables tab, select + next to Position , name it menu , keep Type as String , and select Create . Create a button outside the section and set its Text to Lighting . On its Actions tab, add two actions under Press : Set Active Page , with Section set to the Folder Section and Page set to Lighting . Set Position Variable , with Variable set to menu and Value set to Lighting . On its Feedbacks tab, add the Internal Expression feedback with the expression $(position.state.menu) == 'Lighting' , and set the look you want for the active menu item. The default is a red background. Copy the button for Displays and Audio , and change the Text , the Page , the variable Value , and the name in the expression on each copy. Select Apply . Hold Shift and click a menu button on the canvas to try it: the section switches to that folder and the button lights up. The highlight follows the menu variable, not the section itself, so let only the menu buttons change the section's page. If you also want a way back to an empty Main page, add a fourth menu button for Main . Where to go next Use a Shift Section when the controls need only a primary and secondary layer. Add a Popover Section when occasional controls should open temporarily instead of replacing the section's current page. Add a Folder Section inside a Custom Router when routing controls need categories; keep those controls inside the Custom Router so they use its routing state.
