Animation 4 Midterms Lesson 1 PDF

Welcome to ANIMATION 4 CONTENT STANDARD Demonstrate understanding of MOUSE EVENTS, TEXTS, MOBILE TOUCH EVENTS, ANIMATION, TIMER, and its action scripts performance STANDARD Create a simple game with mouse events and action scripts for buttons  GRADE 12 TECHVOC ICT Animation 4 Schedule...

Welcome to ANIMATION 4 CONTENT STANDARD Demonstrate understanding of MOUSE EVENTS, TEXTS, MOBILE TOUCH EVENTS, ANIMATION, TIMER, and its action scripts performance STANDARD Create a simple game with mouse events and action scripts for buttons  GRADE 12 TECHVOC ICT Animation 4 Schedule MONDAY 12:00-1:00 THURSDAY & FRIDAY 11:00-12:00 FRIDAY (FIT) 2:00-3:00 Things to prepare: Adobe Flash Installed to your device. 1/2 index card rules / REMINDERS: No late comers specially on Tuesday Schedule. JUAN DELA CRUZ GRADE 12 TVL ICT ANIMATION 4 JUAN DELA CRUZ GRADE 12 TVL ICT PROGRAMMING 4 TOPICS FOR MIDTERMS USING DYNAMIC TEXTS USING INPUT TEXTS USING FUNCTIONS DRAGGING AND DROPPING OF OBJECTS DETECTING MOUSE CLICK ADDING NAVIGATIONS DETECTING MOUSE MOVEMENT MOVING OBJECTS USING ARROW KEYS GETTING SYSTEM TIME AND USING SELECT STATEMENTS TIMER SIMPLE AND COUNTDOWN TIMER MOBILE TOUCH EVENT CONCEPTS: AIR SDK MATH FUNCTIONS JOYSTICK 2 4 6 10 16 26 42 3x(3+7)-4^2/2 =3x(3+7)-4^2/2 =3x10-16/2 =30-16/2 =30-8 =22  To insert input text boxes Learning Competencies To use mouse events for buttons To use functions Objectives To create a Calculator (Input and Dynamic)  PERFORMING MATHEMATICAL OPERATIONS The four basic mathematical operations are the following: addition (+), subtraction (-), multiplication (*), and division (/). You can perform mathematical operations given at least two numbers and one operator. Mathematical operation Result of the operation Input data Operator of the mathematical operation  MOUSE CLICK DETECTION The simplest and most commonly used code for mouse click detection is MouseEvent.CLICK. This executes the codes inside it the moment the user clicks on the mouse. INPUT TEXT The input text allows the users to input values in the stage. DYNAMIC TEXT Dynamic Text refers to a type of text field that allows content to be updated or changed during runtime based on certain actions, like user input or calculations, as opposed to Static Text which is fixed and unchanging. Steps: 1. Add a textbox. 2. Change the type to input text. 3. Change the Anti Alias to readability. 4. Click on the Show Border option. 5. Change the embed. 6. Change the instance name. In computers, a function is a collection of statements. When a function is executed, all the statements inside the function will be performed. A function may or may not have inputs, and a function may or may not have outputs. function myFunction() { codes to be executed; } import flash.events.MouseEvent; function multiplication(Event:MouseEvent):void{ var num1; capture(); var num2; rslt = num1 * num2; var rslt; txt3.text = String(rslt); } function capture(){ function division(Event:MouseEvent):void{ num1 = Number(txt1.text); capture(); num2 = Number(txt2.text); rslt = num1 / num2; } txt3.text = String(rslt); } function addition(Event:MouseEvent):void{ capture(); function clearAll(Event:MouseEvent):void{ rslt = num1 + num2; txt1.text = ""; txt3.text = String(rslt); txt2.text = ""; } txt3.text = ""; } function subtraction(Event:MouseEvent):void{ btAdd.addEventListener(MouseEvent.CLICK, addition); capture(); btMinus.addEventListener(MouseEvent.CLICK, subtraction); rslt = num1 - num2; btTimes.addEventListener(MouseEvent.CLICK, multiplication); txt3.text = String(rslt); btDivide.addEventListener(MouseEvent.CLICK, division); } btClear.addEventListener(MouseEvent.CLICK, clearAll); import flash.events.MouseEvent; function multiplication(Event:MouseEvent):void{ var num1; capture(); var num2; rslt = num1 * num2; var rslt; txt3.text = String(rslt); } function capture(){ function division(Event:MouseEvent):void{ num1 = Number(txt1.text); capture(); num2 = Number(txt2.text); rslt = num1 / num2; } num1: This will store the first number entered by the user. txt3.text = String(rslt); } num2: function This will store addition(Event:MouseEvent):void{ capture(); the second number entered by the user. function clearAll(Event:MouseEvent):void{ rslt:+ num2; rslt = num1 This will store the result of the arithmetic operation. txt1.text = ""; txt2.text = ""; txt3.text = String(rslt); } txt3.text = ""; } function subtraction(Event:MouseEvent):void{ btAdd.addEventListener(MouseEvent.CLICK, addition); capture(); btMinus.addEventListener(MouseEvent.CLICK, subtraction); rslt = num1 - num2; btTimes.addEventListener(MouseEvent.CLICK, multiplication); txt3.text = String(rslt); btDivide.addEventListener(MouseEvent.CLICK, division); } btClear.addEventListener(MouseEvent.CLICK, clearAll); import flash.events.MouseEvent; function multiplication(Event:MouseEvent):void{ var num1; capture(); var num2; rslt = num1 * num2; var rslt; txt3.text = String(rslt); } function capture(){ function division(Event:MouseEvent):void{ num1 = Number(txt1.text); capture(); num2 = Number(txt2.text); rslt = num1 / num2; } The capture function retrieves the numbers input by the txt3.text = String(rslt); } user. function addition(Event:MouseEvent):void{ function clearAll(Event:MouseEvent):void{ capture(); txt1.text rslt = num1 + num2; and txt2.text are assumed txt1.text = ""; to be two text fields txt3.text = String(rslt); txt2.text = ""; } where the user will enter the numbers. txt3.text = ""; The Number() function function subtraction(Event:MouseEvent):void{ is } used to convert the text input btAdd.addEventListener(MouseEvent.CLICK, addition); capture();(which is a string) into numbers. btMinus.addEventListener(MouseEvent.CLICK, subtraction); rslt = num1 - num2; btTimes.addEventListener(MouseEvent.CLICK, multiplication); txt3.text = String(rslt); btDivide.addEventListener(MouseEvent.CLICK, division); } btClear.addEventListener(MouseEvent.CLICK, clearAll); import flash.events.MouseEvent; function multiplication(Event:MouseEvent):void{ var num1; capture(); var num2; rslt = num1 * num2; var rslt; txt3.text = String(rslt); } When the "Add" button is clicked, the function capture(){ num1 = Number(txt1.text); addition function function is triggered. division(Event:MouseEvent):void{ capture(); num2 = Number(txt2.text); It calls rslt = num1capture() / num2; to get the numbers from } txt3.text = String(rslt); txt1 and txt2. } function addition(Event:MouseEvent):void{ capture(); It adds function num1 and num2 and stores the clearAll(Event:MouseEvent):void{ txt1.text = ""; rslt = num1 + num2; result in txt2.text = ""; rslt. txt3.text = String(rslt); } The =result txt3.text ""; (rslt) is then displayed in } function subtraction(Event:MouseEvent):void{ txt3.text. The String() function converts btAdd.addEventListener(MouseEvent.CLICK, addition); capture(); rslt = num1 - num2; the result (which is a number)subtraction); btMinus.addEventListener(MouseEvent.CLICK, back into a btTimes.addEventListener(MouseEvent.CLICK, multiplication); txt3.text = String(rslt); string to be displayed in the text btDivide.addEventListener(MouseEvent.CLICK, field. division); } btClear.addEventListener(MouseEvent.CLICK, clearAll); import flash.events.MouseEvent; function multiplication(Event:MouseEvent):void{ var num1; capture(); var num2; The clearAll functionrsltclears = num1 *all three text num2; txt3.text = String(rslt); var rslt; fields (txt1, txt2, and} txt3). function capture(){ This is useful for resetting the calculator function division(Event:MouseEvent):void{ num1 = Number(txt1.text); capture(); when the user wantsrsltto= num1 num2 = Number(txt2.text); start/ num2; fresh. } txt3.text = String(rslt); } function addition(Event:MouseEvent):void{ capture(); function clearAll(Event:MouseEvent):void{ rslt = num1 + num2; txt1.text = ""; txt3.text = String(rslt); txt2.text = ""; } txt3.text = ""; } function subtraction(Event:MouseEvent):void{ btAdd.addEventListener(MouseEvent.CLICK, addition); capture(); btMinus.addEventListener(MouseEvent.CLICK, subtraction); rslt = num1 - num2; btTimes.addEventListener(MouseEvent.CLICK, multiplication); txt3.text = String(rslt); btDivide.addEventListener(MouseEvent.CLICK, division); } btClear.addEventListener(MouseEvent.CLICK, clearAll); import flash.events.MouseEvent; function multiplication(Event:MouseEvent):void{ var num1; capture(); var num2; rslt = num1 * num2; var rslt; btAdd: When clicked, the addition txt3.text function is called. = String(rslt); btMinus: When clicked,} the subtraction function is called. function capture(){ function division(Event:MouseEvent):void{ btTimes: When clicked, capture(); num1 = Number(txt1.text); the multiplication function is called. num2 = Number(txt2.text); } btDivide: When clicked, the rslt division = num1 / num2;function is called. txt3.text = String(rslt); btClear: When clicked, function addition(Event:MouseEvent):void{ the } clearAll function is called. capture(); function clearAll(Event:MouseEvent):void{ rslt = num1 + num2; txt1.text = ""; txt3.text = String(rslt); txt2.text = ""; } txt3.text = ""; } function subtraction(Event:MouseEvent):void{ btAdd.addEventListener(MouseEvent.CLICK, addition); capture(); btMinus.addEventListener(MouseEvent.CLICK, subtraction); rslt = num1 - num2; btTimes.addEventListener(MouseEvent.CLICK, multiplication); txt3.text = String(rslt); btDivide.addEventListener(MouseEvent.CLICK, division); } btClear.addEventListener(MouseEvent.CLICK, clearAll); Check the embed option of all the Dynamic Text. There are four Dynamic Text in the pink rectangle: numbers (num1_txt and num2_txt), math operation (oper_txt), and result (result_txt). Select oper_txt, then go to the Properties panel and click on the Embed… button. In the dialog box that will appear, tick the Numerals and Punctuation checkboxes under the Character ranges list to display negative values. Click on OK when done. Do the same for num1_txt, num2_txt, and result_txt. 3. Enter codes for the addition function. Click on add_btn or the “+” sign located at the lower part of the Stage. Then, press F9 to show the Actions panel. Type this code to add the two inputs: add_btn.addEventListener(MouseEvent.CLICK, addition); function addition(event: MouseEvent): void { num1_txt.text = input1_txt.text; num2_txt.text = input2_txt.text; oper_txt.text = "+"; result_txt.text = String(Number(input1_txt.text) + Number(input2_txt.text)); } 4. Enter codes for the the subtraction, division, and multiplication functions. Click on sub_btn, mult_btn, and div_btn or the “-”, “*”, and “/” buttons located at the lower part of the Stage. Then, type the same code in the Actions panel but change the following: instance name function name output symbol displayed by oper_txt.text depending on the selected operation the corresponding operation (-,*,/) used inside result_txt.text Save and publish your work. Save the existing file by selecting the File tab, then clicking on Save. You may also just press the Ctrl + S keys on your keyboard.  To publish your work in the default format, click on File ► Publish. You may also just press the keys, Shift + Alt + F12. To publish your work in a different format, click on File ► Publish Settings… or just press the keys, Ctrl + Shift + F12.  View the output. Press Ctrl + Enter to see your final output. ACTIVITY 2 var firstnum: Number; var secondnum: Number; var answer: Number; var iNum: Number; var op: String; btAdd.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_add); bt7.addEventListener(MouseEvent.CLICK, function fl_MouseClickHandler_add(event:MouseEvent):void fl_MouseClickHandler); { op = "+"; firstnum = parseInt(display.text); function display.text = ""; fl_MouseClickHandler(event:MouseEvent):void } { if (display.text == "0"){ btEquals.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_equals); iNum = parseInt(display.text); iNum = 7; function fl_MouseClickHandler_equals(event:MouseEvent):void display.text = iNum.toString(); { } else { secondnum = parseInt(display.text); display.text = (display.text + "7"); if(op == "+"){ } answer = firstnum + secondnum; } display.text = answer.toString(); } var firstnum: Number; var secondnum: Number; var answer: Number; var iNum: Number; var op: String; btAdd.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_add); bt7.addEventListener(MouseEvent.CLICK, function fl_MouseClickHandler_add(event:MouseEvent):void fl_MouseClickHandler); { op = "+"; function firstnum and secondnum: Store the firstnum = parseInt(display.text); operands for display.text = ""; the calculation. fl_MouseClickHandler(event:MouseEvent):void { } answer: if (display.text == "0"){ Stores iNum = parseInt(display.text); the result of the calculation. btEquals.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_equals); iNum = 7; iNum: Temporarily display.text = iNum.toString(); stores a number for display. function fl_MouseClickHandler_equals(event:MouseEvent):void { } else { secondnum = parseInt(display.text); op:= Stores display.text the operation (display.text + "7"); if(op == "+"){ (+, -, *, or /). } answer = firstnum + secondnum; } display.text = answer.toString(); } var firstnum: Number; var secondnum: Number; var answer: Number; var iNum: Number; var op: String; btAdd.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_add); bt7.addEventListener(MouseEvent.CLICK, function fl_MouseClickHandler_add(event:MouseEvent):void fl_MouseClickHandler); { op = "+"; firstnum = parseInt(display.text); function display.text = ""; fl_MouseClickHandler(event:MouseEvent):void } { Every number (0-9) and operation button (+, -, *, /, =, C) has an if (display.text == "0"){ event listener iNum = parseInt(display.text); attached to it. The event listeners btEquals.addEventListener(MouseEvent.CLICK, are used to fl_MouseClickHandler_equals); iNum detect = 7; mouse clicks, and when a button is clicked, a function fl_MouseClickHandler_equals(event:MouseEvent):void display.text = iNum.toString(); { } elsecorresponding { function issecondnum executed. This listens for clicks on the = parseInt(display.text); display.text = (display.text if(op == "+"){ + "7"); calls the function button bt7 and fl_MouseClickHandler answer = firstnum + secondnum; when the } } button is clicked. display.text = answer.toString(); } var firstnum: Number; var secondnum: Number; If the var answer: display Number; text is "0" (initial state), it updates the display var iNum: Number; to show var op: String; 7. btAdd.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_add); Otherwise, it appends the digit 7 to whatever is already on bt7.addEventListener(MouseEvent.CLICK, the display fl_MouseClickHandler); (concatenating it function as a string). fl_MouseClickHandler_add(event:MouseEvent):void { op = "+"; function firstnum = parseInt(display.text); fl_MouseClickHandler(event:MouseEvent):void display.text = ""; { } if (display.text == "0"){ iNum = parseInt(display.text); btEquals.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_equals); iNum = 7; display.text = iNum.toString(); function fl_MouseClickHandler_equals(event:MouseEvent):void } else { { display.text = (display.text + "7"); secondnum = parseInt(display.text); if(op == "+"){ } answer = firstnum + secondnum; } display.text = answer.toString(); } var firstnum: Number; var secondnum: Number; btAdd.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_add); var answer: Number; var iNum: Number; function fl_MouseClickHandler_add(event:MouseEvent):void var op: String; { op = "+"; bt7.addEventListener(MouseEvent.CLICK, firstnum = parseInt(display.text); fl_MouseClickHandler); display.text = ""; } function btEquals.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_equals); fl_MouseClickHandler(event:MouseEvent):void { function fl_MouseClickHandler_equals(event:MouseEvent):void if (display.text == "0"){ { iNum = parseInt(display.text); secondnum = parseInt(display.text); iNum = 7; Sets the operator (op to +, -, *, or /). if(op == "+"){ display.text = iNum.toString(); answer = firstnum + secondnum; } else { Stores the current display.textnumber (firstnum). = answer.toString(); display.text = (display.text + "7"); } } Clears the display for the next operand. } var firstnum: Number; var secondnum: Number; btAdd.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_add); var answer: Number; var iNum: Number; Gets the second number (secondnum). function fl_MouseClickHandler_add(event:MouseEvent):void var op: String; Performs the corresponding { operation based on the op = "+"; value of op. bt7.addEventListener(MouseEvent.CLICK, firstnum = parseInt(display.text); fl_MouseClickHandler); display.text = ""; Displays the result (answer) on the screen. } function btEquals.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_equals); fl_MouseClickHandler(event:MouseEvent):void { function fl_MouseClickHandler_equals(event:MouseEvent):void if (display.text == "0"){ { iNum = parseInt(display.text); secondnum = parseInt(display.text); iNum = 7; if(op == "+"){ display.text = iNum.toString(); answer = firstnum + secondnum; } else { display.text = answer.toString(); display.text = (display.text + "7"); } } } Thank you for listening!