Hello, and welcome to this new video tutorial brought to you by our Roja media. In this tutorial, we will create a basic functioning arithmetic calculator using Flash drawing tools like input and output text fields, buttons, and lots of ActionScript. This simple calculator will perform addition, subtraction, multiplication, and division. To get started, take a new Flash file with ActionScript 3.0. named the very first layer as an object, we will need to input text fields to level them. Take a static text firstly on stage and type input one. And now take an input text box in front of this text.

This will be the first box to enter the first figure to be calculated from profit panel, keep each behavior to single line and click on the option for show border around text. So to view the border as an input box, now, we need to choose the embedding characters. So click on embed, and choose only two options, numerals for numbers, and punctuation for decimal points. Set the maximum characters to 999. Also give it an instance name as input one underscore txt to use in ActionScript. Similarly, we will need a second input box.

So hold down the Alt key and drag the about text and text box downwards to duplicate it, as seen in the video. Now, rename this text to input two Rename the instance name of input text field to input to underscore txt. Rest all the properties will remain the same for this input box. So this is done. Now, we need an output box to view the calculated figure. So again, duplicate the about text and text box.

Rename this new text box level to output select this text box, change this type to dynamic text and also modify the instance name to output underscore txt for this to the same character embedding should be used. So these are the basic input and output text box fields required. Now we move to the buttons to do the arithmetic calculation. So let's get them to go to Windows components. I'll simply press Ctrl plus f7. In the user interface options here, we have ready made buttons available.

Click and drag one button on stage. We don't need such a big button for calculator signs. So let's resize it from the Properties panel. set its width to 35 and let the height to 20. To open the component inspector and change its level two plus sign also name its instance as ad underscore btn from the Properties panel. Here we are ready with the plus button.

Similarly, we need three more buttons besides this. So again, hold the Alt key to duplicate this button. Place it exactly besides the previous one Change the label for this to minus sign and also rename the instance name to sub underscore btn. Make one more copy of the button. Now this is supposed to be a multiplication button label name to star sign, which represents multiplication. So rename the instance name to multi underscore btn.

And next duplication is for the division button. For this, rename the level to slash and the instance name to div underscore btn. That is di v underscore btn. So finally, we are ready with all the design elements for the basic arithmetic calculator along with their instance names. You can modify its look and feel as per your choice. Let's save our file as calculator.

Now we move to the ActionScript part. Before this, let's take the file we have worked on till now. Press Ctrl plus Enter to publish the swf, we are able to enter the values in the input boxes, just the operations are not working because our ActionScript is not done yet. So, let's start add a new layer of actions and press f9 to get the action panel. First thing we need to do is define the global variables. global variables are the variables which can be used a number of times in coding, those are defined outside the function first, num, one variable is to store the entered value in the first input textbox Similarly, num to variable is taken to store the entered value in the second input text box.

And the third result variable to view the result in the output text box. Every time on addition, subtraction, multiplication and division function, input one and input two values are captured, and then processed as per the assigned function. For all of these, let's give a common function named capture. No data types will be applied to it. In this assign input one values to num one variable and input two values to num two variable Now let's add a function for addition. In this, we need to first capture the input values.

So let's call the capture function here. Now, the actual additional process should happen and the result value should be assigned to the output textbox. This value will be viewed in result variables String class type. Now, let's go this addition file. On the Add button, add underscore btn is the instance name for it. Let's say it's the movie for the addition function, put any values in both input boxes and then click on the Add button, we get the proper calculated result in the output box.

So, we can say we are done for additional scripting. Similarly, let's do it for the rest three buttons as well. function for the subtraction part is also the same. In this the capture function is called to capture the values from the input text boxes. Just the difference is applied in the result part. That is num one minus num two and the output text box is applied the result value.

Similarly, we work on the multiplication factor The capture function is called here num one and num two multiplication is stored in the result variable. And this result value is assigned to the output text field. A similar function is added for division, just a result value will be actual division of num one and num to this result string value is assigned to the output text. Here all the function part is done. Earlier we have already assigned the above addition function to the Add button below. Similarly, we called on the subtraction function on sub underscore btn.

That is the subtraction button also called the multiplication function on multi underscore btn that is multiplication button and the division function on d iV underscore btn. That is division button. So it's time to test the movie now. Press Ctrl plus Enter to export the SWF. Let's insert 144 into input one, and 12 in input two. Now, first press the Add button, we get a proper result of 144 plus 12 in the output at the same time, click on the minus button and we again get a proper result of 144 minus 12.

Now click on the multiplication button and see again we get the correct result of input one into input to now click on the last divide button. Again it shows the exact result of input one divided by input two. This is how we created a simple but perfect arithmetic calculator in Flash using ActionScript 3.0. As mentioned Before you can have your own look and feel to this you can experiment with the design out of the media is glad to get you this useful video tutorial. Thanks for watching