https://www.flowcode.co.uk/wiki/api.php?action=feedcontributions&feedformat=atom&user=JonnyW 2026-05-13T02:26:30Z User contributions MediaWiki 1.34.1 https://www.flowcode.co.uk/wiki/index.php?title=Event_Components.Property&diff=14483 2014-01-31T08:35:17Z

<p>JonnyW: </p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Sent when a property has been changed by the User<br /> <br /> This event is part of the [[Event class Components|Components]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> ''This event has no parameters''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> This event is called whenever a property owned by your component changes.<br /> <br /> This event simply notifies ''something'' has changed. This means changes will be accumulated, so changing three properties in quick succession will only result in a single event being sent. Because of this, it is the components responsibility to remember previous property states to establish what has changed.<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=API_Component.Property.SetListItem&diff=14430 2014-01-28T23:43:31Z

<p>JonnyW: /* Detailed description */</p> <hr /> <div>&lt;sidebar&gt;API Contents&lt;/sidebar&gt;<br /> Sets an existing list entries text for the property by named index<br /> <br /> &lt;div style=&quot;width:25%; float:right&quot; class=&quot;toc&quot;&gt;<br /> ====Class hierarchy====<br /> [[API Component|Component]]<br /> :[[API Component.Property|Property]]<br /> ::[[API Component.Property|SetListItem]]<br /> &lt;/div&gt;<br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Handle''<br /> :The component handle to alter the property of<br /> <br /> [[Variable Types|STRING]] ''Property''<br /> :The textual name of the property<br /> <br /> [[Variable Types|STRING]] ''Index''<br /> :The text or integer entry of the property<br /> <br /> [[Variable Types|STRING]] ''Value''<br /> :The value to update the entry with<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|BOOL]]<br /> <br /> Returns true if the operation is a success, else false<br /> <br /> <br /> ==Detailed description==<br /> Sets the text part of a list property identified by its 3-digit ''Index''. If the line does not exist this call fails.<br /> <br /> <br /> Note the ''Index'' is not the line of the list to extract, but the 3-digit identifier. If multiple lines have the same identifier this will extract the first found.<br /> <br /> <br /> To find the index from the line, use [[API Component.Property.GetListIndex|GetListIndex]].<br /> <br /> <br /> To add the line to the list regardless of whether it exists, use [[API Component.Property.AddListItem|AddListItem]].<br /> <br /> ==Examples==<br /> ===Calling in a calculation===<br /> * Declare a variable 'result' of type BOOL<br /> * Add to a calculation icon: &lt;pre class=&quot;brush:[cpp]&quot;&gt;result = ::Component.Property.SetListItem(handle, &quot;property&quot;, &quot;index&quot;, &quot;value&quot;)&lt;/pre&gt;<br /> <br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=File:Gen_Window_Layout_Manager.png&diff=14409 2014-01-27T15:01:14Z

<p>JonnyW: JonnyW uploaded a new version of &amp;quot;File:Gen Window Layout Manager.png&amp;quot;</p> <hr /> <div>Dialog of the Window Layout manager</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Window_Layouts&diff=14408 2014-01-27T15:00:45Z

<p>JonnyW: </p> <hr /> <div>Select the Manage window layouts... option from the Window menu to open the Window Layouts dialog.<br /> <br /> <br /> This dialog allows you to customise Flowcode panes for easy transitions between different views. Up to ten layouts can be stored, including the default layout. These are mapped to the keys Ctrl-0 to Ctrl-9 while editing in Flowcode, whenever it is beneficial.<br /> <br /> <br /> [[File:Gen_Window_Layout_Manager.png|right]]<br /> __NOTOC__<br /> ====Save current====<br /> Select this option to store the window layout in the currently selected slot. Flowcode will ask you to confirm if this overwrites an existing layout. This operation can not be undone.<br /> <br /> ====Load workspace====<br /> You can select this to restore the current workspace.<br /> <br /> Alternatively you can hold the 'Ctrl' key down and press the corresponding number of that layout in the list or select from the ''Restore window layout'' option in the Flowcode Window menu.<br /> <br /> Ctrl-0 is always the default layout.<br /> <br /> ====Rename====<br /> This will allow you to rename the current workspace if one is selected<br /> <br /> ====Delete====<br /> This will prompt you to confirm, then delete the currently selected workspace. This operation can not be undone.<br /> <br /> ====Move up and Move down====<br /> These options allow you to sort your window layouts into an order preferable to you.</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Window_Layouts&diff=14407 2014-01-27T14:59:30Z

<p>JonnyW: </p> <hr /> <div>Select the Manage window layouts... option from the Window menu to open the Window Layouts dialog.<br /> <br /> <br /> This dialog allows you to customise Flowcode panes for easy transitions between different views.<br /> <br /> <br /> The current window layout can be stored here and recalled whenever it is beneficial.<br /> <br /> [[File:Gen_Window_Layout_Manager.png|right]]<br /> __NOTOC__<br /> ====Save current====<br /> Select this option to store the window layout in the currently selected slot. Flowcode will ask you to confirm if this overwrites an existing layout. This operation can not be undone.<br /> <br /> ====Load workspace====<br /> You can select this to restore the current workspace.<br /> <br /> Alternatively you can hold the 'Ctrl' key down and press the corresponding number of that layout in the list or select from the ''Restore window layout'' option in the Flowcode Window menu.<br /> <br /> Ctrl-0 is always the default layout.<br /> <br /> ====Rename====<br /> This will allow you to rename the current workspace if one is selected<br /> <br /> ====Delete====<br /> This will prompt you to confirm, then delete the currently selected workspace. This operation can not be undone.<br /> <br /> ====Move up and Move down====<br /> These options allow you to sort your window layouts into an order preferable to you.</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Window_Layouts&diff=14406 2014-01-27T14:59:01Z

<p>JonnyW: Created page with &quot;Select the Manage window layouts... option from the Window menu to open the Window Layouts dialog. This dialog allows you to customise Flowcode panes for easy transitions bet...&quot;</p> <hr /> <div>Select the Manage window layouts... option from the Window menu to open the Window Layouts dialog.<br /> <br /> This dialog allows you to customise Flowcode panes for easy transitions between different views.<br /> <br /> The current window layout can be stored here.<br /> <br /> <br /> [[File:Gen_Window_Layout_Manager.png|right]]<br /> __NOTOC__<br /> ====Save current====<br /> Select this option to store the window layout in the currently selected slot. Flowcode will ask you to confirm if this overwrites an existing layout. This operation can not be undone.<br /> <br /> ====Load workspace====<br /> You can select this to restore the current workspace.<br /> <br /> Alternatively you can hold the 'Ctrl' key down and press the corresponding number of that layout in the list or select from the ''Restore window layout'' option in the Flowcode Window menu.<br /> <br /> Ctrl-0 is always the default layout.<br /> <br /> ====Rename====<br /> This will allow you to rename the current workspace if one is selected<br /> <br /> ====Delete====<br /> This will prompt you to confirm, then delete the currently selected workspace. This operation can not be undone.<br /> <br /> ====Move up and Move down====<br /> These options allow you to sort your window layouts into an order preferable to you.</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=File:Gen_Window_Layout_Manager.png&diff=14405 2014-01-27T14:58:42Z

<p>JonnyW: Dialog of the Window Layout manager</p> <hr /> <div>Dialog of the Window Layout manager</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Compile.AddVar&diff=14382 2014-01-23T11:24:40Z

