Toolbar

Toolbar

Overview

A toolbar is a user interface component that provides rapid access to frequently used actions and tools via buttons, icons, or controls. It helps users execute tasks more efficiently without having to navigate menus. The toolbar encompasses controls for zooming the canvas, undoing and redoing actions, validating flows, and managing layout—enabling effective work while remaining engaged with the canvas.

Key characteristics of a toolbar

  1. Displays action buttons or icons in a horizontal strip
  2. Groups frequently use functions in one place
  3. Enables one-click access to actions like reset, undo, zoom, fit to screen, set breakpoint, or run
  4. Improves usability and productivity

Available Toolbar Options

  1. A toolbar is provided to improve the flow's usability, and the following action items are available in the toolbar:
    1. Reset: Restores the flow or view to its default state, clearing any zoom, pan, or temporary changes.
    2. Undo/redo:
      1. Undo: Reverts the last action performed.
      2. Redo: Re-applies an action that was undone.
    3. Zoom in/zoom out, reset zoom:
      1. Zoom In: Magnifies the view for a closer look.
      2. Zoom Out: Shrinks the view to see more of the flow.
      3. Reset Zoom: Returns the zoom level to the default (usually 100%).
    4. Fit to screen: Adjusts the zoom and position so the entire flow diagram fits within the screen's visible area.
    5. Collapse all Nodes: Minimizes all expandable nodes or groups in the flow to simplify the view.
    6. Run Flow: Executes the entire flow from the start unit, following the defined sequence and conditions.
    7. Stop Flow: Immediately stops the execution of the currently running flow.
    8. Run the Next Unit: Executes only the next unit in the flow, allowing step-by-step execution for debugging.
    9. Set Breakpoint: Marks a selected unit as a breakpoint where flow execution pauses, enabling inspection of data and logic at that point.
    10. Search:  Allows users to find a specific flow unit by name.
    11. Toggel mini overview: Shows or hides a small overview map of the entire canvas, useful for navigation.
    12. Show Legends: Displays a legend on the canvas that explains the meaning of icons, colors, and visual indicators used in the flow, helping you understand flow elements and execution states quickly.


Reset

To reset the flow, click on the designated Reset button. This action will restore the flow to its default state, ensuring a clean, efficient starting point for your operations.


Undo and Redo

The undo and redo icons let you undo or redo any action in the flow while you are designing or editing. Clicking the icons will revert the last action performed and retain the previous action.

Undo

To undo the last action, click the Undo icon.

Redo

To redo the previous action, click the Redo icon.


Zoom in, Zoom out, and Reset zoom

The zoom functionality lets you zoom in and out of the flow diagram within the canvas area. Additionally, you can reset the zoom level to its default settings with a click. Clicking the icons will increase or decrease the zoom level.

Zoom In

  1. This icon lets you magnify the view for a closer look.
  2. To zoom in on the flow diagram, click the Zoom in icon.
  3. Supported zoom levels range from 25 to 1000 %.

Zoom Out

  1. This icon lets you shrink the view to see more of the flow.
  2. To zoom out on the flow diagram, click the Zoom Out icon.
  3. Supported zoom out levels range from 0 to 1000 %.

Reset Zoom

  1. This icon lets you reset the zoom to its default setting of 100%.
  2. To return to the default view from any zoom level, click the Reset Zoom icon.
  3. The default zoom is 100%.

Fit to Screen

  1. This icon lets you adjust the zoom and position so the entire flow diagram fits within the screen's visible area.
  2. Click the Fit to screen icon to fit the entire diagram into the visible area. Once the icon is clicked, all zoom level settings will be removed to fit the flow diagram onto the screen.

Collapse all Nodes

  1. This icon lets you collapse all expandable nodes (units) in the flow to simplify the view. This mostly works with the decision unit, which has a child and a sub-child (units).
  2. To collapse all nodes of the Decision unit, click on the Collapse all node icon.
  3. Please note that clicking the icon collapses all units that have any child in them. It does not collapse individual units' children.

  1. Once clicked, all the child units will be collapsed.
  2. To expand the nodes again, click on the Expand all nodes icon.

