Arithmetic - 03maths.fla

This program demonstrates

Input -
digits typed by the user
Button press to trigger the processing
Process
    conversion of text to number
    addition of the numbers
    conversion of the sum of the numbers back to text.
Output - the sum of the numbers is displayed.

It makes use of

an initialisation script
static text for output
input text
button release event handling
conversion between text and numeric data types
arithmetic operators
dynamic text for output

Start up Macromedia Flash

Start a new Flash document.
Set the background colour.
Set the size of the stage to 250 x 160.
Save this document as 03maths.fla

Add a Static Text title to the stage.

Select the text tool and drag out a rectangle where you can enter some text onto the stage.
The text should read "Calculator".
Select the arrow tool and drag the text to the right position on the stage.
Make sure the text is static. Adjust the font, size and colour.

Add two Input Text controls to your stage.

Select the text tool and drag out two rectangles where you can enter text onto the stage.
For both input controls, set the text to "Input Text"
Select the arrow tool and drag the two text controls to the right position on the stage.
Set the Instance Names of the two text controls to "InputOne" and InputTwo".
Set the Var field for each input control to "inputOne" and "inputTwo" and finally add a border to each input control.

Add a push button to the stage

Double click here to add the push button
Select the arrow tool and drag the button to the correct position.
Make sure the Parameters pane is selected.
Alter the button label to "Add". Optionally, set the Instance Name to add_btn.

Add a Dynamic Text area for the program output.

Select the text tool and drag out an area for the output text.
Make sure the text is Dynamic
Select the arrow tool and drag the output text to the correct position.
Set the Var field and Instance Name to "outputText".

Save your work and use CTRL+Enter to do a test run. You may notice that the text areas contain messages like "_level0.inputText".

You need to write some ActionScript code to initialise the Input Text to be blank.

Click on Layer 1 - Frame 1.
Click the Actions-Frame to open this view.
Ensure you are in Expert Mode
Enter this code and make sure you use the same names that you entered earlier.


_root.inputOne   = "";
_root.inputTwo   = "";
_root.outputText = "";

Use CTRL+Enter to do another test run. The unwanted text should have gone away but the push button will still not work.

Create the event handler to process the button release.

Click the Add Button to make sure it is selected (and nothing else is selected).
Click the Actions-Movie Clip to open this view.
Make sure you are in Expert Mode
Enter this code.


on (release)
{
    _root.outputText = _root.inputOne + _root.inputTwo;
}

Do a test run with CTRL+Enter. The program should work but it might not do what you expect.

This is the problem. The input and output controls are designed to work with text. The (+) operator is used to join text as well as add numbers. In this case, it joins the text so 23 + 45 becomes 2345!

To fix this problem, your code must convert the text to a numeric format. One way to do this is to use (- -) instead of (+). The (-) operator is only used on numbers so the program has to change the text into a number before it can process the instruction. Mathematically, using two (-) operators is the same as using one (+) operator. It is important to put a space between each (- -) sign because (--) means "subtract one" and you don't want to do this here. This is the correct code.


on (release)
{
    _root.outputText = _root.inputOne - - _root.inputTwo;
}

Here is the finished movie/program.

You can download the source code.

To run the program again, refresh your display
(F5 key with Internet Explorer)

Your learning task

Add buttons labeled "Subtract", Multiply" and "Divide" and make them work.

Find out what happens if you try to divide by zero?

The main arithmetic operators are

+ add
- subtract
* multiply
/ divide
% modulo (remainder after integer division)