Difference between revisions of "Tools and Views"

From Flowcode Help
Jump to navigationJump to search
Line 3: Line 3:
 
__NOTOC__
 
__NOTOC__
  
====1) Icons Toolbar====
+
===1) Icons Toolbar===
 
Drag and drop icons from this toolbar onto the main flowchart window to create your flowchart application.
 
Drag and drop icons from this toolbar onto the main flowchart window to create your flowchart application.
  
Line 9: Line 9:
  
  
====2) Components Toolbar====
+
 
 +
===2) Components Toolbar===
 
This toolbar displays the external components that can be connected to a microcontroller. Click on a component and it will be added to the microcontroller in the Microcontroller view. The pin connections and properties of the component can then be edited.
 
This toolbar displays the external components that can be connected to a microcontroller. Click on a component and it will be added to the microcontroller in the Microcontroller view. The pin connections and properties of the component can then be edited.
  
Line 15: Line 16:
  
  
====Docking and Undocking the Toolbars====
+
 
 +
===Docking and Undocking the Toolbars===
  
 
The toolbars can be undocked from the default position and either left free floating, or can be docked to the menu bar, the sides or the bottom of the Flowcode window.  
 
The toolbars can be undocked from the default position and either left free floating, or can be docked to the menu bar, the sides or the bottom of the Flowcode window.  
Line 26: Line 28:
  
  
====3) Chip View====
+
 
 +
===3) Chip View===
  
 
The current microcontroller is displayed in this window. When the flowchart is being simulated, the state of the microcontroller I/O ports are shown on the microcontroller as red and blue for high and low outputs respectively.
 
The current microcontroller is displayed in this window. When the flowchart is being simulated, the state of the microcontroller I/O ports are shown on the microcontroller as red and blue for high and low outputs respectively.
  
  
====4) Flowchart Window====
+
 
 +
===4) Flowchart Window===
 
The icons that make up the flowchart are displayed in this window. In addition, the icons that make up a macro are shown in their own separate window. The Main flowchart window is always visible and the macro windows can be shown and hidden as needed.
 
The icons that make up the flowchart are displayed in this window. In addition, the icons that make up a macro are shown in their own separate window. The Main flowchart window is always visible and the macro windows can be shown and hidden as needed.
 
[[File:Gen_System_Panel.png|thumb|right|System Panel]]
 
[[File:Gen_System_Panel.png|thumb|right|System Panel]]
  
  
====5) [[System Panel]]====
+
 
 +
===5) [[System Panel]]===
 
The [[System Panel]] provides a real-world framework on which to load Flowcode components. It then shows how these components perform during simulation of the current program. It can be customised by adding different background layouts, grids, images etc.
 
The [[System Panel]] provides a real-world framework on which to load Flowcode components. It then shows how these components perform during simulation of the current program. It can be customised by adding different background layouts, grids, images etc.
 
[[File:Gen_Dashboard_Panel.png|thumb|right|System Panel]]
 
[[File:Gen_Dashboard_Panel.png|thumb|right|System Panel]]
  
  
====6) [[Dashboard Panel]]====
+
 
 +
===6) [[Dashboard Panel]]===
 
The Dashboard Panel provides another framework on which to load Flowcode components. It is usually used for buttons to control components on the [[System Panel]]. It can also be customised by adding different background layouts, grids, images etc.
 
The Dashboard Panel provides another framework on which to load Flowcode components. It is usually used for buttons to control components on the [[System Panel]]. It can also be customised by adding different background layouts, grids, images etc.
 
[[File:Project_Explorer_Docked.png|thumb|right|Project Explorer]]
 
[[File:Project_Explorer_Docked.png|thumb|right|Project Explorer]]
  
  
====7) [[Using the Project Explorer|Project Explorer]]====
+
 
 +
===7) [[Using the Project Explorer|Project Explorer]]===
 
The project explorer allows you to easily manipulate the key constituents of your project. Left clicking on the arrow or right clicking on the various objects in the explorer will bring up a menu relevant to that object. The 'Macro' and 'Components' icons can be dragged into the main window to be placed as icons.
 
The project explorer allows you to easily manipulate the key constituents of your project. Left clicking on the arrow or right clicking on the various objects in the explorer will bring up a menu relevant to that object. The 'Macro' and 'Components' icons can be dragged into the main window to be placed as icons.
 
[[File:Icons_Lists_Undocked.png|thumb|right|Icon Lists Pane]]
 
[[File:Icons_Lists_Undocked.png|thumb|right|Icon Lists Pane]]
  
  
====8) [[Using the Icon Lists Pane|Icon Lists]]====
+
 
 +
===8) [[Using the Icon Lists Pane|Icon Lists]]===
 
This window shows a list of the icons that: have been bookmarked; are set as breakpoints; are search results or have shown to cause an error after compilation. Left clicking on the arrow or right clicking on the various objects in the icon list will bring up a menu relevant to that object.
 
This window shows a list of the icons that: have been bookmarked; are set as breakpoints; are search results or have shown to cause an error after compilation. Left clicking on the arrow or right clicking on the various objects in the icon list will bring up a menu relevant to that object.
 
[[File:Gen_Simulation_Debugger.png|thumb|right|Simulation Debugger]]
 
[[File:Gen_Simulation_Debugger.png|thumb|right|Simulation Debugger]]
  
  
====9) [[Simulation Debugger]]====
+
 
 +