Run Flow

  1. This icon lets you execute the entire flow from the start unit, following the defined sequence and conditions.
  2. To start the flow, click on the Run Flow icon.
  1. Once the flow starts running, it will run until the set breakpoint, if any. If no breakpoint is set, the complete flow will run.
  2. If one or more breakpoints are set in the flow, the same icon allows you to execute the flow between them.
  3. For example, if three breakpoints are established and the flow is halted at the initial breakpoint, clicking on the "Run to the next breakpoint" icon will cause the flow to proceed until the second breakpoint and then stop. Clicking the icon again will advance the flow until the third breakpoint and subsequently stop. A further click will cause the flow to run until the End unit, provided another breakpoint is set. 

Stop Flow

  1. This icon lets you stop the currently running flow. By default, the icon will be disabled. It gets only when the Run Flow icon is clicked.
  2. To stop any running flow, click on the Reset/Stop Flow icon. Upon clicking the icon, the flow will be halted and will revert to its default state. 

Run the Next Unit

  1. This icon lets you execute only the next unit in the flow, facilitating step-by-step debugging. 
  2. Please be advised that this function can be utilized in conjunction with a Breakpoint. 
  3. For instance, if you wish to debug the flow starting from a particular unit, set a breakpoint on that unit so that the flow halts at that point. When the flow pauses at the breakpoint, click the 'Run the next unit' icon to proceed through the flow incrementally. Each click processes one unit. 

Set Breakpoint

  1. This icon lets you set one or more breakpoints in the flow. You can mark any unit with a breakpoint where flow execution will pause, enabling you to inspect the data and logic at that point.
  2. To add a breakpoint, click on the Set Breakpoint icon.

  1. After clicking the icon, in the top right corner, the units will start displaying the placeholder. 
  2. Select the placeholder to add the breakpoints.
  1. After selecting the placeholder, a breakpoint icon appears on the unit, and the unit is also highlighted, as shown in the screenshot.
  2. You can add one or more breakpoints by selecting the placeholder of the desired units. 
  1. Once you have assigned all the breakpoints to the required units, click on the Stop Breakpoint icon.
  2. After clicking the icon, the placeholder gets removed, and the units with breakpoints get highlighted in the flow.

Search

  1. The search function enables users to locate any specific unit by its name or description. 
  2. Enter the unit's name or description into the designated search field. 
  3. As you type, results are displayed instantly, with the matching unit highlighted, as illustrated in the accompanying screenshot. In the event of multiple results, use the navigation icon next to the search field to browse them. 

Toggle Mini Overview

  1. This icon lets you display or hide a compact overview map of the entire workspace, enhancing navigation. 
  2. To access the miniature overview, click on the Toggle mini overview icon. 
  3. Click the icon once more to hide the miniature overview.

Show Legends

  1. Displays a legend on the canvas that explains the meanings of icons, colors, and visual indicators used in the flow, helping you quickly understand flow elements and execution states.
  2. Click on the Show Legends icon to open the legends details.


    • Related Articles

    • Output Panel

      Output Panel Overview sdas Output Section The Output section provides details about the message's output. The section header displays the section name and an icon to toggle between code view and tree view. To display the inbound message, the section ...

    • Canvas Area

      Overview The Canvas Area is the main working space in the Flow Designer/Editor where you visually design, build, and manage automation flows. It acts as a visual editor that allows you to create the logical sequence of a flow by placing and ...

    • Familiarize With Input-Processing-Output Panel

      Overview Every unit in the flow diagram works on the basic fundamental concept called the IPO module (Input → Processing → Output). Receives Input: Data or signals from a user, another system, or a device. Processes Data: Applies logic, calculations, ...

    • Edit Start Unit

      Overview The Start Unit is the entry point of a flow in the Automation Flow Designer/Editor. It defines when and how an automation flow is initiated and marks the start of execution. The start unit is mandatory for the flow, where you need to define ...

    • Edit Input-Processing-Output Details

      Overview Every unit in the flow diagram works on the basic fundamental concept called the IPO module (Input → Processing → Output). Receives Input: Data or signals from a user, another system, or a device. Processes Data: Applies logic, calculations, ...