<p>JonnyW: /* Examples */</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Sent to a component to allow dynamic amendment of global constant declarations<br /> <br /> This event is part of the [[Event class Compile|Compile]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|STRING]] ''VarName''<br /> :The original Flowcode variable<br /> <br /> [[Variable Types|STRING]] ''ExpandName''<br /> :The expanded variable name<br /> <br /> [[Variable Types|STRING]] ''Expansion''<br /> :The expanded string to inline to the code<br /> :''This parameter is returned back to Flowcode''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> Non-zero to include definition - initialised on call<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> <br /> <br /> On some PIC devices there are sometimes two types of RAM memory due to bus limitations, near and far. Near memory is fast to access but is limited by the size of the internal bus. Far memory is much less limited but means additional overhead when fetching or storing values.<br /> <br /> <br /> <br /> [[File:FarMem.jpg]]<br /> <br /> <br /> <br /> When creating Flowcode variables these will default to being stored in near memory to optimise the time to fetch and store values. If you run out of room in near memory then you may get a message like this during compilation.<br /> <br /> <br /> <br /> '''C:\Users\BenR\Desktop\FarMem.o: Link Error: Could not allocate section .nbss, size = 4118 bytes, attributes = bss near''' <br /> <br /> '''Link Error: Could not allocate data memory'''<br /> <br /> <br /> <br /> To tell the compiler to move the variable into FAR memory in C you would do something like this.<br /> <br /> <br /> <br /> '''__attribute__((far)) unsigned char data[4096];'''<br /> <br /> <br /> <br /> The Flowcode variable defaults to something like this.<br /> <br /> <br /> <br /> '''MX_GLOBAL MX_UINT8 FCV_DATA[FCVsz_DATA]; // Large Data Array'''<br /> <br /> <br /> <br /> The AddVar event is used during the compile to C process to take the variables from the variable manager and generate the necessary C code. By calling a macro to run on this event we can tailor the way the variables are added to the C and add in the cast to FAR memory.<br /> <br /> <br /> [[File:AdVar.jpg]]<br /> <br /> <br /> The first thing we need to do in the macro is compare the name of the variable that is currently being processed with the name of the variable we want to store into FAR memory. The string compare function returns 0 if the two strings match up so in the No branch of the decision we then add the &quot;__attribute__((far)) &quot; string to the expansion string.<br /> <br /> <br /> [[File:EvAddVar.jpg]]<br /> <br /> <br /> After saving the project and refreshing the C code window the variable now looks like this.<br /> <br /> <br /> <br /> '''__attribute__((far)) MX_GLOBAL MX_UINT8 FCV_DATA[FCVsz_DATA]; // Large Data Array'''<br /> <br /> <br /> <br /> And during compilation we now get this.<br /> <br /> <br /> <br /> '''Total data memory used (bytes): 0x1116 (4374) 15%'''<br /> <br /> '''...'''<br /> <br /> '''HEX file creation successful!'''<br /> <br /> <br /> <br /> Here is the file as a demonstration.<br /> <br /> {{fcfile|FarMem.fcfx|Far Mem demo}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Dashboard_Panel&diff=14352 2014-01-21T12:57:10Z

<p>JonnyW: </p> <hr /> <div>The Dashboard Panel provides a framework on which to load Flowcode components that compliments the [[System Panel]]. It is designed to show the representation of abstract components such as dials and meters during simulation.<br /> <br /> [[File:Dashboard Example 01.jpg|thumb|right|The Dashboard Panel]]<br /> <br /> <br /> __TOC__<br /> <br /> == Overview ==<br /> <br /> The Dashboard Panel is opened by selecting it in the View menu. Unlike the [[System Panel]], the Dashboard panel gives only a top-down view of the components, though they can be made more lifelike by clicking on the ‘3D view’ icon. [[File:Gen Panel Perspective 01.png|border]]. Components are typically designed in the [[System Panel]] and then used during programming in the dashboard.<br /> <br /> When the dashboard opens, you see a colored workspace. The color is set in the 'General Options'. [[File:Gen_Panel_General_Options_01.png|border]]<br /> <br /> ===Differences to the System panel===<br /> The Dashboard panel has a '''Shapes''' toolbar running vertically down the left-hand side, and a '''Controls''' toolbar running horizontally across the top. However these have more limited functionality on the [[System Panel]] as the Dashboard is not designed for modelling objects or creating components.<br /> <br /> [[Component|Components]] can be added to the Dashboard panel from the [[Tools and Views#3) Components Toolbar|Components Toolbar]] as they can to the System Panel. The intent is that this is used for more abstract and ''non-physical'' components such as dials and meters, though there is no restriction on what you can add.<br /> <br /> These components can then easily remain visible while the [[Camera Control|camera]] and any moving objects simulate on the System panel.<br /> <br /> The camera on the Dashboard is fixed, unlike the System panel which has full 3D movement.<br /> <br /> == Camera control ==<br /> The Dashboard camera can only '''pan''', it will not '''rotate'''. This means the Dashboard always displays a top-down 2D appearance, though in reality it is capable of displaying any 3D object.<br /> <br /> To move and control the camera:<br /> * Hold down the '''Ctrl''' key and click-drag the mouse to ''pan'' the camera (move the position of the camera).<br /> * Hold down '''Alt''' and click anywhere on the panel to move the camera over that point or object (move the position of the camera to the object).<br /> <br /> ===Zoom===<br /> <br /> [[File:Gen Panel Camera Zoom 01.png|border]] There is also a zoom facility, operated by pressing the '''Ctrl''' key and moving the cursor over the viewpoint icon. Clicking the mouse button in this and dragging downwards causes the view to zoom out. Dragging upwards causes the view to zoom in. The same functionality can be achieved by holding '''Ctrl''' and using the mouse wheel.<br /> <br /> <br /> ''Hint:''<br /> :The coordinates of the cursor are shown in the status bar at the bottom of the screen. Using this information can help you to position objects.<br /> <br /> :First of all, move the cursor to the desired position, to find its coordinates. Then enter these into the 'Position' [[Component Properties|properties]] of the object in the [[Properties Panel]].<br /> <br /> ==Selecting items==<br /> Multiple items can be selected:<br /> * By holding down the '''Shift''' key and then clicking on a number of items, one after the other;<br /> * By left-clicking the mouse button and dragging over the items. <br /> <br /> They can then be grouped:<br /> * By clicking on the 'Group' icon. [[File:Gen Panel Object Group 01.png|border]]<br /> * By selecting the 'Group' option from the ‘Selection’ menu which appears when you click the right-hand mouse button. <br /> <br /> In this way, complex [[Component Tree|nested structures]] can be assembled from a number of parts.<br /> To ungroup, select the object and then click on the same icon.<br /> <br /> == Shapes toolbar ==<br /> [[File:Gen_Panel_Shapes_Toolbar_01.png|center|border]]<br /> <br /> At the top is a colour selector, which sets the colour of any shape added to the work area. By clicking on the down-arrow, one of a wide range of colours can be selected.<br /> <br /> Below it is the 'Text' icon, used to 'drag and drop' a single row of alphanumeric characters onto the work area. Afterwards, you can select it, by clicking on it, and configure it using the [[Properties Panel]]. In particular, when added, you can edit the default text displayed using the bottom ‘Text’ control on the Properties Panel.<br /> <br /> The next icon is a 'Textbox' icon. Unlike the text label this has multiple lines and the text does not stretch as its area is resized.<br /> <br /> The remaining icons allow you to add a variety of shapes, all two-dimensional, to the work area. Each takes the colour chosen in the colour selector at the top. Each one can be configured using the Properties Panel, to determine the position, size and rotation of the shape, for example.<br /> <br /> If 3D shapes are required any object can be dragged between the Dashboard and System panel and dropped in the required position.<br /> <br /> <br /> == Controls toolbar ==<br /> ===Moving objects===<br /> [[File:Gen Panel Object Controls 01.png|frame|center|Component controls]]<br /> The first four controls operate on the size, position and rotation of the component. <br /> <br /> [[File:Gen Panel Object Move 01.png|border]] '''Move''' allows you to move the selected object around the work area. <br /> <br /> [[File:Gen Panel Object Stretch 01.png|border]] '''Stretch''' allows you to re-position a single point on an item. When you select an object and click on this control, pink anchors appear on the object. Selecting one of these allows it to be moved to a new position on the work area. The effect is to change the appearance, size or rotation of the object.<br /> <br /> [[File:Gen Panel Object Scale 01.png|border]] '''Scale''' allows you to change the size of the object. After selecting an object and clicking on this control, a number of blue anchors appear on the object. Any of these can be dragged to re-size that particular dimension of the object. (Handles at the corners affect size in two dimensions.)<br /> <br /> [[File:Gen Panel Object Rotate 01.png|border]] '''Rotate''' allows you to rotate an object. After selecting it and clicking on this control, a number of yellow anchors appear on the object. These allow the object to be rotated around different axes. Corner anchors will spin the object.<br /> <br /> ===General Options===<br /> <br /> The next control determines what happens when two objects ‘collide‘, with respect to the camera view. There are 3 options available:<br /> <br /> [[File:Gen Panel Object Collision Move Through.png|border]] '''Move Through''' ignores collision by moving through the colliding object and ignoring it completely.<br /> <br /> [[File:Gen Panel Object Collision Move Around.png|border]] '''Move Around''' avoids collision by moving the object around the colliding object. '''''Note: this is the default option set by Flowcode.'''''<br /> <br /> [[File:Gen Panel Object Collision Move Over.png|border]] '''Move Over''' avoids collision by moving the object over the colliding object.<br /> <br /> <br /> The next two controls are used to set properties for the whole panel.<br /> <br /> [[File:Gen Panel Tools 01.png|border]] The first control, 'Tools' allows you to lock movement of objects:<br /> * To the grid, <br /> * To other objects,<br /> * To the table-top<br /> <br /> The grid can be re-sized and made visible in a range of colors via this control. <br /> <br /> <br /> [[File:Gen Panel General Options 01.png|border]]<br /> The second control, 'General Options' is used to:<br /> * Set the colour or image of the display;<br /> * Set the number of views, allowing, for example, plan and elevation views of a component;<br /> * Set the ''level of detail'' of all the displays.</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=System_Panel&diff=14351 2014-01-21T12:54:44Z

<p>JonnyW: </p> <hr /> <div>[[File:Gen System Panel Example 02.jpg|thumb||The System Panel]]<br /> The System panel provides a real-world framework on which to load Flowcode components that compliments the [[Dashboard Panel]]. It is designed to show the physical representation of real world components during simulation.<br /> <br /> __TOC__<br /> <br /> == Overview ==<br /> The System Panel is opened by selecting it in the View menu. Unlike the [[Dashboard Panel]], the System Panel is designed to simulate a 3D environment. It is best suited to designing and positioning objects as all aspects of an object can be viewed. Once an object is designed, it is often used in projects via the [[Dashboard Panel]].<br /> <br /> When it opens, you see a central coloured square, called the ''Table top'', set against a coloured background. The colours or images of both are set in the 'General Options'. [[File:Gen_Panel_General_Options_01.png|border]]<br /> <br /> The System panel has a '''Shapes''' toolbar running vertically down the left-hand side, and a '''Controls''' toolbar running horizontally across the top.<br /> <br /> [[Component|Components]] can be added to the System panel from the [[Tools and Views#3)Components Toolbar|Components Toolbar]]. Then, input devices like [[Component: ID 953a042a b2aa 4f2e 94e2 ee2979cfc92e|switches]] can be operated to control the progress of the simulation, while output devices, like [[Component: ID a7b05886 784c 48c8 a6f6 cc371c7728e1|LEDs]] show the result.<br /> <br /> ===Table top===<br /> The Table top provides a 'surface' on which components are placed. It is a flat plane that objects can be placed on. When locked to the Table top, all objects sit on top of it and interact as solid objects.<br /> <br /> It is also useful as a surface for shadows, giving a sense of depth and orientation. The rotate mode of the camera treats the table top as the 'ground' and keeps the camera orientated with this in mind.<br /> <br /> ===Video instructions===<br /> <br /> There are an array of videos at your disposal to educate you and improve your skills using Flowcode, to get started with the System Panel see the [http://www.youtube.com/watch?v=2VvUSCCc-sE&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ&amp;index=8 Introduction to the System Panel] video for an overview of the fundamental functionality available using the System Panel.<br /> <br /> &lt;div align=&quot;center&quot;&gt;<br /> {{#ev:youtube|2VvUSCCc-sE|640}}<br /> &lt;/div&gt;<br /> <br /> ==Camera control==<br /> The [[Camera Control|camera]] (viewpoint) can be panned or rotated around different axes using the three icons shown.<br /> <br /> These work in conjunction with the Ctrl, Shift and Alt keys and with the three coloured arrow heads that show the camera orientation. <br /> &lt;gallery widths=64x52px perrow=3 caption=&quot;Camera controls&quot; style=&quot;margin:auto; text-align:center;&quot;&gt;<br /> File:Gen_Panel_Camera_Pan_01.png|'''Pan'''<br /> File:Gen_Panel_Camera_Rotate_01.png|'''Rotate'''<br /> File:Gen_Panel_Camera_Orbit_01.png|'''Orbit'''<br /> &lt;/gallery&gt;<br /> <br /> To move and control the camera:<br /> * Hold down the '''Ctrl''' key and click-drag the mouse to move the camera eye (the position of the camera).<br /> * Hold down both the '''Ctrl''' and '''Shift''' keys and click-drag the mouse to move the camera target (the view of the camera).<br /> * Hold down '''Alt''' and click anywhere on the panel to move the camera over that point or object (move the camera to the object).<br /> <br /> <br /> ===Zoom===<br /> [[File:Gen_Panel_Camera_Zoom_01.png|border]] There is also a zoom facility, operated by pressing the '''Ctrl''' key and moving the cursor over the viewpoint icon. Clicking the mouse button in this and dragging downwards causes the view to zoom out. Dragging upwards causes the view to zoom in. The same functionality can be achieved by holding Ctrl and using the mouse wheel.<br /> <br /> <br /> ===Axis alignment===<br /> The coloured arrows in the top left corner of the panel show the orientation of the camera. You can click any of these arrows to reset the view to look in that axis.<br /> <br /> For example, clicking on the blue arrow gives a top-down view – looking down the ‘Z’ axis. Clicking on one of the other coloured arrows rotates the object about that axis.<br /> <br /> <br /> ''Hint:''<br /> :The coordinates of the cursor are shown in the status bar at the bottom of the screen. Using this information can help you to position objects.<br /> <br /> :First of all, move the cursor to the desired position, to find its coordinates. Then enter these into the 'Position' [[Component Properties|properties]] of the object in the [[Properties Panel]].<br /> <br /> <br /> ===Video instructions===<br /> See the following Youtube videos to learn how to effectively control the camera and navigate the panels:<br /> <br /> The [http://www.youtube.com/watch?v=CERJCvyInV8&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Camera Control 1] video covers the basic camera controls and camera rotation and general camera manipulation.<br /> <br /> The [http://www.youtube.com/watch?v=uG20xwQtcCM&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Camera Control 2] video covers slightly more advanced features such as using keyboard shortcuts as well as mouse movement to navigate the panel more effectively.<br /> <br /> {| style=&quot;margin:auto;&quot;<br /> |-<br /> |{{#ev:youtube|CERJCvyInV8}}<br /> | width=&quot;100px&quot; |<br /> |{{#ev:youtube|uG20xwQtcCM}}<br /> |}<br /> <br /> <br /> ==Manipulating objects==<br /> <br /> ===Selecting items===<br /> Multiple items can be selected:<br /> * By holding down the '''Shift''' key and then clicking on a number of items, one after the other;<br /> * By left-clicking the mouse button and dragging over the items. <br /> <br /> They can then be grouped:<br /> * By clicking on the 'Group' icon. [[File:Gen_Panel_Object_Group_01.png|border]]<br /> * By selecting the 'Group' option from the ‘Selection’ menu which appears when you click the right-hand mouse button. <br /> <br /> In this way, complex [[Component Tree|nested structures]] can be assembled from a number of parts.<br /> To ungroup, select the object and then click on the same icon.<br /> <br /> <br /> ===Shapes toolbar===<br /> At the top is a colour selector, which sets the colour of any shape added to the work area. By clicking on the down-arrow, one of a wide range of colours can be selected.<br /> <br /> Below that there is a button to swap between 2D and 3D shapes on the toolbar, this allows you to quickly and easily access different shapes and differentiate the 2D and 3D shapes with ease as they are separated into different sections. All objects can be dragged between the Dashboard and System panel and dropped in the required position, although the 3D shapes cannot be found on the Dashboard Panel shapes toolbar.<br /> <br /> [[File:Gen_Panel_Shapes_Toolbar_01.png|center|border]]<br /> <br /> Under the 2D section there is a 'Text' icon, used to 'drag and drop' a single row of alphanumeric characters onto the work area. Afterwards, you can select it, by clicking on it, and configure it using the [[Properties Panel]]. In particular, when added, you can edit the default text displayed using the bottom ‘Text’ control on the Properties panel. As well as text, there are also a few two-dimensional shapes available, including; '''Ellipse''' (circle), '''Rectangle''', '''Rounded Rectangle''' and '''Line'''.<br /> <br /> <br /> The remaining icons under the 3D section allow you to add a variety of three-dimensional shapes to the work area. Each takes the colour chosen in the colour selector at the top. Each shape can be configured using the Properties Panel, to determine the position, scale, rotation and even the colour of the shape.<br /> <br /> <br /> ===Video instructions===<br /> Watch the [http://www.youtube.com/watch?v=2yT5XTLLX6o&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Adding Objects to the Panel] video for a demonstration and explanation about adding components and objects to the System Panel.<br /> <br /> <br /> See the [http://www.youtube.com/watch?v=5-IzDJ2NDcc&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Aligning Objects on the Panel 1] video to learn the basics of aligning objects on the panel, this video covers the all available options of the 'Snap to' function including Snap to '''''Grid''''', '''''Objects''''' and '''''Table top'''''.<br /> <br /> <br /> The next video, [http://www.youtube.com/watch?v=okbJ9pJrEeA&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Aligning Objects on the Panel 2], expands onto manipulating objects by moving, rotating and scaling / re-sizing objects to align them on the panel, this video makes use of the [[Project Explorer]] in order to manipulate the objects precisely.<br /> <br /> <br /> Finally, the [http://www.youtube.com/watch?v=0b0jtQzBS9Q&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Alignig Objects on the Panel 3] video details additional options to effectively align objects on the panel, this includes various options from the context menu when you right-click a selected object.<br /> {| style=&quot;margin:auto; text-align:center;&quot;<br /> |-<br /> |{{#ev:youtube|2yT5XTLLX6o}}<br /> | width=&quot;100px&quot; |<br /> |{{#ev:youtube|5-IzDJ2NDcc}}<br /> |-<br /> | colspan=&quot;3&quot; | &lt;br /&gt;<br /> |-<br /> |{{#ev:youtube|okbJ9pJrEeA}}<br /> | width=&quot;100px&quot; |<br /> |{{#ev:youtube|0b0jtQzBS9Q}}<br /> |}<br /> <br /> ==Controls toolbar==<br /> ===Moving objects===<br /> The first four controls operate on the size, position and rotation of the component. <br /> <br /> [[File:Gen Panel Object Controls 01.png|frame|center|Component controls]]<br /> <br /> [[File:Gen Panel Object Move 01.png|border]] '''Move''' allows you to move the selected object around the work area. <br /> <br /> [[File:Gen Panel Object Stretch 01.png|border]] '''Stretch''' allows you to re-position a single point on an item. When you select an object and click on this control, pink anchors appear on the object. Selecting one of these allows it to be moved to a new position on the work area. The effect is to change the appearance, size or rotation of the object.<br /> <br /> [[File:Gen Panel Object Scale 01.png|border]] '''Scale''' allows you to change the size of the object. After selecting an object and clicking on this control, a number of blue anchors appear on the object. Any of these can be dragged to re-size that particular dimension of the object. (Handles at the corners affect size in two dimensions.)<br /> <br /> [[File:Gen Panel Object Rotate 01.png|border]] '''Rotate''' allows you to rotate an object. After selecting it and clicking on this control, a number of yellow anchors appear on the object. These allow the object to be rotated around different axes. Corner anchors will spin the object.<br /> <br /> <br /> ===Controlling the camera===<br /> The next three controls determine the camera (viewpoint) behavior.<br /> <br /> [[File:Gen Panel Camera Controls 01.png|frame|center|Camera controls]]<br /> <br /> [[File:Gen Panel Camera Pan 01.png|border]] '''Pan''' allows the camera to pan left / right / up / down.<br /> <br /> [[File:Gen Panel Camera Rotate 01.png|border]] '''Rotate''' allows the camera to rotate assuming the table top is the ground.<br /> <br /> [[File:Gen Panel Camera Orbit 01.png|border]] '''Orbit''' third allows the camera to rotate without considering the table top.<br /> <br /> <br /> ===General Options===<br /> <br /> The next control determines what happens when two objects ‘collide‘, with respect to the camera view. There are 3 options available:<br /> <br /> [[File:Gen Panel Object Collision Move Through.png|border]] '''Move Through''' ignores collision by moving through the object and ignoring collision completely.<br /> <br /> [[File:Gen Panel Object Collision Move Around.png|border]] '''Move Around''' avoids collision by moving the object around the colliding object. '''''Note: this is the default option set by Flowcode.'''''<br /> <br /> [[File:Gen Panel Object Collision Move Over.png|border]] '''Move Over''' avoids collision by moving the object over the colliding object.<br /> <br /> <br /> [[File:Gen_Panel Camera Align 01.png|border]] The '''Align Axis''' control is used to mirror the axis of the selected object, this follows the alignment of the component axis, even when being manipulated and rotated<br /> <br /> <br /> The next two controls are used to set properties for the whole panel.<br /> <br /> [[File:Gen Panel Tools 01.png|border]] The first control, 'Tools' allows you to lock movement of objects:<br /> * To the grid, <br /> * To other objects,<br /> * To the table-top<br /> <br /> The grid can be re-sized and made visible in a range of colors via this control. <br /> <br /> <br /> [[File:Gen Panel General Options 01.png|border]]<br /> The second control, 'General Options' is used to:<br /> * Set the colour or image of the display;<br /> * Set the number of views, allowing, for example, plan and elevation views of a component;<br /> * Set the ''level of detail'' of all the displays.<br /> <br /> == Multiple views==<br /> A powerful feature of Flowcode 6 is the ability to view the components from several camera angles simultaneously, enabling orthographic design of the system. Up to four views can be shown. <br /> <br /> The number of views can be changed by clicking the 'General Options' [[File:Gen Panel General Options 01.png|border]] icon and then clicking on the drop down menu [[File:Btn_Menu_Arrow.png]] next to the 'Number of views:' option and then selecting a value from 1-4 on the menu.<br /> <br /> By clicking on the appropriate arrowheads, you can set up each view as shown below.<br /> <br /> Depending on the size and shape of the Systems Panel, the three views may be arranged vertically, instead of horizontally. Drag one edge of the Systems Panel sideways to see this effect.<br /> [[File:gen_exerciseSystemPanelshapecontrol_threeview1_01.png|500px|center]]<br /> <br /> You can adjust the viewpoint individually for each view, by operating the 'camera position' controls.<br /> <br /> An example of doing so is given below - notice the positions of the red, green and blue arrows in each:<br /> [[File:gen_exerciseSystemPanelshapecontrol_threeview2_01.png|500px|center]]<br /> <br /> Alternatively, you can make changes to the objects themselves, in which case all three views are affected at once.<br /> <br /> In the next image, the instrument panel has been rotated:<br /> [[File:gen_exerciseSystemPanelshapecontrol_threeview3_01.png|500px|center]]</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Using_Interrupts&diff=14339 2014-01-16T15:59:52Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: What Is an Interrupt?&lt;/sidebar&gt;<br /> Interrupts are a way of grabbing the microcontroller's attention immediately.<br /> <br /> They are very widely used, both in microcontrollers and microprocessors. For example, the keyboard and mouse in your computer probably use interrupts to talk to the CPU.<br /> <br /> They can also be used to save energy. In many battery-powered applications, the microcontroller is 'put to sleep' when inactive, and so requires little energy. An interrupt is used to 'awaken' the controller, and bring it back into operation, when needed.<br /> <br /> <br /> This exercise shows how to use an interrupt to sense when a switch is closed, (an external interrupt).<br /> <br /> __TOC__<br /> <br /> <br /> ==Polling vs interrupt==<br /> <br /> The microcontroller is often connected to a large number of peripheral input devices - switches, sensors, memory, timers etc. <br /> There are two broad ways in which one of these devices can be serviced by the microcontroller:<br /> * polling - each device is 'asked' in turn if it has data to transfer to the controller;<br /> * interrupts - allow the device to interrupt the task being carried out by the controller.<br /> <br /> The exercise aims to show the difference between polling and using interrupts. <br /> <br /> <br /> ==The system==<br /> <br /> This exercise sets up a system with LEDs controlled by two switches:<br /> ::* Switch 1 is polled by the program, at regular intervals.&lt;br /&gt;<br /> ::* Switch 2 initiates an interrupt.<br /> <br /> <br /> The polled switch, switch 1, is checked at regular (and predictable) intervals - every six seconds in this example.<br /> Switch 2 is connected so that as soon as it operates, the processor stops what it is doing and jumps to the Interrupt Service Routine (ISR). In the process, the return address is stored, so that at the end of the ISR, the processor can return to where it left the main program. In Flowcode, the ISR takes the form of a macro, configured like any other.<br /> <br /> <br /> ==The flowchart==<br /> <br /> The flowchart sequence:<br /> :* Check if switch 1 is pressed.<br /> :: If it isn't, make the red LED flash slowly.<br /> :: If it is, make the yellow LED flash slowly.<br /> :* Go back to the beginning and repeat the process.<br /> :* Whenever switch 2 is pressed, immediately make both LEDs flash quickly ten times and then go back to the main program.<br /> <br /> <br /> ==The main program==<br /> <br /> * [[Creating Flowcharts|Start a new Flowcode flowchart]], using the default microcontroller.<br /> <br /> * Make sure that the [[System Panel]] is visible. If necessary, click on [[View]] and then select 'System Panel' a check-box will appear next to the option when enabled.<br /> <br /> * Drag and drop a 'Loop' icon between the BEGIN and END icons.<br /> <br /> * Inside the loop, drag and drop an 'Input' icon from the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> <br /> * Drag and drop a 'Decision' icon after the 'Input' icon.<br /> <br /> Next, add icons to control what happens when switch is not pressed, (and so the program follows the 'No' branch):<br /> <br /> * Drag and drop an 'Output' icon in the 'No' branch.<br /> : This icon is going to turn the red LED on.<br /> <br /> * Drag and drop a 'Delay' icon after the 'Output' icon.<br /> : This will keep the LED on for three seconds.<br /> <br /> * Follow it with another 'Output' icon.<br /> : This icon is going to turn the LED off.<br /> <br /> * Add a second 'Delay' icon next.<br /> : This will keep the LED off for three seconds.<br /> <br /> The program then loops back and checks the state of the switch again.<br /> <br /> Next, add icons to control what happens when switch is pressed, and so the program follows the 'Yes' branch:<br /> <br /> * Drag and drop an 'Output' icon in the 'Yes' branch.<br /> <br /> * Drag and drop a 'Delay' icon after the 'Output' icon.<br /> <br /> * Follow it with another 'Output' icon.<br /> <br /> * Add a second 'Delay' icon next.<br /> <br /> The program then loops back, as before, and checks the state of the switch again.<br /> <br /> <br /> ==Add switch 1 and the LEDs ==<br /> <br /> * Locate the 'Inputs' toolbox, and click on the down arrow next to the switch labelled 'Toggle Metal PCB'. [[File:Component Icon c6c91999 1fe0 414e b6aa 0a7ddc9a6417.png]]<br /> : Click on the 'Add to system panel' option.<br /> : Configure its properties so that it is connected to Port B, bit 1.<br /> <br /> * Locate the 'Outputs' toolbox, and click on the down arrow next to the 'LED Array' label. [[File:Component Icon c8da67a7 fc7b 48c0 8c3f 3264c74f4024.png]]<br /> : Click on the 'Add to system panel' option.<br /> * Click on one, and configure its properties as follows<br /> :: set the 'Count' property to &quot;2&quot;, to give two LEDs in the array;<br /> :: set the colour of LED0 to red, and that of LED1 to yellow.<br /> :: LED0 will light when Port A is sent value '1', and LED1 will light when Port A is sent value '3';<br /> :: check that the 'Connections' property shows that it is connected to Port A.<br /> <br /> Double click on each icon in the flowchart and configure it as shown in the following images:<br /> <br /> &lt;gallery caption=&quot;Configuring the icons&quot; perrow=&quot;6&quot;&gt;<br /> File:Exercise_UsingInt_redLEDon.jpg|Turn the red LED on<br /> File:Exercise_UsingInt_3sdelay.jpg|Three seconds delay<br /> File:Exercise_UsingInt_LEDoff.jpg|Turn the LEDs off<br /> File:Exercise_UsingInt_yellLEDon.jpg|Turn on the yellow LED<br /> File:Exercise_UsingInt_sw1_prop.jpg|Configure switch 1<br /> File:Exercise_UsingInt_decision.jpg|Configure the decision icon<br /> &lt;/gallery&gt;<br /> <br /> To see a larger version, double click on the image.<br /> <br /> Simulate the flowchart to make sure that the LEDs behave as expected.<br /> <br /> <br /> ==Add switch 2==<br /> [[File:Exercise_UsingInt_int_prop.jpg|200px|right]]<br /> <br /> * Add a second 'Toggle Metal PCB' switch to the system panel.<br /> : Configure its properties so that it is connected to Port B, bit 0 - the hardware interrupt bit.<br /> * Drag and drop an interrupt icon [[File:Btn_Interrupt.gif|border]] between 'BEGIN'and the upper loop icon, (although it will work anywhere in the flowchart.)<br /> : Double click on the icon, and configure it as shown opposite.<br /> * The next task is to create the ISR. Click on the 'Create New Macro...' button.<br /> [[File:Exercise UsingInt Int flashfastmacro.jpg|200px|right]]<br /> <br /> * The 'Create a New Macro' dialogue box opens. <br /> : Give the macro the name &quot;flash_fast&quot;.<br /> : Click on OK.<br /> <br /> * In the 'Properties:Interrupt' dialogue box, click on the 'OK &amp; Edit Macro' button.<br /> : Create the flowchart shown opposite for the macro.<br /> : Sending value '3' (=00011 in binary,) to Port A switches on both LEDs.<br /> <br /> ==The main flowchart==<br /> <br /> Your flowchart should now be set up to resemble the image below: <br /> <br /> <br /> [[File:Exercise_UsingInt_main.jpg|350px|center]]<br /> <br /> <br /> <br /> ==Test the system==<br /> <br /> Earlier, you tested the effect of switch 1 on the LEDs. Now you can test the effect of switch 2 as well.<br /> * Run the simulation, and confirm the action of switch 1 on the LEDs.<br /> * While Flowcode is simulating a three second delay, toggle switch 2 on and off.<br /> : The three second simulationshould stop, mid-delay, and both LEDs should flash quickly, ten times, as specified in the ISR.<br /> : After this, the microcontroller resumes the main program from where it left off, the three second delay.<br /> * Repeat the tests until you are happy with the way the system operates.<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Using Interrupts.fcfx|Exercise - Using Interrupts}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Using_Simulation_Macros&diff=14340 2014-01-16T15:59:52Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: What Is a Macro?&lt;/sidebar&gt;<br /> Simulation macros are a form of Component macros. Their purpose is to make simulation more realistic by adding physical components to the electronic devices.<br /> <br /> When the Flowcode program is compiled and downloaded to a microcontroller, they are ignored - hence the name Simulation macros. <br /> <br /> Even a cursory glance at the dialogue box used to configure them shows that they are very powerful devices, with a huge range of possible effects.<br /> <br /> This exercise uses three of them to illustrate the use of a PIR (Passive Infra-Red sensor) to operate an intruder sensor.<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==The scenario==<br /> <br /> The scene depicts the front of a house. <br /> [[File:Exercise SimIcon pan.png|center|350px]]<br /> <br /> A PIR sensor is mounted on the wall of the house, above the path leading across the garden.<br /> <br /> The data sheet for the PIR shows that it is sensitive to a range of 10 metres, within a cone of angle 100 degrees.<br /> <br /> Its detection area is represented in the image by the pale blue cone.<br /> <br /> When an intruder enters the detection cone, a warning lamp lights up in the house.<br /> <br /> This exercise allows us to investigate factors such as the height of the sensor on the brick wall and the angle of the detection zone, so that these can be optimised for a typical intruder height.<br /> <br /> <br /> ==The System Panel==<br /> <br /> On the System Panel, viewed from above (the default position,)create:<br /> * '''a brick wall''', represented by adding a red cuboid and changing it to a rectangle, 15mm wide, 120mm high and 120mm deep, <br /> :: located at coordinates x = 0, y = 0, z = 60, <br /> :: with rotation settings X = 0, Y = 0, Z = 0;<br /> <br /> * '''a path''', represented by a grey rectangle, 240mm wide, 100mm high and 0mm deep, <br /> :: located at coordinatesx = 125mm, y = 0mm, z = 0mm, <br /> :: with rotation settings of X = 0, Y = 0, Z = 0;<br /> <br /> * '''a cone''', couloured light blue, representing the sensing region of the PIR, with width = 70mm, height = 250mm, depth 95mm, <br /> :: located at coordinates x = 45mm, y = 0mm, z = 80mm, <br /> :: with rotation settings of X = 0, Y = -55, Z = 0.<br /> <br /> * Drag the mouse cursor over these three elements and group them together. <br /> <br /> This produces 'group 1'. <br /> :: Give this group:<br /> ::: dimensions - width = 265mm, height = 250mm, depth = 135mm;<br /> ::: coordinates - x = 128, y = 0, z = 68;<br /> ::: rotation - X = 0, Y = 0, Z = 0.<br /> <br /> <br /> Also on the System Panel, create an intruder, by:<br /> * adding four spheres, and configuring the properties as follows:<br /> :: sphere 1 ('''the head'''):<br /> ::: colour pink;<br /> ::: dimensions - width = 12mm, height = 13mm, depth = 15mm;<br /> ::: coordinates - x = -2.2, y = 0.7, z = 22;<br /> ::: rotation - X = 90, Y = 0, Z = 0.<br /> <br /> :: sphere 2 ('''the body'''):<br /> ::: colour blue;<br /> ::: dimensions - width = 14mm, height = 26mm, depth = 24mm;<br /> ::: coordinates - x = -2.2, y = 0.5, z = 4;<br /> ::: rotation - X = 90, Y = 0, Z = -180.<br /> <br /> :: sphere 3 ('''the legs'''):<br /> ::: colour dark green;<br /> ::: dimensions - width = 9mm, height = 23mm, depth = 15mm;<br /> ::: coordinates - x = -2.2, y = 1, z = -16;<br /> ::: rotation - X = 90, Y = 0, Z = -180.<br /> <br /> :: sphere 4 ('''the feet'''):<br /> ::: colour black;<br /> ::: dimensions - width = 6mm, height = 15mm, depth = 25mm;<br /> ::: coordinates - x = -6, y = 0, z = -25;<br /> ::: rotation - X = 90, Y = 90, Z = 0.<br /> <br /> * Drag the mouse cursor over the four spheres and group them together.<br /> <br /> This produces 'group 2'. <br /> :: Give it:<br /> ::: dimensions - width = 18mm, height = 32mm, depth = 60mm;<br /> ::: coordinates - x = 165, y = 0, z = 28;<br /> ::: rotation - X = 0, Y = 0, Z = 0.<br /> <br /> <br /> The System Panel should resemble the image shown above. (The image has been rotated to show all components. The table-top is coloured green.)<br /> <br /> Click on the 'Collisions' icon, [[File:Gen Panel Object Collision Move Around.png|35px]] and select the 'Move through' option, which allows the intruder to enter the detection cone.<br /> <br /> <br /> ==The Dashboard Panel==<br /> [[File:Exercise SimIcon dash.png|right|200px]]<br /> * Open the 'Outputs' toolbox, and locate the 'LED 5mm Panel' device.<br /> * Click on the down arrow next to it and choose the 'Add to dashboard panel' option.<br /> * Zoom in to the Dashboard Panel to make the LED large enough to see.<br /> * Click on the LED and configure its properties as follows:<br /> ::* choose a suitable colour, such as red;<br /> ::* connect it to Port A, bit 0.<br /> <br /> <br /> ==The Flowcode program==<br /> '''The plan:'''<br /> * Set the initial position of the intruder, using the 'MoveTo' simulation macro.<br /> <br /> * Move the intruder towards the detection cone using the 'MoveAlong' simulation macro. <br /> :: This '''changes''' the x coordinate of the intruder '''by an amount specified by the variable 'xpos''''. <br /> <br /> * When the intruder enters the detection zone, the simulation macro 'CollisionTest' returns a value of '1' in the variable 'hit'. <br /> :: At this point, we can stop any more movement so that we can look at the x coordinate of the intruder. <br /> :: To do so, we change the value of 'xpos' to zero.<br /> <br /> * Otherwise, the simulation repeats.<br /> <br /> <br /> '''Implementation:'''<br /> <br /> * [[Opening Flowcode|Open Flowcode]].<br /> <br /> * On the Startup screen, click on 'New project' to [[Creating Flowcharts|create a new flowchart]].<br /> <br /> * Add the icons shown in the flowchart:<br /> :* a loop icon, configured as an infinite loop, and within it:<br /> ::* a Simulation macro icon[[File:Btn Simulation Macro.gif|border]];<br /> ::* a second loop;<br /> ::* a Calculation icon.<br /> <br /> :* Within the second loop, add:<br /> ::* two more Simulation macro icons;<br /> ::* a decision icon with:<br /> :::* a 'Yes' loop containing an output icon, followed by a delay icon and then a calculation icon;<br /> :::* a 'No' loop containing an output icon, followed by a delay icon;<br /> <br /> [[File:Exercise_SimIcon_Simmove.png|right|250px]]<br /> <br /> * Configure the icons, by double clicking on each in turn, as follows:<br /> ::* the top Simulation macro:<br /> :::* name it &quot;Set initial position&quot;;<br /> :::* click on the 'Panel' tab, and then on the 'Position' folder;<br /> :::* click on the 'MoveTo' macro and:<br /> ::::* choose 'group2'(the intruder)as the Handle;<br /> ::::* set the X value to &quot;200&quot;;<br /> ::::* set the Y value to &quot;0&quot;;<br /> ::::* set the Z value to &quot;28&quot;;<br /> ::::* click on OK.<br /> <br /> <br /> ::* the second loop:<br /> :::* set it to 'Loop while:' &quot;hit = 0&quot;;<br /> :::* 'Test the loop at the:' 'End'<br /> :::* Click on OK.<br /> <br /> <br /> <br /> [[File:Exercise_SimIcon_Moveint.png|right|350px]]<br /> <br /> <br /> ::* the second Simulation macro:<br /> :::* name it &quot;Move the intruder&quot;;<br /> :::* click on the 'Panel' tab, and then on the 'Position' folder;<br /> :::* click on the 'MoveAlong' macro and:<br /> ::::* choose 'group2'(the intruder)as the Handle;<br /> ::::* choose 'shape1'( the brick wall) as the Axis;<br /> ::::* click on the down arrow on the end of the 'X' row, and create a floating point variable called &quot;xpos&quot;, with an initial value 5.0, to use as the X variable;<br /> ::::* click on OK.<br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> [[File:Exercise SimIcon Simcheck.png|right|250px]]<br /> <br /> <br /> ::* the third Simulation macro:<br /> :::* name it &quot;Check detection&quot;;<br /> :::* click on the 'Panel' tab, and then on the 'Collision' folder;<br /> :::* click on the 'TestSingle' macro and:<br /> ::::* choose 'shape2'(the detection cone) for 'Pos' and 'shape5' (the intruder's head,) for 'Test';<br /> :::* use the down arrow at the end of the 'Return Value' box to create a boolean variable caled &quot;hit&quot; to use as the 'Return Value'.<br /> ::::* click on OK.<br /> <br /> <br /> <br /> <br /> <br /> <br /> ::* the decision icon:<br /> :::* name it &quot;Intruder detected?&quot;;<br /> :::* insert the condition &quot;hit = 1&quot;;<br /> :::* click on OK.<br /> <br /> :::* In the 'Yes' loop:<br /> ::::* name the Output icon &quot;Switch on lamp&quot;;<br /> ::::* send value '1' to Port A single bit 0;<br /> ::::* click on OK.<br /> <br /> ::::* name the Delay icon &quot;Wait 100ms&quot;;<br /> ::::* configure it to give a delay of 100ms;<br /> ::::* click on OK.<br /> <br /> ::::* name the Calculation icon &quot;Stop movement&quot;;<br /> ::::* in the 'Calculations:' box, insert &quot;xpos = 0&quot; to reduce the distance incremented each time to zero;<br /> ::::* click on OK.<br /> <br /> :::* In the 'No' loop:<br /> ::::* name the Output icon &quot;Switch off lamp&quot;;<br /> ::::* send value '0' to Port A single bit 0;<br /> ::::* click on OK.<br /> <br /> ::::* name the Delay icon &quot;Wait 100ms&quot;;<br /> ::::* configure it to give a delay of 100ms;<br /> ::::* click on OK.<br /> <br /> <br /> ::* the final Calculation icon:<br /> ::::* name it &quot;Reset variables&quot;;<br /> ::::* in the 'Calculations:' box, insert &quot;hit = 0&quot; and &quot;xpos = 5.0&quot;;<br /> ::::* click on OK.<br /> <br /> <br /> <br /> <br /> The Flowcode flowchart resembles the one shown below:<br /> <br /> <br /> [[File:Exercise SimIcon Simflow.png|center|500px]]<br /> ==Testing==<br /> <br /> * Run the simulation.<br /> : The intruder should move towards the house, until he enters the detection zone. <br /> <br /> : At this point, the warning lamp turns on and he stops for three seconds.<br /> <br /> : Then the simulation repeats.<br /> <br /> * Stop the simulation when the lamp is lit, and click on the image of the intruder. You can now read the x coordinate from the Panel properties box.<br /> <br /> * Change the height of the PIR sensor on the wall, or the angle of the detection cone, and see what happens to this coordinate.<br /> <br /> <br /> ==Simulation only==<br /> The important point is that the Simulation macros do not compile to code that can be downloaded to a microcontroller. They affect only the simulation of the program.<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Using Simulation Macros.fcfx|Exercise - Using Simulation Macros}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Using_Analogue_Input_Devices&diff=14337 2014-01-16T15:59:51Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: What Is a Component?&lt;/sidebar&gt;<br /> The aim of this exercise is to demonstrate the use of analogue input devices within a Flowcode flowchart.<br /> <br /> <br /> Digital inputs are simpler to deal with, as they have a finite range of possible values.&lt;br /&gt;<br /> For example, a two bit digital input can have one of only four possible values - 00, 01, 10 or 11.&lt;br /&gt;<br /> Flowcode uses an 'Input' icon [[File:Btn Input.gif|border]] to deal with digital inputs.<br /> <br /> <br /> An analogue input, on the other hand can have any of an infinite number of possible values.&lt;br /&gt;<br /> As a result, it is more difficult to handle in Flowcode.<br /> [[File:Exercise_Using_Analogue_Input_Devices_System_Panel.png|300px|right]]<br /> A component macro [[File:Btn Component Macro.gif|border]] is used to input data from an analogue sensor.&lt;br /&gt;<br /> The data is then stored in a variable.<br /> <br /> <br /> Component macros are sections of code that have been written to support the components included with Flowcode 6.&lt;br /&gt;<br /> They take all the effort out of using these components.<br /> <br /> <br /> In this exercise, a warning lamp lights when the signal from an ADC dial device rises too far.<br /> <br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==The flowchart sequence==<br /> The flowchart will:<br /> ::::* Read the value set on the input device, the ADC dial.<br /> ::::* Compare this with a set value, and:<br /> ::::: if greater than the set value, turn on a lamp;<br /> ::::: if less, then make sure that the lamp is off.<br /> ::::* Loop back to the beginning, and repeat the process.<br /> <br /> <br /> <br /> <br /> [[File:Exercise_Using_Analogue_Input_Devices_Variable_Manager.png|300px|right]]<br /> ==Create the 'input' variable==<br /> :* In the 'Edit' menu, on the main toolbar, click on 'Variables...' to open the [[Variable Manager]] dialogue box.<br /> ::* Hover just to the left of the 'Variables' label, and click on the down arrow that appears.<br /> ::* Select 'Add new' and the 'Create a New Variable' dialogue box opens.<br /> ::* Name the new variable &quot;input&quot;.<br /> ::* Leave the variable type as 'Byte'.<br /> ::* Click on 'OK'.<br /> ::* The dialogue box is shown opposite.<br /> <br /> <br /> <br /> <br /> <br /> <br /> ==Create the flowchart==<br /> * Click and drag an infinite loop, [[File:Btn Loop.gif|border]] between the 'BEGIN' and 'END' icons.<br /> <br /> <br /> [[File:Exercise_Using_Analogue_Input_Devices_Component_Macro_Properties.png|300px|right]]<br /> * Inside the loop:<br /> :* Click and drag a 'Component macro' icon.[[File:Btn_Component_Macro.gif|border]]<br /> ::* Double click on it to open the dialogue box, so that you can configure it.<br /> ::: The program 'knows' which components you have added to the System or Dashboard panel, and modifies the list of available commands accordingly.<br /> ::: Under 'Components', the ADC dial will be listed, and underneath it the list of commands.<br /> ::* Scroll down the list and click on the 'GetByte' command.<br /> ::: This reads the output of the analogue input device - the ADC dial in this case, and stores it in the byte variable called 'input'.<br /> ::* Rename the 'Display name' as &quot;Read the input&quot;.<br /> ::* Click on 'OK'.<br /> ::* Again, the dialogue box is shown opposite.<br /> <br /> <br /> * Next, drag and drop a 'Decision' box, [[File:Btn Decision.gif|border]] and double click on it to open the dialogue box.<br /> [[File:Exercise_Using_Analogue_Input_Devices_Decision_Properties.png|300px|right]]<br /> :* Rename it &quot;Compare it !&quot;<br /> :* In the condition 'If' box, type &quot;input&gt;128&quot;.<br /> :: The '128' is totally arbitrary in this program. A byte variable can store any value from 0 to 255, so 128 is roughly half way.<br /> :: In this case, the program decides whether the value stored in the variable 'input' is greater or smaller than 128, and reacts differently depending on that decision.<br /> :* Click on 'OK'.<br /> ::* Again, the resulting dialogue box is shown opposite.<br /> <br /> <br /> [[File:Exercise_Using_Analogue_Input_Devices_Output_Properties_01.png|300px|right]]<br /> * In the 'Yes' branch, drag and drop an 'Output' icon, [[File:Btn Output.gif|border]].<br /> :* Double click on it to open the dialogue box.<br /> :* Change the 'Display name:' to &quot;Switch on the lamp&quot;.<br /> :* In the 'Variable or value:' box, type &quot;1&quot;.<br /> :* Configure the rest of the box to output this to 'PORT A' 'Single Bit:' 0.<br /> :* Click on 'OK'.<br /> <br /> <br /> <br /> [[File:Exercise_Using_Analogue_Input_Devices_Output_Properties_02.png|300px|right]]<br /> * In the 'No' branch, drag and drop a second 'Output' icon.<br /> :* Double click on it to open the dialogue box.<br /> :* Change the 'Display name:' to &quot;Switch off the lamp&quot;.<br /> :* In the 'Variable or value:' box, type &quot;0&quot;.<br /> :* Configure the rest of the box to output this to 'PORT A' 'Single Bit:' 0.<br /> :* Click on 'OK'.<br /> ::* Again, the dialogue boxes for the 'Output' icons are shown opposite.<br /> <br /> <br /> <br /> <br /> The flowchart should now resemble the one shown below.<br /> [[File:Exercise_Using_Analogue_Input_Devices_Flowchart.png|300px|center]]<br /> <br /> <br /> <br /> ==Add the LED==<br /> * Locate an [[Component: ID a7b05886 784c 48c8 a6f6 cc371c7728e1|LED]] such as the [[Component: ID 7fdaec78 394e 4ec9 a578 4f1a12a12076|LED 5mm Panel]] in the 'Outputs' toolbox in the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> :* Hover over the image to the left of the component label 'LED 5mm Panel', and click on the down-arrow that appears.<br /> :* Click on the 'Add to system panel' option to select it.<br /> :* Select the LED on the System panel and drag it to a suitable position.<br /> :* Look at the Panel Properties, the 'Connection' property make sure that it is connected to Port A, bit 0 ($PORTA.0).<br /> :: Leave it like this.<br /> <br /> ==Add the ADC dial==<br /> The ADC dial represents a number of input devices.<br /> * Locate the 'ADC dial' in the 'Inputs' toolbox in the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> :* Hover over the image to the left of the label, and click on the down-arrow that appears.<br /> :* Click on the 'Add to system panel' option to select it.<br /> :* Select the ADC dial on the System panel and drag it to a suitable position.<br /> :* Look at the Panel Properties, and locate the 'Connection' property. Just below it, the 'Channel' property shows that, by default, it is connected to 'AN0' - the first bit of the microcontroller capable of accepting an analogue input. Click on 'AN0' to open a pinout of the microcontroller.<br /> ::* Click on the rectangle representing input 'AN1' to change the connection to this channel.<br /> :: Leave it like this.<br /> <br /> <br /> The System Panel should resemble the image shown at the top of the page.<br /> <br /> ==Final testing==<br /> * Save the flowchart as 'Analogue,fcf'.<br /> * Click on the simulation button [[File:Btn Run.png|border]].<br /> * Use the mouse to turn the pointer on the ADC dial, and notice what happens when you pass the half-way mark.<br /> * Click on the 'Stop simulation' button, [[File:Btn Stop.png|border]] when you are happy with the program's behavior.<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Using Analogue Input Devices.fcfx|Exercise - Using Analogue Input Devices}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Using_Component_Macros&diff=14338 2014-01-16T15:59:51Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: What Is a Macro?&lt;/sidebar&gt;<br /> Component macros are sections of code that have been written to support the components included with Flowcode 6.&lt;br /&gt;<br /> They take all the effort out of using these components.<br /> <br /> <br /> This exercise uses them to control a particularly complicated, but very common device, the Liquid Crystal Display (LCD).&lt;br /&gt;<br /> In this case, it uses a LCD to display elapsed time in a timer.<br /> <br /> The first section looks at using [[Component Macro Icon Properties|Component Macros]] to create the core timing sequence. The second section looks at using it to turn on a lamp for ten seconds once a switch is pressed.<br /> <br /> <br /> __TOC__<br /> <br /> ==The core timing sequence==<br /> At the core of the program is a section that sets up the LCD to display the time.&lt;br /&gt;<br /> The flowchart sequence for displaying the elapsed time will be:<br /> ::::* Initialize the LCD using the 'Start' macro.<br /> ::::* Set the cursor position in the LCD, using the 'Cursor' macro.<br /> ::::* Display the text &quot;Elapsed time&quot;, using the 'PrintString' macro.<br /> ::::* Set the time to zero.<br /> ::::* Change the cursor position, using the 'Cursor' macro.<br /> ::::* Display the time.<br /> ::::* Wait for one second.<br /> ::::* Increment the time.<br /> ::::* Display the new time.<br /> ::::* Loop back and repeat the process from the one second delay.<br /> <br /> <br /> ===Set up the flowchart===<br /> * Open Flowcode, and set up the new flowchart as described in [[Exercise - Creating a Flowchart|Creating a Flowchart]].<br /> <br /> <br /> ===Create the core sequence===<br /> ===Add the LCD===<br /> * Locate the 'LCD' inside the 'Outputs' toolbox in the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> :* Hover over the image to the left of the 'LCD' label, and click on the down-arrow that appears.<br /> :* Click on the 'Add to system panel' option to select it.<br /> :* Zoom in until the LCD image is big enough to read. (See [[Exercise - Controlling the Camera]] for information on how to zoom in on the [[System Panel]].)<br /> <br /> <br /> ===Initialise the LCD===<br /> * Click and drag an infinite loop between the 'BEGIN' and 'END' icons.<br /> * Inside the loop:<br /> :* Click and drag a 'Component macro' icon.[[File:Btn_Component_Macro.gif|border]]<br /> ::* Double click on it to open the dialogue box, so that you can configure it.<br /> ::: The program 'knows' which components you have added to the System or Dashboard panel, and modifies the list of available commands accordingly.<br /> ::: Under 'Components', the LCD will be listed, and underneath it the list of commands.<br /> ::* Scroll down to the bottom of the list and click on the 'Start' command.<br /> ::* Rename the 'Display name' as &quot;Start the LCD&quot;.<br /> ::* Click on 'OK'.<br /> ::* The dialogue box is shown below.<br /> <br /> <br /> ===Set up the display===<br /> The first task is to define where the text will be displayed.&lt;br /&gt;<br /> This involves another LCD 'Component Macro' called 'Cursor'.<br /> This defines the LCD 'cell' where the text display starts. The LCD has a grid of 32 cells, arranged in 2 rows of 16.&lt;br /&gt;<br /> The upper row is given the value y=0, and the lower y=1. The sixteen horizontal cells are given values from x=0 to x=15.<br /> :* Click and drag a second 'Component macro' icon just below the first.<br /> ::* Double click on it to open the dialogue box.<br /> ::* Scroll down to the 'Cursor' command.<br /> ::* Rename the 'Display name' as &quot;Move the cursor&quot;.<br /> ::* In the 'Parameters' section, set the value of 'x' to 2, and 'y' to 0.<br /> ::* Click on 'OK'.<br /> <br /> The next 'Component Macro' specifies the text to be printed, starting at this location.<br /> :* Click and drag a third 'Component macro' icon just below the first.<br /> ::* Double click on it to open the dialogue box.<br /> ::* Scroll down to the 'PrintString' command and click on it.<br /> ::* Rename the 'Display name' as &quot;Elapsed time&quot;.<br /> ::* In the 'Expression' box, type &quot;Elapsed time&quot; (making sure you include the quotation marks &quot;&quot;.)<br /> ::* Click on 'OK'.<br /> ::* The dialogue box is shown below.<br /> <br /> <br /> [[File:Exercise_Using_Component_Macros_Variable_Properties.png|250px|right]]<br /> ===Display elapsed time===<br /> :* In the 'Edit' menu, on the main toolbar, click on 'Variables...' to open the [[Variable Manager]] dialogue box.<br /> ::* Hover just to the left of the 'Variables' label, and click on the down arrow that appears.<br /> ::* Select 'Add new' and the 'Create a New Variable' dialogue box opens.<br /> ::* Name the new variable &quot;time&quot;, and give it an initial value of zero.<br /> ::* Leave the variable type as 'Byte'.<br /> ::* Click on 'OK'.<br /> ::* The dialogue box is shown below.<br /> <br /> : The next Component Macro repositions the cursor, so that the elapsed time is shown below the &quot;Elapsed time&quot; label.&lt;br /&gt;<br /> : The y value is changed to y=1, and the x value to x=8.<br /> :* Click and drag a fourth 'Component Macro' to follow the third one.<br /> ::* Double click on it to open the dialogue box.<br /> ::* Scroll down to the 'Cursor' command.<br /> ::* Rename the 'Display name' as &quot;Move the cursor&quot;.<br /> ::* In the 'Parameters' section, set the value of 'x' to 8, and 'y' to 1.<br /> ::* Click on 'OK'.<br /> <br /> :* Click and drag a fifth 'Component macro' icon just below the fourth.<br /> ::* Double click on it to open the dialogue box.<br /> ::* Scroll down to the 'PrintNumber' command and click on it.<br /> ::* Rename the 'Display name' as &quot;Display elapsed time&quot;.<br /> ::* In the 'Expression' box, type the variable name &quot;time&quot;.<br /> ::* Click on 'OK'.<br /> ::* The fifth 'Component Macro' dialogue box is shown below.<br /> &lt;gallery widths=200px heights=200px perrow=5 caption=&quot;Component Macro Properties&quot;&gt;<br /> File:Exercise_Using_Component_Macros_Icon_Properties_01.png<br /> File:Exercise_Using_Component_Macros_Icon_Properties_04.png<br /> File:Exercise_Using_Component_Macros_Icon_Properties_02.png<br /> File:Exercise_Using_Component_Macros_Icon_Properties_05.png<br /> File:Exercise_Using_Component_Macros_Icon_Properties_03.png<br /> &lt;/gallery&gt;<br /> <br /> ===Finishing touches===<br /> :* Click and drag a 'Delay' icon to follow the fifth 'Component Macro'.<br /> ::* Double click on it to open the dialogue box.<br /> ::* Rename it &quot;Wait one second.&quot;<br /> ::* Configure it to give a delay of one second.<br /> ::: For help with 'Delay' icons, see [[Icon Properties]]<br /> ::* Click on 'OK'.<br /> <br /> <br /> :* Click and drag a 'Calculation' icon to follow the 'Delay'.<br /> ::* Double click on it to open the dialogue box.<br /> ::* Rename it &quot;Add one second.&quot;<br /> ::* In the 'Calculations:' section, type &quot;time=time+1&quot;.<br /> ::: The effect of this is to increase the number stored in the 'time' variable by one, (also called incrementing the 'time' variable.)<br /> ::: For help with 'Calculation' icons, see [[Icon Properties]]<br /> ::* Click on 'OK'.<br /> <br /> <br /> ===Test the Core===<br /> : The diagram below shows the flowchart at this stage.<br /> [[File:Exercise_Using_Component_Macros_Flowchart_01.png|350px|center]]<br /> : At this point, the flowchart should be saved as 'Timer', and can be simulated to test it.<br /> <br /> <br /> ==Extend the program==<br /> The full program is designed to:<br /> :::: wait until a switch is pressed momentarily;<br /> :::: light a lamp ;<br /> :::: time a ten second period;<br /> :::: then switch it off.<br /> <br /> To do this, the sequence is now modified, as follows:<br /> :* Is the switch pressed?<br /> ::* If not, branch back and test the switch again.<br /> ::* If it has:<br /> :::* light the lamp;<br /> :::* run through the timing core ten times,<br /> :::* switch off the lamp.<br /> <br /> <br /> ===Add the switch===<br /> * Locate the 'Push Round Panel' switch in the 'Inputs' toolbox in the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> :* Hover over the image to the left of the switch label, and click on the down-arrow that appears.<br /> :* Click on the 'Add to system panel' option to select it.<br /> :* Click on the image of the switch on the System panel to select it and drag it to a suitable position.<br /> :* On the Panel Properties, click on the 'Unconnected' label, next to 'Connection'.<br /> :: A pinout of the microcontroller appears.<br /> :* Click on the rectangle that represents the pin RA1/AN1, to connect the switch to Port A, bit 1 of the microcontroller.<br /> <br /> <br /> ===Add the LED===<br /> * Locate and LED such as the 'Single LED' or 'LED 5mm Panel' in the 'Outputs' toolbox in the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> :* Hover over the image to the left of the component label (e.g. 'Single LED' and 'LED 5mm Panel), and click on the down-arrow that appears.<br /> :* Click on the 'Add to system panel' option to select it.<br /> :* Select the LED on the System panel and drag it to a suitable position.<br /> :* Look at the Panel Properties, the 'Connection' property shows that, by default, it is connected to Port A, bit 0.<br /> :: Leave it like this.<br /> <br /> <br /> ===Modify the flowchart===<br /> * Immediately after the 'Begin' icon, drag and drop a 'Connection Point (Declare Connection Point)' icon.[[File:Btn Connection Point.gif|border]]<br /> * Next, add an 'Input' icon, and double click on it to open the dialogue box.<br /> * Change the 'Display name:' to &quot;Read the switch&quot;.<br /> * Create a new variable, called 'switch'. One way to do this is to click on the down arrow at the end of the 'Variable:' box.<br /> :* Then click on the down arrow next to the 'Variables' label, and select 'Add new'.<br /> :* The 'Create a New Variable' dialogue box opens. Type in &quot;switch&quot; as the name of the new variable. Leave the variable type as 'Byte'.<br /> :* Click on 'OK'.<br /> * In the 'Variable' box, type the name of the new variable &quot;switch&quot;.<br /> * In the 'Port:' box, select 'PORT A'. Configure the rest of the dialogue box to 'Input from:' 'Single Bit:' 1.<br /> :* Click on 'OK'.<br /> * Next, drag and drop a 'Decision' box, and double click on it to open the dialogue box.<br /> :* Rename it &quot;Switch pressed?&quot;.<br /> :* In the condition 'If' box, type &quot;switch=1&quot;<br /> :* Click on 'OK'.<br /> * In the 'No' branch, drag and drop a 'Connection Point (Jump to Connection Point)' icon.[[File:Btn Goto Connection Point.gif|border]]<br /> * In the 'Yes' branch, drag and drop an 'Output' icon.<br /> :* Double click on it to open the dialogue box.<br /> :* Change the 'Display name:' to &quot;Switch on the lamp&quot;.<br /> :* In the 'Variable or value:' box, type &quot;1&quot;.<br /> :* Configure the rest of the box to output this to 'PORT A' 'Single Bit:' 0.<br /> :* Click on 'OK'.<br /> * Click and drag the 'Loop' icon to follow this in the 'Yes' branch.<br /> :* Double click on the 'Loop' icon to configure it.<br /> :* Leave the 'Display name:' as 'Loop', and the 'Loop while:' box checked.<br /> :* In the other box, type the condition &quot;time&lt;10&quot;.<br /> :* Click on 'OK'.<br /> * After the end of the loop, drag and drop a second 'Output' icon.<br /> :* Double click on it, rename it &quot;Switch off the lamp&quot; and configure it to output value 0 to Port A, bit 0.<br /> :* Click on 'OK'.<br /> <br /> <br /> The dialogue boxes for all these additions are shown below.<br /> &lt;gallery widths=200px heights=200px perrow=5 caption=&quot;Added Component Macro Properties&quot;&gt;<br /> File:Exercise_Using_Component_Macros_Input_Properties_01.png<br /> File:Exercise_Using_Component_Macros_Decision_Properties_01.png<br /> File:Exercise_Using_Component_Macros_Output_Properties_01.png<br /> File:Exercise_Using_Component_Macros_Loop_Properties_01.png<br /> File:Exercise_Using_Component_Macros_Output_Properties_02.png<br /> &lt;/gallery&gt;<br /> <br /> <br /> The final flowchart resembles the one below.<br /> [[File:Exercise_Using_Component_Macros_Flowchart_02.png|350px|center]]<br /> <br /> <br /> ==Final testing==<br /> * [[Saving a Flowchart|Save the flowchart]].<br /> * [[Starting Flowchart Simulation|Run the simulation]] to test that it works.<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Using Component Macros.fcfx|Exercise - Using Component Macros}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_System_Panel_-_Adding_Objects&diff=14335 2014-01-16T15:59:50Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: Panel Exercises&lt;/sidebar&gt;<br /> This exercise starts the process of building the display panel for a car. It sets up the System Panel, with a warning LED.&lt;br /&gt; '''Although specific settings are given, you should play around with alternatives to see the effect.'''<br /> <br /> <br /> __TOC__<br /> <br /> ==New flowchart==<br /> * [[Creating Flowcharts|Start a new Flowcode flowchart]], using the default microcontroller.<br /> <br /> * Make sure that the [[System Panel]] is visible. If necessary, click on [[View]] and then select 'System Panel' a check-box will appear next to the option when enabled.<br /> <br /> <br /> ==General options==<br /> * Click on the 'General options' tab [[File:Gen Panel General Options 01.png|border]]<br /> : Make the following changes:<br /> ::* Move the 'Level of detail' slider fully to the right (to '10').<br /> ::* Select 'Table top' shadow mode.<br /> ::* Choose a 'Background' style of 'Solid color' and set the background color to dark blue, (Red=0, Green=0, Blue=128 on the 'Custom' tab.)<br /> ::* Set the 'Table top' size to '20'.<br /> ::* Choose a 'Table top' style of 'Solid color' and set its color to light blue, (Red=0, Green=70, Blue=255 on the 'Custom' tab.)<br /> <br /> <br /> <br /> ==Grid and snap options==<br /> * Click on the 'Grid and Snap options' tab [[File:Gen Panel Tools 01.png|border]]<br /> : Make the following changes:<br /> ::* Set it to snap to the 'Table top', by clicking on the check-box next to the 'Table top' label.<br /> ::* Leave the 'Show' gridlines box unchecked.<br /> <br /> <br /> ==Add the LED==<br /> [[File:Gen_Inputs_Components_Toolbar_01.png|right]]<br /> * Click on the 'Outputs' toolbox and locate an LED such as the 'LED 5mm Panel' component.<br /> <br /> * Click on the down-arrow next to the component label and then on 'Add to system panel'.<br /> <br /> <br /> * Right click anywhere on the System Panel and select the 'Zoom to 100%' option.<br /> : The System Panel should now resemble the one shown below.<br /> [[File:Gen_System_Panel_LED_5mm_01.png|center|333x311px]]<br /> <br /> <br /> <br /> <br /> <br /> <br /> ==Change the LED properties==<br /> * Click on the LED to select it. <br /> : In the Panel Properties, two properties appear for the LED - 'color' and 'pin'.<br /> <br /> * The 'color' property is set as red (0x0000FF). Click on this value, and change it to orange (0x0080FF).<br /> : You may see very little change in the appearance of the LED, as currently it is turned off.<br /> <br /> * The 'pin' property determines which pin of the microcontroller the LED is connected to.<br /> : Currently, this is $PORTA,0 (pin 0 of PORTA). Click on the label. A pinout of the microcontroller appears. <br /> : Click on bit 1 (RA1/AN1) to change this connection.<br /> <br /> * The Panel Properties also gives information about the size and position of the LED. <br /> : By default, size is shown in terms of 'Scale'. <br /> : Hover the cursor over the folder icon next to the 'Scale' label, and then click on the down-arrow that appears.<br /> : Select 'World size'.<br /> <br /> * Click on the 'Width' setting, (which may be shortened to 'Wi...'). Change it to 10mm.<br /> <br /> * In similar fashion, change the 'Height' ('He...') to 10mm and the 'Depth' ('De...') to 5mm.<br /> <br /> <br /> ==Zoom in==<br /> * As a result, the LED now looks very small on the System Panel.<br /> : You can zoom in to make it look larger. To do this:<br /> : Hold down the control 'Ctrl' key on the keyboard. The 'zoom' icon appears. [[File:Gen Panel Camera Zoom 01.png]]<br /> : Move the cursor over this icon. Now when you move the cursor up the screen, the view zooms in, and when you move it down, it zooms out.<br /> : Adjust the zoom so that the 'Table top' fills most of the [[System Panel]], making the LED more visible.<br /> <br /> ==Switch on==<br /> * Click and drag an 'Output' icon to your flowchart.<br /> : Double-click on it and change the 'Variable or value' setting from '0' to '255'.<br /> : This sends a logic 1 signal to all pins of PORT A.<br /> : The flowchart resembles the one below:<br /> [[File:gen_exerciseSystemPaneladdobjects_outputprops_01.png|500px|center]]<br /> <br /> [[File:gen_exerciseSystemPaneladdobjects_runicon_01.png|200px|right]]<br /> * Run the simulation, by clicking on the 'Run' icon shown opposite. <br /> <br /> : The LED will 'turn on'.<br /> <br /> * Double-click on the 'Output' icon again, and change the value to '0'.<br /> : Now when you simulate the flowchart, the LED will turn off.<br /> <br /> * Save the flowchart as &quot;System_Panel_Add_LED&quot;<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - System Panel - Adding Objects.fcfx|Exercise - System Panel - Adding Objects}}<br /> <br /> <br /> ==What next==<br /> The next stage is to mount the LED on the instrument panel. This is covered in the exercise [[Exercise - System Panel - Controlling Shapes|controlling shapes]]<br /> <br /> <br /> ==Video instructions==<br /> <br /> See the [http://www.youtube.com/watch?v=2yT5XTLLX6o&amp;list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Adding Objects to the Panel] video for a demonstration and explanation about adding components and objects to the System Panel.<br /> <br /> &lt;div align=&quot;center&quot;&gt;<br /> {{#ev:youtube|2yT5XTLLX6o|640}}<br /> &lt;/div&gt;</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_System_Panel_-_Controlling_Collisions&diff=14336 2014-01-16T15:59:50Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: Panel Exercises&lt;/sidebar&gt;<br /> This exercise looks at ways in which two objects interact on the [[System Panel]].&lt;br /&gt;<br /> It does not design a flowchart, but looks at configuring the collision control icon found on the System Panel.&lt;br /&gt;<br /> The images below are intended to illustrate the differences between the collision settings, but screen shots are limited in what they can convey when motion is involved. &lt;br /&gt;This is really a hands-on exercise - you have to see and feel the difference!<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==Set up the Flowcode flowchart==<br /> <br /> * [[Creating Flowcharts|Create a new flowchart]], accepting the default microprocessor.<br /> * Make sure that the System Panel is visible, using the [[View]] menu if necessary.<br /> * Click on the 'General options' icon to configure the System Panel. [[File:Gen Panel General Options 01.png|border]]<br /> :* Select suitably contrasting colors for the 'Table top', (e.g. light blue - red=160, green=192, blue=255,) and 'Background', (e.g. mid-blue - red=0, green=0, blue=192.)<br /> :* Select three views in the 'Number of views:' options.<br /> :* Click on the red, green and blue arrowheads in turn, to produce the views shown below.<br /> * Click on the 'Grid and Snap options' tab [[File:Gen Panel Tools 01.png|border]]<br /> :* Uncheck all 'Snap to' options.<br /> <br /> <br /> ==Start position==<br /> * Drag and drop a cube onto the System Panel.<br /> :* Give it 'Coordinates' X=0, Y=0, Z=16 to make it sit on the 'Table top'.<br /> :* Leave it as the default color it - red (red=192, green=0, blue=0).<br /> * Drag and drop a sphere onto the System Panel.<br /> :* Give it 'Coordinates' X=-60, Y=60, Z=16 to make it sit on the 'Table top' at the top left corner.<br /> :* Color it green (e.g. red=0, green=192, blue=0).<br /> * Look at all three views. Make sure that you understand what each shows.<br /> <br /> <br /> [[File:gen_exercisecollisioncontrol_start.png|800px|center]]<br /> <br /> <br /> ==Collision type - Move through==<br /> [[File:gen_exercisecollisioncontrol_icon_01.png|100px|left]]<br /> * Click on the 'Collision Control' icon, and select 'Move through'.<br /> * Move the sphere towards the cube, and make the two overlap.<br /> : The two objects coalesce when they meet.<br /> <br /> <br /> [[File:gen_exercisecollisioncontrol_through_01.png|800px|center]]<br /> * Move the sphere back to its start position.<br /> : The objects re-emerge as separate items.&lt;br /&gt;<br /> : This setup would be useful when an object is allowed to enter a marked zone.<br /> <br /> <br /> ==Collision type - Move over==<br /> * Click on the 'Collision Control' icon, and select 'Move over'.<br /> * Once again, move the sphere towards the cube so that they collide.<br /> : Notice the difference - this time the sphere jumps over the cube.<br /> : This is where the three views are really useful.<br /> : Look at each, and make sure that you understand exactly what is happening.<br /> [[File:gen_exercisecollisioncontrol_over_01.png|800px|center]]<br /> * Move the sphere back to its start position.<br /> <br /> ==Collision type - Move around==<br /> * Click on the 'Collision Control' icon, and select 'Move around'.<br /> * Again, move the sphere towards the cube so that they collide.<br /> : Notice the difference!<br /> : Again, use the three views to see exactly what is happening.<br /> <br /> [[File:gen_exercisecollisioncontrol_around_01.png|800px|center]]<br /> <br /> In the last two cases, the objects retained their separate identities during the collision, but had different degrees of freedom.<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - System Panel - Controlling Collisions.fcfx|Exercise - System Panel - Controlling Collisions}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Inserting_Code_Into_Flowcode&diff=14334 2014-01-16T15:59:48Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: What Is an Interrupt?&lt;/sidebar&gt;<br /> C code is a high-level programming language widely used in industry.&lt;br /&gt;<br /> It has spawned a number of other programming languages, such as C#, C++, Java and Python. <br /> <br /> Flowcode programs are first compiled into C before being crunched down eventually into hex code. <br /> <br /> There are two mechanisms for adding your own C code to a Flowcode flowchart:<br /> [[File:Exercise_InsCode_C_suppcode.jpg|right|350px]]<br /> * using the 'C Code' icon [[File:Btn C Code.gif|border]] ;<br /> * using the 'Use supplementary code' facility within 'Project Options', shown opposite:<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==Why would you want to?==<br /> <br /> * Flowcode programs are compiled to 'C', but produce many lines of code. <br /> : They do so because they must be able to cope with any function or structure that the designer wishes to use. <br /> : Experienced C programmers may wish to use code more efficiently, and so insert a few lines of code to replace many lines which Flowcode would generate. (This usually applies to the 'Adding supplementary code' option.)<br /> <br /> * Experienced programmers can insert a short section of C code in order to reduce the length, or complexity, of the Flowcode program.<br /> <br /> * Students learning to program in C can test short sections of code by inserting them into a Flowcode program. This avoids having to write the full program in C.<br /> <br /> <br /> ==Adding supplementary code==<br /> <br /> This feature is used when you have blocks of code containing routines, definitions, lookup tables, etc. <br /> [[File:Gen_Supplementary_Code_01.png|right|frameless]]<br /> <br /> <br /> '''Definitions and function declarations:'''<br /> <br /> This is the first section. It allows users to initialise the program, by adding structures such as 'defines', 'includes', and other function declarations. This section must be placed at the beginning of the C file so that the code is 'visible' to all parts of the program.<br /> <br /> <br /> '''Function implementations:'''<br /> <br /> This second section allows for the addition of the main function code.<br /> <br /> <br /> Structured thus, the code is accessible to any Flowcode macro, and vice-versa.<br /> <br /> <br /> ==Warning==<br /> <br /> Be sure that the added C code is correct! &lt;br /&gt;<br /> <br /> Flowcode does not simulate C Code, so programs that make use of supplementary code may not simulate correctly. <br /> Where Flowcode fails to compile, it may be that the supplementary code contains errors.<br /> <br /> <br /> <br /> ==Using the 'Code' icon==<br /> [[File:Exercise_InsCode_C_Flowchart.png|right|294x261px]]<br /> <br /> * [[Opening Flowcode|Open Flowcode]].<br /> <br /> * On the Startup screen, click on 'New project' to [[Creating Flowcharts|create a new flowchart]].<br /> <br /> <br /> * Add the icons shown in the flowchart:<br /> ::* a loop icon, configured as an infinite loop;<br /> ::* a calculation icon:<br /> :::* use it to create two byte variables, 'var1' and 'add',<br /> :::* set them to the following values:<br /> ::::: var1 = 2, add = 3;<br /> ::* a Code icon [[File:Btn C Code.gif|border]]- details given below;<br /> ::* a delay icon configured to give a two second delay.<br /> <br /> <br /> ==The C Code==<br /> <br /> Configure the Code icon by typing in the following code, exactly as written here:<br /> <br /> &lt;pre class=&quot;brush:[cpp]&quot; style=&quot;float:left;&quot;&gt;<br /> trisb = 0; //Set all of Port B to output <br /> portb = FCV_VAR1; //Output the value of var1 to port B<br /> trisa = 1; //Convert port A bit 0 to input<br /> if (test_bit(porta,0)) //Check to see if A0 is highelse&lt;/pre&gt;<br /> <br /> The 'Code' icon properties box resembles that shown opposite.<br /> <br /> [[File:Exercise_InsCode_C_Code_Properties.png|center]]<br /> <br /> The software recognizes instructions and comments, and colour-codes them accordingly.<br /> <br /> <br /> '''Some notes on this code:'''<br /> <br /> * The ports on the PIC chip are bi-directional - they can act as either input or output.<br /> * Their behaviour is controlled by the contents of two more registers - TRISA (for Port A) and TRISB (for Port B.)<br /> :* A value of '0' in the control register makes the corresponding bit of the port into an output bit.<br /> :* A value of '1' in the control register makes the corresponding bit of the port into an input bit.<br /> * Commands are finished by adding a semicolon (;).<br /> * The characters '//' are used to indicate comments - there to aid understanding of the program. These are ignored by the compiler.<br /> * Where variables are defined in the Flowcode program, the prefix 'FCV_' must be added to the name of the variable, which is written in upper case lettering.<br /> * The 'if-else' construction examines a possible condition - &quot;Is Port A bit 0 high?&quot;<br /> :* If true, the values of the two variables are added together and sent to Port B.<br /> :* If false, only the value of 'var1' is sent to Port B.<br /> <br /> <br /> * All of this could have been done using 'pure' Flowcode, but it would have required around five more icons in the flowchart.<br /> <br /> <br /> ==Testing==<br /> <br /> As pointed out earlier, Flowcode will not simulate added C code, and so there is no value in simulating this program.&lt;br /&gt;<br /> Instead, compile it to the PIC chip which you specified as the target.<br /> <br /> <br /> Add the following E-Blocks units to the EB-008 Multiprogrammer holding the PIC chip:<br /> :: a switch unit to Port A,<br /> :: a LED unit to Port B.<br /> Press the reset switch on the Multiprogrammer.<br /> <br /> <br /> Test the program by noticing the output displayed on the LEDs when switch 0 on the switch unit is pressed.<br /> * When pressed, LEDs D2 and D0 should light, indicating an output 0101 (i.e. the number 5,)<br /> * When not pressed, LED D1 should light, indicating an output 0010, (i.e. the number 2.)<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Inserting Code Into Flowcode.fcfx|Exercise - Inserting Code Into Flowcode}}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Creating_a_Flowchart&diff=14331 2014-01-16T15:59:06Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: What Is a Flowcode Flowchart?&lt;/sidebar&gt;<br /> The task is to produce a Flowcode flowchart which will set the base of a program that will (when configured and programmed correctly) light a lamp for ten seconds when a switch is pressed. Note that we will not be configuring the flowchart icons to function in this exercise, we are just setting up the base to be expanded upon.<br /> &lt;br /&gt;&lt;br /&gt;<br /> Although it may not be realistic to use a microcontroller in such a straight-forward application, it illustrates the technique of producing a Flowcode program.&lt;br /&gt;<br /> The program itself may form part of a bigger program.<br /> <br /> <br /> __TOC__<br /> <br /> ==Formulate the sequence==<br /> The flowchart sequence will be:<br /> : Check if the switch is pressed.<br /> :: If it isn't, go back to the beginning.<br /> :: If it is:<br /> ::: Switch on the lamp;<br /> ::: Wait for 10 seconds;<br /> ::: Switch off the lamp;<br /> ::: Go back to the beginning.<br /> <br /> It takes such a short time for the microcontroller to carry this out, that we don't need to worry whether the switch latches on or not.<br /> <br /> <br /> ==Set up the flowchart==<br /> [[File:Gen_Startup_Selection.png||250px|right]]<br /> * [[Opening Flowcode|Open Flowcode]].<br /> * On the Startup screen, click on 'New project'.<br /> <br /> <br /> [[File:Gen_Project_Options_Target_SIM.png|right|250px]]<br /> : The [[Project Options]] dialogue box opens. <br /> : (Click on the link for a full explanation of all the options available.)<br /> <br /> <br /> * Accept the default settings by clicking on 'OK'.<br /> : An empty flowchart window opens, which may contain other items such as a [[System Panel]], [[Dashboard Panel]], [[Properties Panel]] etc.<br /> : These can be revealed or hidden using the [[View]] menu.<br /> <br /> <br /> * Set up the flowchart window so that you can see the System Panel and the Properties Panel.<br /> : The flowchart window should resemble the one shown below (depending on the configuration.)<br /> <br /> [[File:Exercise_Creating_a_Flowchart_Flowcode_Layout.png|500px|center]]<br /> <br /> <br /> : The System Panel and Properties Panel can be moved by clicking and dragging the title bar at the top of each panel.<br /> <br /> <br /> ==Prepare the input==<br /> : More information about the icons used in this flowchart can be found in [[Icon Properties]].<br /> * Drag and drop a [[Loop Icon Properties|Loop icon]] between the BEGIN and END icons.<br /> : The 'Loop' icon will make the microcontroller repeatedly run through the program, (though the icon can be configured to limit the number of times this happens.)<br /> <br /> * Inside the loop, drag and drop an [[Input Icon Properties|Input icon]] from the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].<br /> :* This will be configured later and contain a variable value which will be used to read the state of the switch - to detect if the switch is being pressed..<br /> <br /> <br /> ==Prepare the switch==<br /> * Drag and drop a [[Decision Icon Properties|Decision icon]] after the 'Input' icon.<br /> : This icon will be used to make the program perform what is known as a conditional branch when the following icons are configured.<br /> <br /> [[File:Exercise_Creating_a_Flowchart_Icons_Layout.png|right]]<br /> <br /> : When the icons are configured and programmed, these icons will be able to continually check if the switch is being pressed or not.<br /> : In the next step we will be adding icons which will allow us to control what happens if the switch is pressed. Note that the program will not function until the icons are configured and programmed.<br /> <br /> : Once programmed - when the switch is pressed it will perform an the action or process and continue to check if it is being pressed again.<br /> : If the switch is not pressed it will follow the 'No' branch and keep looping to continue to check if the switch has been pressed.<br /> <br /> <br /> ==Set up the lamp==<br /> : Next we concentrate on the 'Yes' branch of the 'Decision' icon.<br /> * Drag and drop an [[Output Icon Properties|Output icon]] in the 'Yes' branch.<br /> : When programmed, this icon is going to function as a trigger to turn the lamp on.<br /> <br /> <br /> : Next we want the lamp to stay on for ten seconds and then turn off.<br /> * Drag and drop a [[Delay Icon Properties|Delay icon]] after the 'Output' icon.<br /> :* This is the icon which will allow us to delay the circuit for a specified period of time.<br /> :* The delay will last for 10 seconds, in this time the circuit will not be able to carry out any other function until the delay is complete.<br /> <br /> <br /> :* Drag and drop a second 'Output' icon after the 'Delay' icon.<br /> : Finally this will be used to turn the lamp off after the ten second delay.<br /> <br /> Your flowchart should now be set up to resemble the image to the right. Note that none of the icons are configured yet, so the program will not simulate or function, please see the next exercise to configure the icons so that the program will simulate accordingly.<br /> <br /> <br /> You should now [[Saving a Flowchart|save the flowchart]] as &quot;Lamp1.fcf&quot;, and [[Closing Flowcode|close Flowcode]].<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Creating a Flowchart.fcfx|Exercise - Creating a Flowchart}}<br /> <br /> <br /> ==What next?==<br /> The flowchart is now ready to be configured and programmed in order to operate electronic devices (components). The configuration of the flowchart is covered in the exercise [[Exercise - Configuring Icons and Variables|Configuring Icons and Variables]].</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Documenting_a_Flowchart&diff=14332 2014-01-16T15:59:06Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: Adding Finishing Touches&lt;/sidebar&gt;<br /> This exercise assumes that you have created and tested the program described in exercise [[Exercise - Transferring a Program to the Microcontroller|Transferring a Program to the Microcontroller]].<br /> <br /> Documenting the flowchart is essential in some projects, although we have properly labelled the icons, a few comment icons helps to further explain the program and the process in further detail to aid expansion and helps others understand the system.<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==Load the Flowcode flowchart==<br /> * [[Opening an Existing Flowchart|Open the flowchart]] called 'Lamp1.fcf' which you tested further in the exercise [[Exercise - Transferring a Program to the Microcontroller|Transferring a Program to the Microcontroller]].<br /> <br /> <br /> ==Benefits of documentation==<br /> <br /> Documenting your flowchart is very useful - it allows other users to understand your flowchart and allows them to learn and even add to your flowchart to help produce the final program and increase efficiency throughout the system.<br /> <br /> Adding comments to document your flowchart is extremely easy and very useful, using comments allows you to clarify the process, purpose and function of your program and allows others to understand it so they can see what is going on and learn from it and even help to develop the program, even by suggestion a more efficient method or directly editing a icon to function more effectively.<br /> <br /> <br /> ==Adding comments==<br /> [[File:Exercise_Documenting_a_Flowchart_Final_Flowchart.png|right]]<br /> * Drag a [[Comment Icon Properties|Comment icon]] onto the flowchart above the 'Loop' icon.<br /> * Double click the 'Comment' icon to open up the [[Comment Icon Properties]] dialogue box.<br /> <br /> :* Explain the purpose of the loop and how it is the base of the process.<br /> <br /> :: The loop is the base of the program as it allows the program to continually check if the switch has been pressed by repeating the process of detecting the state of the switch.<br /> <br /> <br /> * Add a comment above the 'Input' icon.<br /> <br /> * Open the icon properties by double clicking on the 'Comment' icon.<br /> <br /> :* Describe the use of the 'Input' icon and how it reads the state of the switch.<br /> <br /> :: The 'Input' icon uses a variable to read and store the state of the switch, this allows the information contained in the variable to be used to see if the switch is being pressed or not.<br /> <br /> <br /> * Comment and document the 'Decision' icon.<br /> <br /> :* Describe how the 'Decision' icon detects the state of the switch and decides the next step to take.<br /> <br /> :: The 'Decision' icon will read the information in the variable to see if the switch has been pressed, it then decides which process path to follow next, if it is not being pressed it will go straight through to the loop and continually check if the switch is being pressed or not. If the switch is being pressed the following icons activate the LED and turns it off after 10 seconds.<br /> <br /> <br /> * Comment and document the 'Output' icon.<br /> <br /> :* Describe the function of the 'Output' icon.<br /> <br /> :: Once the 'Decision' icon detects that the switch is being pressed, the 'Output' icon turns on / lights up the LED and indicates that the switch has been pressed.<br /> <br /> <br /> * Comment and document the 'Delay' icon.<br /> <br /> :* Describe the function and purpose of the icon.<br /> <br /> :: This delays the program and stops it from continuing with another process, this allows the LED to stay lit up due to the previous command, this delay lasts 10 seconds until the program is then continued.<br /> <br /> <br /> * Comment and document the second 'Output' icon.<br /> <br /> :* Explain the function of this icon and the process afterwards.<br /> <br /> :: After the 10 second delay, this icon will turn the LED off and then continue the process of the program, which in turn, will loop to check if the button is being pressed again, this is the completes the circuit and will continue to loop and repeat the process, until stopped.<br /> <br /> <br /> ==Save the Flowchart==<br /> * Save the flowchart using the same name. The simplest way to do this is to click on the 'Save' icon. [[File:Btn Save.png|border]]<br /> : For more information, see [[Saving a Flowchart]].<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Documenting a Flowchart.fcfx|Exercise - Documenting a Flowchart}}<br /> <br /> <br /> ==What next?==<br /> Now that the flowchart is complete, and documented correctly, you can further expand and develop the flowchart in the next exercise [[Exercise - Expanding a Program|Expanding a Program]].</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Expanding_a_Program&diff=14333 2014-01-16T15:59:06Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: Taking Flowcode Further&lt;/sidebar&gt;<br /> This exercise assumes you have created, tested and documented the program described in the exercise [[Exercise - Documenting a Flowchart|Documenting a Flowchart]].<br /> <br /> Because you have documented the flowchart properly, you can easily and accurately change the program as you know exactly how the program functions and what process it goes through.<br /> <br /> You do not have to massively alter your program to make it more effective, sometimes a little change can make a big difference, simply adding and configuring one component can change the program to be much more effective and suitable for use elsewhere.<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==Load the Flowcode flowchart==<br /> * [[Opening an Existing Flowchart|Open the flowchart]] called 'Lamp1.fcf' which you created earlier and documented in the exercise [[Exercise - Documenting a Flowchart|Documenting a Flowchart]].<br /> <br /> <br /> <br /> ==Enhancing a program==<br /> Now that you have a fully functioning program which is properly documented both by display names of icons and detailed comments, you can manipulate this program integrate it into another system, or expand the program further and turn it into your own expanded system, and even turn it into a full application.<br /> <br /> <br /> We are going to expand our program to function as a set of traffic lights, to do this we are going to add 2 more LEDs and add to our 'Decision' icon which responds to when the switch is on to activate the traffic lights accordingly.<br /> <br /> <br /> ==Add the LEDs==<br /> [[File:Exercise_Expanding_a_Program_Components.png|right]]<br /> First of all, we are going to set up the System Panel and add two more LED components to expand the program.<br /> * Add two LED components by using either of the following methods:<br /> :* Either copy and paste the current component on the System Panel to duplicate the component.<br /> :* Or add two more components by using the [[Tools and Views#2) Components Toolbar|Components Toolbar]].<br /> <br /> <br /> Now position the LEDs accordingly on the System Panel.<br /> * Move the LEDs to be aligned in a row on the Y axis.<br /> * Ensure the original green LED component is at the bottom and that it is still connected to '$PORTB.0'.<br /> <br /> <br /> Next change the colour and connection properties of the two new LEDs.<br /> * Change the middle LED properties.<br /> :* Connect the LED to Port B Pin 1 by changing the 'Connection' property to '$PORTB.1'.<br /> :* Change the 'Color' property to yellow (00FFFF) using the colour selection window.<br /> <br /> * Change the top LED properties<br /> :* Connect the LED to Port B Pin 2 by changing the 'Connection' property to '$PORTB.2'.<br /> :* Change the 'Color' property to red (000FF) using the colour selection window.<br /> <br /> <br /> ==Expand the program==<br /> Now that the components are set up correctly, its time to configure the flowchart and expand the program.<br /> Firstly we need to set up the default state of the traffic lights to display only the red light when the switch is not pressed.<br /> [[File:Exercise_Expanding_a_Program_Final_Flowchart.png|right]]<br /> * Add an 'Input' icon to the 'No' section of the 'Decision' icon.<br /> :* Change the 'Display name:' to &quot;Red on&quot;.<br /> :* Input the the value &quot;1&quot; into the 'Variable or value:' box.<br /> :* Set the 'Port:' connection to 'PORTB'.<br /> :* In the 'Output to:' section select 'Single Bit:' and change the pin to '2'.<br /> :* Click 'OK' to confirm the changes to the icon.<br /> <br /> <br /> We are now going to set up the activation sequence of the traffic lights by configuring and expanding the 'Yes' section of the 'Decision' icon.<br /> <br /> * Add 4 'Input' icons above the existing icons, then add a 'Delay' icon in-between the 4 'Input' icons.<br /> :* We will configure these icons top to bottom as follows:<br /> <br /> <br /> * Change the 'Display name:' of the first 'Input' icon to &quot;Red on&quot;.<br /> :* This icon is the same as the previous one we set up in the 'No' section of the 'Decision icon'.<br /> :* Send the value '1' to Port B, Pin 2.<br /> <br /> * For the second 'Input' icon change the name to &quot;Yellow on&quot;.<br /> :* Similarly send the value '1' to Port B but this time send it to bit (pin) 1<br /> <br /> * Next is the 'Delay' icon.<br /> :* Change the name to &quot;For 1 second&quot;.<br /> :* Input the value &quot;1&quot; into the 'Delay value or variable:' box.<br /> :* Change the unit to 'seconds'.<br /> <br /> * Switch the first two (red and yellow) lights off to allow the last (green) light to show on its own which we programmed before.<br /> :* Alter the 'Input' icon after the 'Delay' icon.<br /> ::* Change the 'Display name:' to &quot;Red off&quot;.<br /> ::* Send the value &quot;0&quot; to Port B, Pin 1 - this switches off the red light.<br /> :* Configure the next 'Input' icon, the last of the new icons we added.<br /> ::* Name it &quot;Yellow off&quot;.<br /> ::* Send the value &quot;0&quot; to Port B, Pin 2 - this switches off the yellow light.<br /> <br /> Next, the green light displays for 10 seconds before switching off, this is due to the icons we configured and programmed in the earlier exercises.<br /> * Update the display names of the existing icons as follows:<br /> :* Replace the &quot;Switch on&quot; display name with &quot;Green on&quot;.<br /> :* Replace the &quot;Switch off&quot; display name with &quot;Green off&quot;.<br /> <br /> <br /> * Under these icons add an 'Input' icon, followed by a 'Delay' icon and finally add the last 'Input' icon.<br /> :* Configure the first 'Input' icon.<br /> ::* Change the 'Display name:' to &quot;Yellow on&quot;.<br /> ::* In the 'Variable or value:' box type &quot;1&quot;.<br /> ::* Change the 'Port:' to 'PORTB'.<br /> ::* In the 'Output to:' section select 'Single Bit:' and change the value to '1'.<br /> <br /> :* Now configure the 'Delay' icon.<br /> ::* Change the 'Display name:' to &quot;For 2 seconds&quot;.<br /> ::* Type &quot;2&quot; into the 'Delay value or variable:'.<br /> ::* Change the unit to 'seconds'<br /> <br /> :* Finally configure the last 'Input' icon.<br /> ::* Change the 'Display name:' to &quot;Yellow off&quot;.<br /> ::* In the 'Variable or value:' type &quot;0&quot;.<br /> ::* Change the 'Port:' to 'PORTB'<br /> ::* In the 'Output to:' section select 'Single Bit:' and change it to '1'.<br /> <br /> <br /> ==Final testing==<br /> * [[Saving a Flowchart|Save the flowchart]].<br /> * [[Starting Flowchart Simulation|Run the simulation]] to test that it works.<br /> * If you are going to further expand a program, or release it for public use, be sure to [[Exercise - Documenting a Flowchart|document the flowchart]] accordingly to explain the process and describe what affect it has on the components.<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Expanding a Program.fcfx|Exercise - Expanding a Program}}<br /> <br /> <br /> ==What next?==<br /> Now you have effectively developed and expanded a program you can move on to other exercises and learn different areas, methods and techniques.<br /> <br /> <br /> There are further exercises throughout the [[Flowcode Help Overview|Flowcode Help]] section, you can also go to the [[Exercises]] section for similar articles with instructions to follow to demonstrate processes such as creating a component.</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Configuring_Icons_and_Variables&diff=14330 2014-01-16T15:59:05Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: Controlling Electronic Devices With Flowcode&lt;/sidebar&gt;<br /> This exercise assumes that you have already built the Flowcode flowchart described in the exercise [[Exercise - Creating a Flowchart|Creating a Flowchart]].&lt;br /&gt;<br /> To set up and program the flowchart you must configure the icons and variables to create an effective and functioning process.&lt;br /&gt;<br /> This will prepare the program to interact with components connected to the specific ports.<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==Load the Flowcode flowchart==<br /> * Open the flowchart, called 'Lamp1.fcf' which you created in the exercise [[Exercise - Creating a Flowchart|Creating a Flowchart]].<br /> :(For help with this, see the article [[Opening an Existing Flowchart]]) <br /> : The System Panel and Panel Properties should be visible. If not, use the [[View]] menu to select them.<br /> <br /> <br /> ==Program the sequence==<br /> <br /> Now that the flowchart icons are correctly set up, we need to program them to carry out the following process:<br /> :Check if the switch is pressed.<br /> ::If it isn't, go back to the beginning.<br /> ::If it is:<br /> :::Switch on the lamp;<br /> :::Wait for 10 seconds;<br /> :::Switch off the lamp;<br /> :::Go back to the beginning.<br /> <br /> It takes such a short time for the microcontroller to carry this out, that we don't need to worry whether the switch latches on or not.<br /> <br /> <br /> ==Program the input==<br /> :* Double click on the [[Input Icon Properties|Input icon]]. <br /> :: This opens the 'Properties: Input' dialogue box, allowing you to configure the way the program treats information from the switch.<br /> :: This information will be contained in a variable called 'switch'.<br /> <br /> ::* Click on the down arrow at the right-hand end of the 'Variable:' box to open the variables dialogue box.<br /> ::* Hover to the left of the 'Variables' label and click on the down arrow that appears.<br /> ::* Click on the 'Add new' option to open the 'Create a New Variable' dialogue box.<br /> <br /> ::* [[Creating Variables|Create a new variable]] named &quot;switch&quot; with initial value &quot;0&quot; and description &quot;Copies the state of the switch&quot;<br /> ::* Leave the 'Variable type:' as 'Byte'.<br /> ::: (For more information about variables, see [[Creating Variables]] and [[Variable Types]].<br /> ::: (The resulting dialogue box is shown opposite.)<br /> [[File:Exercise_Configuring_Icons_and_Variables_Input_Properties.png|250px|right]]<br /> <br /> <br /> :* Finish configuring the input properties as follows:<br /> ::* Change the 'Display name:' to &quot;Read the switch&quot;.<br /> ::* In the 'Variable:' box, type the name of the variable you created &quot;switch&quot;.<br /> ::* Leave the 'Port:' as PORT A.<br /> ::* Select to 'Input from:' 'Single Bit' and choose bit 0.<br /> ::: (The resulting dialogue box is shown opposite.)<br /> <br /> [[File:Exercise_Configuring_Icons_and_Variables_New_Variable.png|250px|right]]<br /> <br /> : Set up like this, the program monitors the state of the switch, which will be connected to bit 0 of Port A of the microcontroller.<br /> : When the program looks at the input switch if it is pressed, the variable 'switch' contains logic 1. If unpressed, it contains logic 0.<br /> <br /> <br /> ==Check the Switch==<br /> :* Double click on the [[Decision Icon Properties|Decision icon]] to open the configuration dialogue box, and then: [[File:Exercise_Configuring_Icons_and_Variables_Decision_Properties.png|250px|right]]<br /> ::* Rename it &quot;Switch pressed?&quot;.<br /> ::* In the 'If:' box, type &quot;switch=1&quot;.<br /> ::* Leave the 'Swap Yes and No' box unchecked.<br /> ::* Click on 'OK'.<br /> <br /> : This will cause the program to perform what is known as a conditional branch.<br /> : The subsequent course of the program depends on the outcome of the condition specified in the 'Decision' icon.<br /> : In this case, it depends on whether or not the variable 'switch' = 1.<br /> : If it is, the program follows the 'Yes' route. If not, it follows the 'No' route.<br /> <br /> <br /> ==Control the Lamp==<br /> : The 'No' branch is easy to set up. All we want is that the program returns to the beginning (taken care of by the 'Loop' icon.)<br /> : No further configuration is needed.<br /> [[File:Exercise_Configuring_Icons_and_Variables_Output_Properties_01.png|250px|right]]<br /> <br /> :* Double click the [[Output Icon Properties|Output icon]] to open the configuration dialogue box, and then:<br /> ::* Change the 'Display name:' to &quot;Switch on&quot;.<br /> ::* In the 'Variable or value:' box, type value &quot;1&quot;.<br /> ::* Change the 'Port:' to PORT B.<br /> ::* Select to 'Output to: 'Single Bit' and choose bit 0.<br /> ::* Click on 'OK'.<br /> ::: (The resulting dialogue box is shown opposite.)<br /> <br /> : The effect of this icon is to send a logic 1 signal (high voltage) to the lamp, connected to Port B, bit 0 of the microcontroller.<br /> : This turns on the lamp.<br /> <br /> <br /> : Now, we tackle the requirement that it stays on for ten seconds and then goes off.<br /> [[File:Exercise_Configuring_Icons_and_Variables_Delay_Properties.png|250px|right]]<br /> * Drag and drop a [[Delay Icon Properties|Delay icon]] after the 'Output' icon.<br /> :* Double click on it to open the configuration dialogue box, and then:<br /> ::* Change the 'Display name:' to &quot;For 10 seconds&quot;.<br /> ::* Change the 'Delay value:' to '10'.<br /> ::* Change the unit to 'seconds'.<br /> ::* Click on 'OK'.<br /> ::: (The resulting dialogue box is shown opposite.)<br /> [[File:Exercise_Configuring_Icons_and_Variables_Output_Properties_02.png|250px|right]]<br /> <br /> <br /> : Finally, we need to turn off the lamp, after the ten second delay.<br /> * Double click on the second 'Output' icon to allow you to configure it.<br /> :* Rename it &quot;Switch off&quot;, and configure it to deliver value &quot;0&quot; to single bit 0 of Port B.<br /> :: (The resulting dialogue box is shown opposite.)<br /> <br /> <br /> <br /> You should now [[Saving a Flowchart|save the flowchart]] as &quot;Lamp1.fcf&quot;, and [[Closing Flowcode|close Flowcode]].<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Configuring Icons and Variables.fcfx|Exercise - Configuring Icons and Variables}}<br /> <br /> <br /> ==What next?==<br /> The next step is to add the switch and lamp to the flowchart. This is covered in the exercise [[Exercise - Adding Devices to a Program|Adding Devices to a Program]].</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Graphics&diff=14321 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Graphics.Animated|Animated]]<br /> |Notification than an animation has finished<br /> |-<br /> |width=&quot;35%&quot;|[[Event Graphics.Redraw|Redraw]]<br /> |Reconstructs and redraws the target component<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Keyboard&diff=14322 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Keyboard.ButtonName|ButtonName]]<br /> |Sent to give a meaningful name to a button on a simulated mouse-click<br /> |-<br /> |width=&quot;35%&quot;|[[Event Keyboard.KeyMapDown|KeyMapDown]]<br /> |Post when a mapped key is pressed for the component<br /> |-<br /> |width=&quot;35%&quot;|[[Event Keyboard.KeyMapUp|KeyMapUp]]<br /> |Post when a mapped key is released for the component<br /> |-<br /> |width=&quot;35%&quot;|[[Event Keyboard.MappingKeys|MappingKeys]]<br /> |Sent to find out how many keys it is possible to map to the component during simulation<br /> |-<br /> |width=&quot;35%&quot;|[[Event Keyboard.MappingName|MappingName]]<br /> |Sent to give a meaningful name to a custom key-map event for a component<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Mouse&diff=14323 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Mouse.Release|Release]]<br /> |Post when the mouse is released on a child of the component during simulation<br /> |-<br /> |width=&quot;35%&quot;|[[Event Mouse.Click|Click]]<br /> |Post when the mouse is clicked on a child of the component during simulation<br /> |-<br /> |width=&quot;35%&quot;|[[Event Mouse.Drag|Drag]]<br /> |Post when the mouse is dragged on a child of the component during simulation<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Scope&diff=14324 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Scope.Decode|Decode]]<br /> |Sent when a block of the stream is to be decoded into packets<br /> |-<br /> |width=&quot;35%&quot;|[[Event Scope.Overlay|Overlay]]<br /> |Sent when the mouse hovers over a scope stream<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Simulation&diff=14325 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Simulation.Pause|Pause]]<br /> |Broadcast to all components that simulation has paused<br /> |-<br /> |width=&quot;35%&quot;|[[Event Simulation.Resume|Resume]]<br /> |Broadcast to all components that simulation has resumed<br /> |-<br /> |width=&quot;35%&quot;|[[Event Simulation.Start|Start]]<br /> |Broadcast to all components that simulation is starting<br /> |-<br /> |width=&quot;35%&quot;|[[Event Simulation.Stop|Stop]]<br /> |Broadcast to all components that simulation has stopped<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Sound&diff=14326 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Sound.Complete|Complete]]<br /> |Sent when a sound queued by the component has finished playing<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_System&diff=14327 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event System.CleanHandle|CleanHandle]]<br /> |Called when a custom handle is deleted to allow cleanup of resources<br /> |-<br /> |width=&quot;35%&quot;|[[Event System.Timer|Timer]]<br /> |Called back on the panel command System.TimerStart<br /> |-<br /> |width=&quot;35%&quot;|[[Event System.User|User]]<br /> |Called back on the panel command System.Notify<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Tooltip&diff=14328 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Tooltip.GraphicPoll|GraphicPoll]]<br /> |Called when a tooltip graphic is updating with the draw image already pushed<br /> |-<br /> |width=&quot;35%&quot;|[[Event Tooltip.GetText|GetText]]<br /> |Called when a tooltip text string can be displayed<br /> |-<br /> |width=&quot;35%&quot;|[[Event Tooltip.GetGraphic|GetGraphic]]<br /> |Called when a tooltip graphic can be displayed with the draw image already pushed<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Exercise_-_Adding_Devices_to_a_Program&diff=14329 2014-01-16T15:59:04Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Sidebar: Controlling Electronic Devices With Flowcode&lt;/sidebar&gt;<br /> This exercise assumes that you have already built the Flowcode flowchart described in the exercise [[Exercise - Configuring Icons and Variables|Configuring Icons and Variables]].&lt;br /&gt;<br /> To complete the program, you need to add the two electronic components, the switch and the lamp.<br /> <br /> <br /> __TOC__<br /> <br /> <br /> ==Load the Flowcode Flowchart==<br /> <br /> * Open the flowchart, called 'Lamp1.fcf' which you created in the exercise [[Exercise - Configuring Icons and Variables|Configuring Icons and Variables]].<br /> :(For help with this, see the article [[Opening an Existing Flowchart]]) <br /> : The System Panel and Panel Properties should be visible. If not, use the [[View]] menu to select them.<br /> <br /> <br /> ==Add the Switch==<br /> [[File:Exercise Adding Devices to a Program Switch Properties.png|300px|right]]<br /> * Click on the 'Inputs' toolbox, and locate the [[Component: ID 5c1da48f ce54 4622 bdd9 fc812e373696|Push Round Panel]] [[File:Component Icon 5c1da48f ce54 4622 bdd9 fc812e373696.png]] switch.<br /> * Hover over the image, and click on the down arrow that appears.<br /> * Select the 'Add to system panel' option.<br /> <br /> <br /> * Click on the switch on the [[System Panel]] to select it. Its properties appear in the Panel Properties.<br /> : Notice that the name ('Handle') of the component selected appears at the top of the Panel Properties.<br /> : In this case, it shows the name of the switch as 'sw_push_rnd_pnl'!<br /> <br /> <br /> * Find the 'Connections' properties on the Panel Properties, the box to the right of it.<br /> : A pinout of the microcontroller appears. <br /> :* Ensure that it is connected to Port A bit 0 by using the drop down menus or clicking on the rectangle representing the pin for Port A bit 0 (called RA0/AN0 on the graphic.)<br /> :: This connects the switch to Port A bit 0 of the microcontroller, matching the settings you used when you created the flowchart.<br /> :: This setting is shown opposite.<br /> <br /> :* No other properties need changing, though the [[Object Scale|Scale]] section allows you to change the size (and shape) of the switch if you wish.<br /> <br /> <br /> <br /> <br /> <br /> <br /> ==Add the Lamp==<br /> [[File:Exercise Adding Devices to a Program LED Properties.png|300px|right]]<br /> * Click on the 'Outputs' toolbox, and locate and add an [[Component: ID a7b05886 784c 48c8 a6f6 cc371c7728e1|LED]] such as the [[Component: ID 7fdaec78 394e 4ec9 a578 4f1a12a12076|LED 5mm Panel]] component, which we will use as a lamp.<br /> * Hover over the image, and click on the down arrow that appears.<br /> * Select the 'Add to system panel' option.<br /> * The LED appears in the middle of the System Panel, probably right on top of the switch.<br /> : It should already be selected, but if not click on it.<br /> : If so, drag it to a suitable position off to one side.<br /> <br /> <br /> * With the LED selected, look at the Panel Properties.<br /> : Notice that the 'Handle' has changed to the name of the component handle.<br /> : The 'Connection' property may not be connected to the correctly, as the flowchart expects it to be connected to Port B, bit 0.<br /> :* Click on the box next to the 'Connection' property and, as before, a pinout of the chip appears.<br /> :* Click on the rectangle representing the pin for bit 0 of Port B, shown as RB0/INT or use the drop down menus to connect the component.<br /> :: The Panel Properties now show that the LED is connected to Port B, bit 0.<br /> <br /> :* Once again, no other properties need changing, though the 'Scale' section can alter the size of the component and the 'Color' property (also known as 'Bulb color' in other components) allows you to change the colour of the LED.<br /> <br /> <br /> <br /> <br /> ==Save the Flowchart==<br /> * Save the flowchart using the same name. The simplest way to do this is to click on the 'Save' icon. [[File:Btn Save.png|border]]<br /> : For more information, see [[Saving a Flowchart]].<br /> <br /> <br /> ==Download the exercise==<br /> You can download the file created by this exercise and open it in Flowcode to identify errors in your program/file or you could also download the file to skip to the next exercise.<br /> <br /> *To download the file, click on the link below and then either:<br /> :*Click on the file name.<br /> :*Right click the file name and select 'Save link as...' or 'Save target as...' (depending on your browser).<br /> <br /> :::{{Fcfile|Exercise - Adding Devices to a Program.fcfx|Exercise - Adding Devices to a Program}}<br /> <br /> <br /> ==What next?==<br /> Now that the flowchart is complete, we are ready to test it in simulation, as described in the next exercise [[Exercise - Simulating a Program|Simulating a Program]].</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_System.Timer&diff=14311 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Called back on the panel command System.TimerStart<br /> <br /> This event is part of the [[Event class System|System]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|ULONG]] ''TimerID''<br /> :The identifier passed to the System.TimerStart panel command<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_System.User&diff=14312 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Called back on the panel command System.Notify<br /> <br /> This event is part of the [[Event class System|System]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|ULONG]] ''MessageID''<br /> :The identifier passed to the System.Notify panel command<br /> <br /> [[Variable Types|ULONG]] ''Data''<br /> :Some data value to pass to the event<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Tooltip.GetGraphic&diff=14313 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Called when a tooltip graphic can be displayed with the draw image already pushed<br /> <br /> This event is part of the [[Event class Tooltip|Tooltip]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Component''<br /> :The object under the mouse<br /> <br /> [[Variable Types|FLOAT]] ''X''<br /> :X size of tooltip area<br /> <br /> [[Variable Types|FLOAT]] ''Y''<br /> :Y size of tooltip area<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> Non-zero to claim the tooltip event<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Tooltip.GetText&diff=14314 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Called when a tooltip text string can be displayed<br /> <br /> This event is part of the [[Event class Tooltip|Tooltip]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Component''<br /> :The object under the mouse<br /> <br /> [[Variable Types|STRING]] ''Buffer''<br /> :Text variable to update with the tool-tip<br /> :''This parameter is returned back to Flowcode''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> Non-zero to claim the tooltip event<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Tooltip.GraphicPoll&diff=14315 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Called when a tooltip graphic is updating with the draw image already pushed<br /> <br /> This event is part of the [[Event class Tooltip|Tooltip]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Component''<br /> :The object under the mouse<br /> <br /> [[Variable Types|FLOAT]] ''X''<br /> :X size of tooltip area<br /> <br /> [[Variable Types|FLOAT]] ''Y''<br /> :Y size of tooltip area<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> Non-zero to keep the tooltip event<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Compile&diff=14316 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> The Compile event class is called at various stages during compilation of the downloadable code, and allows a component to customise their C code as raw text. It covers everything from the size of a variables array to the contents of interrupt handlers.<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.Preprocess|Preprocess]]<br /> |Broadcast to all components immediately before compilation is started<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddProperty|AddProperty]]<br /> |Sent to a component to allow dynamic amendment of global property declarations<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddConst|AddConst]]<br /> |Sent to a component to allow dynamic amendment of global variable declarations<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddVarSize|AddVarSize]]<br /> |Sent to a component to allow dynamic amendment of global array-size declarations<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddVar|AddVar]]<br /> |Sent to a component to allow dynamic amendment of global constant declarations<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddHeader|AddHeader]]<br /> |Sent to a component to allow dynamic amendment of header code<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddInterrupts|AddInterrupts]]<br /> |Sent to a component to allow dynamic amendment of the interrupts for a component<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.AddInterrupt|AddInterrupt]]<br /> |Sent to a component to allow dynamic amendment of a single interrupts code<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.Start|Start]]<br /> |Broadcast to all components that compilation is starting<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.Stop|Stop]]<br /> |Broadcast to all components that compilation has stopped<br /> |-<br /> |width=&quot;35%&quot;|[[Event Compile.GetVarSize|GetVarSize]]<br /> |Sent to a component to amend the size of the expected array<br /> |}<br /> <br /> ==See also==<br /> :''[[API Expand]]'' class</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Components&diff=14317 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Property|Property]]<br /> |Sent when a property has been changed by the User<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Added|Added]]<br /> |Broadcast to all existing components once a new component has been added<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Adding|Adding]]<br /> |Broadcast to all existing components when a new component is about to be added<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Resize|Resize]]<br /> |Sent to the mouse target when the user has altered the position of a component child<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Removed|Removed]]<br /> |Broadcast to all remaining components once an existing component has been removed<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Removing|Removing]]<br /> |Broadcast to all existing components when an existing component is about to be removed<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Closedown|Closedown]]<br /> |Closedown routine for the component<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Closing|Closing]]<br /> |Pre-Closedown routine for the component, sent when the component is linked<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Initialise|Initialise]]<br /> |Initialisation routine for the component once the component is linked to its parent<br /> |-<br /> |width=&quot;35%&quot;|[[Event Components.Initialising|Initialising]]<br /> |Initialisation routine before the component is linked to its parent<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Connection&diff=14318 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Connection.PinPopulate|PinPopulate]]<br /> |Sent when auto-populate of digital connections is requested<br /> |-<br /> |width=&quot;35%&quot;|[[Event Connection.PinChange|PinChange]]<br /> |Sent during simulation if a connected port pin changes<br /> |-<br /> |width=&quot;35%&quot;|[[Event Connection.AnPopulate|AnPopulate]]<br /> |Sent when auto-populate of analog connections is requested<br /> |-<br /> |width=&quot;35%&quot;|[[Event Connection.AnChange|AnChange]]<br /> |Sent during simulation if a connected ADC channel changes<br /> |-<br /> |width=&quot;35%&quot;|[[Event Connection.ChipChange|ChipChange]]<br /> |Sent when the target device has changed<br /> |-<br /> |width=&quot;35%&quot;|[[Event Connection.Unconnected|Unconnected]]<br /> |Sent when the component is compiled with unconnected pins<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_Console&diff=14319 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event Console.AddLine|AddLine]]<br /> |Post to the owning component when a line is inserted by the user<br /> |-<br /> |width=&quot;35%&quot;|[[Event Console.TextChanged|TextChanged]]<br /> |Post when the console text is changed by the user in some way<br /> |-<br /> |width=&quot;35%&quot;|[[Event Console.MemChanged|MemChanged]]<br /> |Post when the console memory is changed by the user in some way<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_class_File&diff=14320 2014-01-16T15:59:03Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> See the individual events for details of how to use this event class<br /> <br /> __TOC__<br /> <br /> ==Events provided for this class==<br /> {|<br /> |-<br /> |width=&quot;35%&quot;|[[Event File.Changed|Changed]]<br /> |Sent when a file being watched has changed<br /> |-<br /> |width=&quot;35%&quot;|[[Event File.Closed|Closed]]<br /> |Sent when a file monitor is being closed<br /> |}<br /> <br /> ==See also==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Simulation.Pause&diff=14305 2014-01-16T15:59:02Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Broadcast to all components that simulation has paused<br /> <br /> This event is part of the [[Event class Simulation|Simulation]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> ''This event has no parameters''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> This event is sent to all components when simulation is paused at any time. At this point it may be assumed simulation is active but idle - none of the main flowchart program will be executed whilst paused.<br /> <br /> The system becomes active again on a [[Event Simulation.Resume|Simulation.Resume]].<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Simulation.Resume&diff=14306 2014-01-16T15:59:02Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Broadcast to all components that simulation has resumed<br /> <br /> This event is part of the [[Event class Simulation|Simulation]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> ''This event has no parameters''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Simulation.Start&diff=14307 2014-01-16T15:59:02Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Broadcast to all components that simulation is starting<br /> <br /> This event is part of the [[Event class Simulation|Simulation]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> ''This event has no parameters''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> Components usually become active when simulation starts, and become idle when simulation [[Event Simulation.Stop|stops]].<br /> <br /> This event is sent to all components to allow them to activate and prepare for simulation every time the user starts simulating.<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Simulation.Stop&diff=14308 2014-01-16T15:59:02Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Broadcast to all components that simulation has stopped<br /> <br /> This event is part of the [[Event class Simulation|Simulation]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> ''This event has no parameters''<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Sound.Complete&diff=14309 2014-01-16T15:59:02Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Sent when a sound queued by the component has finished playing<br /> <br /> This event is part of the [[Event class Sound|Sound]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''SoundH''<br /> :The sound object that has played a sound<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_System.CleanHandle&diff=14310 2014-01-16T15:59:02Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Called when a custom handle is deleted to allow cleanup of resources<br /> <br /> This event is part of the [[Event class System|System]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Handle''<br /> :The object handle that is about to be freed<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Mouse.Drag&diff=14300 2014-01-16T15:59:01Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Post when the mouse is dragged on a child of the component during simulation<br /> <br /> This event is part of the [[Event class Mouse|Mouse]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Component''<br /> :The component being dragged<br /> <br /> [[Variable Types|FLOAT]] ''X''<br /> :X coordinate relative to 'Component'<br /> <br /> [[Variable Types|FLOAT]] ''Y''<br /> :Y coordinate relative to 'Component'<br /> <br /> [[Variable Types|FLOAT]] ''Z''<br /> :Z coordinate relative to 'Component'<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Mouse.Release&diff=14301 2014-01-16T15:59:01Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Post when the mouse is released on a child of the component during simulation<br /> <br /> This event is part of the [[Event class Mouse|Mouse]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''Component''<br /> :The component clicked on<br /> <br /> [[Variable Types|FLOAT]] ''X''<br /> :X coordinate relative to 'Component'<br /> <br /> [[Variable Types|FLOAT]] ''Y''<br /> :Y coordinate relative to 'Component'<br /> <br /> [[Variable Types|FLOAT]] ''Z''<br /> :Z coordinate relative to 'Component'<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> The return of this event is currently unused<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Reference&diff=14302 2014-01-16T15:59:01Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Flowcode provides an ''event interface'' to help writing simulation and PC-side programs.<br /> <br /> This event list allows Flowcode to communicate with the components through macros.<br /> <br /> An event may be thought of as a ''simulation-side interrupt''. Each event associated with a Flowcode program will call a macro when that event occurs.<br /> <br /> Events are grouped by ''class'' to provide context for their use. Below is a reference to the classes and events available:<br /> {| class=&quot;wikitable&quot;<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Compile|Compile]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.Preprocess|Preprocess]]<br /> |Broadcast to all components immediately before compilation is started<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddProperty|AddProperty]]<br /> |Sent to a component to allow dynamic amendment of global property declarations<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddConst|AddConst]]<br /> |Sent to a component to allow dynamic amendment of global variable declarations<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddVarSize|AddVarSize]]<br /> |Sent to a component to allow dynamic amendment of global array-size declarations<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddVar|AddVar]]<br /> |Sent to a component to allow dynamic amendment of global constant declarations<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddHeader|AddHeader]]<br /> |Sent to a component to allow dynamic amendment of header code<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddInterrupts|AddInterrupts]]<br /> |Sent to a component to allow dynamic amendment of the interrupts for a component<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.AddInterrupt|AddInterrupt]]<br /> |Sent to a component to allow dynamic amendment of a single interrupts code<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.Start|Start]]<br /> |Broadcast to all components that compilation is starting<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.Stop|Stop]]<br /> |Broadcast to all components that compilation has stopped<br /> |-<br /> | width=&quot;30%&quot; | [[Event Compile.GetVarSize|GetVarSize]]<br /> |Sent to a component to amend the size of the expected array<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Components|Components]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Property|Property]]<br /> |Sent when a property has been changed by the User<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Added|Added]]<br /> |Broadcast to all existing components once a new component has been added<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Adding|Adding]]<br /> |Broadcast to all existing components when a new component is about to be added<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Resize|Resize]]<br /> |Sent to the mouse target when the user has altered the position of a component child<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Removed|Removed]]<br /> |Broadcast to all remaining components once an existing component has been removed<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Removing|Removing]]<br /> |Broadcast to all existing components when an existing component is about to be removed<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Closedown|Closedown]]<br /> |Closedown routine for the component<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Closing|Closing]]<br /> |Pre-Closedown routine for the component, sent when the component is linked<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Initialise|Initialise]]<br /> |Initialisation routine for the component once the component is linked to its parent<br /> |-<br /> | width=&quot;30%&quot; | [[Event Components.Initialising|Initialising]]<br /> |Initialisation routine before the component is linked to its parent<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Console|Console]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Console.AddLine|AddLine]]<br /> |Post to the owning component when a line is inserted by the user<br /> |-<br /> | width=&quot;30%&quot; | [[Event Console.TextChanged|TextChanged]]<br /> |Post when the console text is changed by the user in some way<br /> |-<br /> | width=&quot;30%&quot; | [[Event Console.MemChanged|MemChanged]]<br /> |Post when the console memory is changed by the user in some way<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Connection|Connection]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Connection.PinPopulate|PinPopulate]]<br /> |Sent when auto-populate of digital connections is requested<br /> |-<br /> | width=&quot;30%&quot; | [[Event Connection.PinChange|PinChange]]<br /> |Sent during simulation if a connected port pin changes<br /> |-<br /> | width=&quot;30%&quot; | [[Event Connection.AnPopulate|AnPopulate]]<br /> |Sent when auto-populate of analog connections is requested<br /> |-<br /> | width=&quot;30%&quot; | [[Event Connection.AnChange|AnChange]]<br /> |Sent during simulation if a connected ADC channel changes<br /> |-<br /> | width=&quot;30%&quot; | [[Event Connection.ChipChange|ChipChange]]<br /> |Sent when the target device has changed<br /> |-<br /> | width=&quot;30%&quot; | [[Event Connection.Unconnected|Unconnected]]<br /> |Sent when the component is compiled with unconnected pins<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Scope|Scope]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Scope.Decode|Decode]]<br /> |Sent when a block of the stream is to be decoded into packets<br /> |-<br /> | width=&quot;30%&quot; | [[Event Scope.Overlay|Overlay]]<br /> |Sent when the mouse hovers over a scope stream<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Simulation|Simulation]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Simulation.Pause|Pause]]<br /> |Broadcast to all components that simulation has paused<br /> |-<br /> | width=&quot;30%&quot; | [[Event Simulation.Resume|Resume]]<br /> |Broadcast to all components that simulation has resumed<br /> |-<br /> | width=&quot;30%&quot; | [[Event Simulation.Start|Start]]<br /> |Broadcast to all components that simulation is starting<br /> |-<br /> | width=&quot;30%&quot; | [[Event Simulation.Stop|Stop]]<br /> |Broadcast to all components that simulation has stopped<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class System|System]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event System.CleanHandle|CleanHandle]]<br /> |Called when a custom handle is deleted to allow cleanup of resources<br /> |-<br /> | width=&quot;30%&quot; | [[Event System.Timer|Timer]]<br /> |Called back on the panel command System.TimerStart<br /> |-<br /> | width=&quot;30%&quot; | [[Event System.User|User]]<br /> |Called back on the panel command System.Notify<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Sound|Sound]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Sound.Complete|Complete]]<br /> |Sent when a sound queued by the component has finished playing<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Tooltip|Tooltip]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Tooltip.GraphicPoll|GraphicPoll]]<br /> |Called when a tooltip graphic is updating with the draw image already pushed<br /> |-<br /> | width=&quot;30%&quot; | [[Event Tooltip.GetText|GetText]]<br /> |Called when a tooltip text string can be displayed<br /> |-<br /> | width=&quot;30%&quot; | [[Event Tooltip.GetGraphic|GetGraphic]]<br /> |Called when a tooltip graphic can be displayed with the draw image already pushed<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class File|File]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event File.Changed|Changed]]<br /> |Sent when a file being watched has changed<br /> |-<br /> | width=&quot;30%&quot; | [[Event File.Closed|Closed]]<br /> |Sent when a file monitor is being closed<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Graphics|Graphics]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Graphics.Animated|Animated]]<br /> |Notification than an animation has finished<br /> |-<br /> | width=&quot;30%&quot; | [[Event Graphics.Redraw|Redraw]]<br /> |Reconstructs and redraws the target component<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Keyboard|Keyboard]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Keyboard.ButtonName|ButtonName]]<br /> |Sent to give a meaningful name to a button on a simulated mouse-click<br /> |-<br /> | width=&quot;30%&quot; | [[Event Keyboard.KeyMapDown|KeyMapDown]]<br /> |Post when a mapped key is pressed for the component<br /> |-<br /> | width=&quot;30%&quot; | [[Event Keyboard.KeyMapUp|KeyMapUp]]<br /> |Post when a mapped key is released for the component<br /> |-<br /> | width=&quot;30%&quot; | [[Event Keyboard.MappingKeys|MappingKeys]]<br /> |Sent to find out how many keys it is possible to map to the component during simulation<br /> |-<br /> | width=&quot;30%&quot; | [[Event Keyboard.MappingName|MappingName]]<br /> |Sent to give a meaningful name to a custom key-map event for a component<br /> |-<br /> ! colspan=&quot;2&quot; | [[Event class Mouse|Mouse]]<br /> |-<br /> | width=&quot;30%&quot; | [[Event Mouse.Release|Release]]<br /> |Post when the mouse is released on a child of the component during simulation<br /> |-<br /> | width=&quot;30%&quot; | [[Event Mouse.Click|Click]]<br /> |Post when the mouse is clicked on a child of the component during simulation<br /> |-<br /> | width=&quot;30%&quot; | [[Event Mouse.Drag|Drag]]<br /> |Post when the mouse is dragged on a child of the component during simulation<br /> |}</div>

JonnyW https://www.flowcode.co.uk/wiki/index.php?title=Event_Scope.Decode&diff=14303 2014-01-16T15:59:01Z

<p>JonnyW: XML import</p> <hr /> <div>&lt;sidebar&gt;Event Contents&lt;/sidebar&gt;<br /> Sent when a block of the stream is to be decoded into packets<br /> <br /> This event is part of the [[Event class Scope|Scope]] class<br /> <br /> __TOC__<br /> <br /> ==Parameters==<br /> [[Variable Types|HANDLE]] ''StreamH''<br /> :The stream handle<br /> <br /> [[Variable Types|ULONG]] ''TimeUS''<br /> :The -ve offset from now of the earliest time to be decoded, in microseconds<br /> <br /> [[Variable Types|ULONG]] ''OverlaySize''<br /> :The number of microseconds of the decoded packet from its start<br /> <br /> <br /> ==Return value==<br /> [[Variable Types|ULONG]]<br /> Non-zero if the data could be decoded<br /> <br /> <br /> ==Detailed description==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional information&lt;/span&gt;''<br /> <br /> <br /> ==Examples==<br /> ''&lt;span style=&quot;color:red;&quot;&gt;No additional examples&lt;/span&gt;''</div>

JonnyW