Difference between revisions of "Exercise - Creating a Flowchart"

From Flowcode Help
Jump to navigationJump to search
(Replaced content with "For an excellent introduction guide, we recommend [https://www.flowcode.co.uk/education/ Introduction to microcontroller programming]")
Tag: Replaced
 
(68 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 
+
For an excellent introduction guide, we recommend [https://www.flowcode.co.uk/education/ Introduction to microcontroller programming]
The task is to produce a Flowcode flowchart that lights a lamp for ten seconds when a switch is pressed.<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.<br />
 
The program itself may form part of a bigger program.
 
 
 
 
 
__TOC__
 
 
 
==Formulate the sequence==
 
The flowchart sequence will be:
 
: Check if the switch is pressed.
 
:: If it isn't, go back to the beginning.
 
:: If it is:
 
::: switch on the lamp;
 
::: wait for 10 seconds;
 
::: switch off the lamp;
 
::: go back to the beginning.
 
 
 
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.
 
 
 
 
 
==Set up the flowchart==
 
[[File:Gen_Startup_Selection.png||250px|right]]
 
* [[Opening Flowcode|Open Flowcode]].
 
* On the Startup screen, click on 'New embedded project'.
 
 
 
 
 
[[File:Gen_Project_Options_Target_16F1937.png|right|250px]]
 
: The [[Project Options]] dialogue box opens.
 
: (Click on the link for a full explanation of all the options available.)
 
 
 
* Accept the default settings by clicking on 'OK'.
 
: An empty flowchart window opens, which may contain other items such as a [[System Panel]], [[Dashboard Panel]], [[Properties Panel]] etc.
 
: These can be revealed or hidden using the [[View]] menu.
 
 
 
 
 
* Set up the flowchart window so that you can see the System Panel and the Properties Panel.
 
: The flowchart window should resemble the one shown below (depending on the configuration.)
 
 
 
 
 
[[File:gen_exerciseFirstFlowchart_startscreen_01.png|500px|center]]
 
 
 
 
 
: The System Panel and Properties Panel can be moved by 'clicking and dragging the title bar at the top of each panel.
 
 
 
 
 
==Set up the input==
 
: More information about the icons used in this flowchart can be found in [[Icon Properties]].
 
* Drag and drop a 'Loop' icon between the BEGIN and END icons.
 
: The 'Loop' icon makes the microcontroller repeatedly run through the program, (though the icon can be configured to limit the number of times this happens.)
 
[[File:Gen exerciseFirstFlowchart newvar 01.png|250px|right]]
 
 
 
* Inside the loop, drag and drop an 'Input' icon from the [[Tools and Views#1) Icons Toolbar|Icons toolbar]].
 
:* Double click on the icon.
 
:: This opens the 'Properties: Input' dialogue box, allowing you to configure the way the program treats information from the switch.
 
:: This information will be contained in a variable called 'switch'.
 
::* Click on the down arrow at the right-hand end of the 'Variable:' box to open the variables dialogue box.
 
 
 
 
 
::* Hover to the left of the 'Variables' label and click on the down arrow that appears.
 
::* Click on the 'Add new' option to open the 'Create a New Variable' dialogue box.
 
::* [[Creating Variables|Create a new variable]] named "switch" with initial value "0" and description "Copies the state of the switch"
 
 
 
::* Leave the 'Variable type:' as 'Byte'.
 
::: (For more information about variables, see [[Creating Variables]] and [[Variable Types]].
 
::: (The resulting dialogue box is shown opposite.)
 
[[File:gen_exerciseFirstFlowchart_inputprops_01.png|250px|right]]
 
 
 
:* Finish configuring the input properties as follows:
 
::* Change the 'Display name:' to "Read the switch".
 
::* In the 'Variable:' box, type the name of the variable you created "switch".
 
::* Leave the 'Port:' as PORT A.
 
::* Select to 'Input from:' 'Single Bit' and choose bit 0.
 
::: (The resulting dialogue box is shown opposite.)
 
 
 
 
 
: 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.
 
: When the program looks at the input switch if it is pressed, the variable 'switch' contains logic 1. If unpressed, it contains logic 0.
 
 
 
 
 
==Check the switch==
 
[[File:gen_exerciseFirstFlowchart_deciconprop_01.png|250px|right]]
 
* Drag and drop a 'Decision' icon after the 'Input' icon.
 
:* Double click on it to open the configuration dialogue box, and then:
 
::* Rename it "Switch pressed?".
 
::* In the 'If:' box, type "switch=1".
 
::* Leave the 'Swap Yes and No' box unchecked.
 
::* Click on 'OK'.
 
 
 
: This icon makes the program perform what is known as a conditional branch.
 
: The subsequent course of the program depends on the outcome of the condition specified in the 'Decision' icon.
 
: In this case, it depends on whether or not the variable 'switch' = 1.
 
: If it is, the program follows the 'Yes' route. If not, it follows the 'No' route.
 
 
 
==Control the lamp==
 
 
 
: The 'No' branchis easy to set up. All we want is that the program returns to the beginning (taken care of by the 'Loop' icon.)
 
: No further configuration is needed.
 
[[File:gen_ exerciseFirstFlowchart_ outputprops_ 01.png|250px|right]]
 
: Next we concentrate on the 'Yes' branch.
 
* Drag and drop an 'Output' icon in the 'Yes' branch.
 
:* Double click on it to open the configuration dialogue box, and then:
 
::* Change the 'Display name:' to "Switch on".
 
::* In the 'Variable or value:' box, type value "1".
 
::* Change the 'Port:' to PORT B.
 
::* Select to 'Output to: 'Single Bit' and choose bit 0.
 
::* Click on 'OK'.
 
::: (The resulting dialogue box is shown opposite.)
 
 
 
: 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.
 
: This turns on the lamp.
 
: Now, we tackle the requirement that it stays on for ten seconds and then goes off.
 
[[File:gen_exerciseFirstFlowchart_delayiconprop_01.png|250px|right]]
 
* Drag and drop a 'Delay' icon after the 'Output' icon.
 
:* Double click on it to open the configuration dialogue box, and then:
 
::* Change the 'Display name:' to "For 10 seconds".
 
::* Leave the 'Delay value:' as '1'.
 
::* Change the unit to 'seconds.
 
::* Click on 'OK'.
 
::: (Again, the resulting dialogue box is shown opposite.)
 
[[File:gen_exerciseFirstFlowchart_outputprop2_01.png|250px|right]]
 
: Finally, we need to turn off the lamp, after the ten second delay.
 
: To do this:
 
* Drag and drop a second 'Output' icon after the 'Delay' icon.
 
* Double click on it to allow you to configure it.
 
: Rename it "Switch off", and configure it to deliver value "0" to single bit 0 of Port B.
 
: The resulting dialogue box is shown opposite.
 
 
 
You should now save the flowchart as "Lamp1.fcf", and [[Closing Flowcode|close Flowcode]].
 
 
 
 
 
==What next==
 
The next step is to add the switch and lamp to the flowchart. This is covered in the exercise [[Adding Devices to a Flowchart]].
 

Latest revision as of 13:10, 25 April 2023

For an excellent introduction guide, we recommend Introduction to microcontroller programming