===9) [[Simulation Debugger]]===
  
 
This window appears when simulating a flowchart, it shows the current macro being simulated as well as the values of any variables selected, the values of the variables are updated for every command simulated but does not update when running the simulation 'As fast as possible'.
 
This window appears when simulating a flowchart, it shows the current macro being simulated as well as the values of any variables selected, the values of the variables are updated for every command simulated but does not update when running the simulation 'As fast as possible'.
Line 63: Line 72:
  
  
====10) Main Toolbar====
+
===10) Main Toolbar===
  
 
Use this command to display and hide the Toolbar, which includes buttons for some of the most common commands in Flowcode, such as File Open.  There are also buttons for starting, stopping and pausing the simulation on the toolbar.  
 
Use this command to display and hide the Toolbar, which includes buttons for some of the most common commands in Flowcode, such as File Open.  There are also buttons for starting, stopping and pausing the simulation on the toolbar.  
Line 70: Line 79:
 
[[File:Gen_Main_Toolbar_Labelled.png]]
 
[[File:Gen_Main_Toolbar_Labelled.png]]
  
====11) Status Bar====
+
 
 +
===11) Status Bar===
  
 
Use this command to display and hide the Status Bar displayed at the bottom of the Flowcode window, which describes the action to be executed by the selected menu item or depressed toolbar button, and keyboard latch state. A check mark appears next to the menu item when the Status Bar is displayed.
 
Use this command to display and hide the Status Bar displayed at the bottom of the Flowcode window, which describes the action to be executed by the selected menu item or depressed toolbar button, and keyboard latch state. A check mark appears next to the menu item when the Status Bar is displayed.
  
  
====12) [[Zooming the View|Current Zoom Level]]====
+
 
 +
===12) [[Zooming the View|Current Zoom Level]]===
  
 
The currently selected Zoom level is displayed on the right side of the Status Bar.
 
The currently selected Zoom level is displayed on the right side of the Status Bar.

Revision as of 08:15, 11 June 2013

<sidebar>Sidebar: Getting Started</sidebar> The Flowcode environment consists of a main work area in which the flowchart windows are displayed, several toolbars that allow icon and components to be added to the flowchart application, windows that allow the status of the microcontroller and attached components to be viewed and windows that display variables and macro calls when the flow chart is being simulated.


1) Icons Toolbar

Drag and drop icons from this toolbar onto the main flowchart window to create your flowchart application.

File:Icons Toolbar Undocked.png


2) Components Toolbar

This toolbar displays the external components that can be connected to a microcontroller. Click on a component and it will be added to the microcontroller in the Microcontroller view. The pin connections and properties of the component can then be edited.

File:Components Toolbar Undocked.png


Docking and Undocking the Toolbars

The toolbars can be undocked from the default position and either left free floating, or can be docked to the menu bar, the sides or the bottom of the Flowcode window.

File:Icons Toolbar Undocked.png

File:Chip View.png
Chip / Microcontroller View

To undock a toolbar simply click and hold on the toolbar grab bars if docked, or the caption bar if undocked and drag the toolbar to its new position.

File:Eg Tools and views Grab Bar Area.png


3) Chip View

The current microcontroller is displayed in this window. When the flowchart is being simulated, the state of the microcontroller I/O ports are shown on the microcontroller as red and blue for high and low outputs respectively.


4) Flowchart Window

The icons that make up the flowchart are displayed in this window. In addition, the icons that make up a macro are shown in their own separate window. The Main flowchart window is always visible and the macro windows can be shown and hidden as needed.

Error creating thumbnail: sh: /usr/bin/convert: No such file or directory Error code: 127
System Panel


5) System Panel

The System Panel provides a real-world framework on which to load Flowcode components. It then shows how these components perform during simulation of the current program. It can be customised by adding different background layouts, grids, images etc.


6) Dashboard Panel

The Dashboard Panel provides another framework on which to load Flowcode components. It is usually used for buttons to control components on the System Panel. It can also be customised by adding different background layouts, grids, images etc.


7) Project Explorer

The project explorer allows you to easily manipulate the key constituents of your project. Left clicking on the arrow or right clicking on the various objects in the explorer will bring up a menu relevant to that object. The 'Macro' and 'Components' icons can be dragged into the main window to be placed as icons.


8) Icon Lists

This window shows a list of the icons that: have been bookmarked; are set as breakpoints; are search results or have shown to cause an error after compilation. Left clicking on the arrow or right clicking on the various objects in the icon list will bring up a menu relevant to that object.

Error creating thumbnail: sh: /usr/bin/convert: No such file or directory Error code: 127
Simulation Debugger


9) Simulation Debugger

This window appears when simulating a flowchart, it shows the current macro being simulated as well as the values of any variables selected, the values of the variables are updated for every command simulated but does not update when running the simulation 'As fast as possible'.

When simulating a flowchart, the values of any variables used can be seen in this view. The values of the variables are updated for every command simulated but the view is not updated when the simulation is running at full speed.


10) Main Toolbar

Use this command to display and hide the Toolbar, which includes buttons for some of the most common commands in Flowcode, such as File Open. There are also buttons for starting, stopping and pausing the simulation on the toolbar.


Gen Main Toolbar Labelled.png


11) Status Bar

Use this command to display and hide the Status Bar displayed at the bottom of the Flowcode window, which describes the action to be executed by the selected menu item or depressed toolbar button, and keyboard latch state. A check mark appears next to the menu item when the Status Bar is displayed.


12) Current Zoom Level

The currently selected Zoom level is displayed on the right side of the Status Bar.