Exercise - Using Component Macros

Component macros are sections of code that have been written to support the components included with Flowcode 6.
They take all the effort out of using these components.
This exercise uses them to control a particularly complicated, but very common device, the Liquid Crystal Display (LCD).
In this case, it uses a LCD to display elapsed time.

The core sequence

The flowchart sequence for the elapsed time will be:

Initialize the LCD.

Display the text "Elapsed time".

Set the time to zero.

Display the time.

Wait one second.

Increment the time.

Display the new time.

Loop back and repeat the process from the delay again.

Set up the flowchart

• Open Flowcode, and set up the new flowchart as described in Creating Your First Flowchart.

Create the core sequence

• Locate the 'LCD' inside the 'Outputs' toolbox in the Icons toolbar.

• Hover over the image to the left of the 'LCD' label, and click on the down-arrow that appears.
• Click on the 'Add to system panel' option to select it.
• Zoom in until the LCD image is big enough to read.(See System Panel for information on how to zoom.)

• Click and drag an infinite loop between the 'BEGIN' and 'END' icons.

250px

Initialise the LCD

• Inside the loop:

• Click and drag a 'Component macro' icon.

• Double click on it to open the dialogue box, so that you can configure it.

The program 'knows' which components you have added to the System or Dashboard panel, and modifies the list of available commands accordingly.

Under 'Components', the LCD will be listed, and underneath it the list of commands.

• Scroll down to the bottom of the list and click on the 'Start' command.
• Rename the 'Display name' as "Start the LCD".
• Click on 'OK'.
• The dialogue box resembles that shown opposite.

250px

Set up the display

• Click and drag a second 'Component macro' icon just below the first.

• Double click on it to open the dialogue box.
• Scroll down to the 'PrintString' command and click on it.
• Rename the 'Display name' as "Elapsed time".
• In the 'Expression' box, type "Elapsed time" (making sure you include the quotation marks "".)
• Click on 'OK'.
• The dialogue box is shown opposite.

250px

Display elapsed time

• In the 'Edit' menu, on the main toolbar, click on 'Variables...' to open the 'Variable Manager' dialogue box.

• Hover just to the left of the 'Variables' label, and click on the down arrow that appears.
• Select 'Add new' and the 'Create a New Variable' dialogue box opens.
• Name the new variable "time", and give it an initial value of zero.
• Leave the variable type as 'Byte'.
• Click on 'OK'.
• The dialogue box should resemble that opposite.

250px

• Click and drag a third 'Component Macro' to follow the second one.

• Double click on it to open the dialogue box.
• Scroll down to the 'PrintNumber' command and click on it.
• Rename the 'Display name' as "Display elapsed time".
• In the 'Expression' box, type the variable name "time".
• Click on 'OK'.
• The third 'Component Macro' dialogue box is shown opposite.

• Click and drag a 'Delay' icon to follow the third 'Component Macro'.

• Double click on it to open the dialogue box.
• Rename it "Wait one second."
• Configure it to give a delay of one second.

For help with 'Delay' icons, see ...

• Click on 'OK'.

• Click and drag a 'Calculation' icon to follow the 'Delay'.

• Double click on it to open the dialogue box.
• Rename it "Add one second."
• In the 'Calculations:' section, type "time=time+1".

The effect of this is to increase the number stored in the 'time' variable by one, (also called incrementing the 'time' variable.)

For help with 'Calculation' icons, see ...

• Click on 'OK'.

Test the Core

The diagram below shows the flowchart as it is now.

At this point, the flowchart should be saved as 'Stopwatch', and can be simulated.

For help with 'Calculation' icons, see ...