{"id":1280,"date":"2009-01-07T08:04:50","date_gmt":"2009-01-07T12:04:50","guid":{"rendered":"http:\/\/www.mrsunstudios.com\/?p=1280"},"modified":"2022-05-29T08:23:32","modified_gmt":"2022-05-29T12:23:32","slug":"tutorial-create-a-game-like-winter-bells-in-as3-part-4","status":"publish","type":"post","link":"http:\/\/www.mrsunstudios.com\/blog\/flash\/tutorial-create-a-game-like-winter-bells-in-as3-part-4\/","title":{"rendered":"Tutorial: Create a Game Like Winter Bells in AS3 – Part 4"},"content":{"rendered":"
\n
    \n
  1. Basic Character Programming<\/a><\/li>\n
  2. Programming the “Bells”<\/a><\/li>\n
  3. Level Creation<\/a><\/li>\n
  4. Scoring<\/a><\/li>\n
  5. Finishing Touches<\/a><\/li>\n<\/ol>\n<\/div>\n

    Step 4: Scoring<\/h3>\n

    Now, we get to score this game. In addition to adding a score, we’re also going to add a few other components, including displaying the points each bell is worth, as well as the game over stuff. Shall we begin?<\/p>\n

    Let’s first do the score, since that’s the easiest. Define these variables at the top of your code:<\/p>\n

    \r\nvar score:int = 0;\/\/you know what this is\r\nvar scoreInc:int = 0;\/\/how many points the bell is going to be worth\r\n<\/pre>\n
    Now, find the code in “Bell.as” where the bell is hit by mcMain<\/tt>. Add this code to that:<\/p>\n
    \r\n_root.scoreInc += 10;\/\/increase the amount that the score will increase\r\n_root.score += _root.scoreInc;\/\/add this to the score\r\n<\/pre>\n
    Next, find the code where the bird is hit by mcMain<\/tt>.  Double the score in that part of the code with _root.score *= 2<\/tt><\/p>\n
    Congratulations, we’ve just scored our game! That was the easy part. Now, we have to actually display what each bell is worth after hitting it. In order to do this, we’re going to have to create a new MovieClip. The only thing that’s going to be inside it is a dynamic textfield. Also, when you convert it into a MovieClip, Export it for ActionScript as the class, ScoreAdd<\/tt>, would you now?<\/p>\n
    Give the dynamic textfield an instance name of txtScore<\/tt>, and set it to 18 point font Arial. Also, you should embed the font, just in case.<\/p>\n
    Now, create a new layer within that MovieClip and add the following code to it:<\/p>\n
    \r\nvar timeLeft:int = 12;\/\/how many frames are allowed to pass before it disappears\r\n\r\nthis.addEventListener(Event.ENTER_FRAME, timeCheck);\r\n\r\nfunction timeCheck(e:Event):void{\r\n\tthis.timeLeft --;\/\/decrease the amount of time\r\n\tif(this.timeLeft == 0){\/\/if time is up\r\n\t\tthis.parent.removeChild(this);\/\/then remove this\r\n\t}\r\n}\r\n<\/pre>\n
    Now, let’s add this to the stage whenever mcMain<\/tt> hits a bell. Place this code in the hitTestObject<\/tt> for mcMain<\/tt> in “Bell.as”:<\/p>\n
    \r\nvar scoreText:ScoreAdd = new ScoreAdd();\r\n_root.bellHolder.addChild(scoreText);\/\/add some text to the stage\r\nscoreText.x = this.x;\/\/set the coordinates for the text\r\nscoreText.y = this.y;\r\nscoreText.txtScore.text = _root.scoreInc;\/\/set the text to the amount the score increased by\r\n<\/pre>\n
    Do something similar for the bird:<\/p>\n
    \r\nvar scoreText:ScoreAdd = new ScoreAdd();\r\n_root.bellHolder.addChild(scoreText);\/\/add some text to the stage\r\nscoreText.x = this.x;\/\/set the coordinates for the text\r\nscoreText.y = this.y;\r\nscoreText.txtScore.text = 'Double Score';\/\/show that the score was doubled\r\nthis.removeEventListener(Event.ENTER_FRAME, eFrame);\/\/remove the listeners\r\n_root.bellHolder.removeChild(this);\/\/and finally remove him from the stage\r\n<\/pre>\n
    Now, we must display the score to the user. Just add a dynamic text field to the top of the stage with an instance name of txtScore<\/tt>. Now, in the eFrame()<\/tt> function, just set the text to \"Score:  \"+score<\/tt>.<\/p>\n
    The final task that we must complete is what happens when the user finally falls. To do this, we’re going to have to create some more variables:<\/p>\n
    \r\nvar gameOver:Boolean = false;\/\/if game has been finished\r\nvar fallingTime:int = 0;\/\/how long the main guy has been falling down\r\n<\/pre>\n
    Before we go any further, add the following code to the eFrame()<\/tt> functions of both the bell and the bird:<\/p>\n
    \r\nif(_root.gameOver){\/\/if the game is over\r\n\tthis.removeEventListener(Event.ENTER_FRAME, eFrame);\/\/remove the listeners\r\n\t_root.bellHolder.removeChild(this);\/\/and remove from stage\r\n}\r\n<\/pre>\n
    This will help us later. Next, find this code in the moveScreen()<\/tt> function:<\/p>\n
    \r\nif(mcMain.y >= 275 && totalHeight >= 275){ \/\/if mcMain is above a certain point and the screen has been moved up\r\n\tbellHolder.y -= jumpSpeed;\/\/make bellHolder go back down\r\n\tbellTop += jumpSpeed;\/\/as well as the creation point\r\n\tmcMain.y = 275;\/\/keep mcMain's y stationary until it is done falling\r\n}\r\n<\/pre>\n
    Change it to this:<\/p>\n
    \r\nif(mcMain.y >= 275 && totalHeight >= 275){ \/\/if mcMain is above a certain point and the screen has been moved up\r\n\tbellHolder.y -= jumpSpeed;\/\/make bellHolder go back down\r\n\tbellTop += jumpSpeed;\/\/as well as the creation point\r\n\tmcMain.y = 275;\/\/keep mcMain's y stationary until it is done falling\r\n\t\r\n\tfallingTime ++;\r\n\t\r\n\tif(fallingTime >= 12){\r\n\t\tgameOver = true;\r\n\t}\r\n}\r\n<\/pre>\n
    We have to do this so that if the player gets up really high and falls, there won’t be any more bells to catch him\/her and delay the end of the game.<\/p>\n
    Now, add _root.startedJumping = true;<\/tt> to where the bell and bird hit test for mcMain<\/tt>.<\/p>\n
    Next, add this code to the part of the mainJump()<\/tt> function where we check if he’s touching the ground. Change it to this:<\/p>\n
    \r\nif(startedJumping){\/\/if the main has begun jumping\r\n\tgameOver = true;\/\/then finish the game\r\n\tshowFinalStats();\/\/and show the poor kid their stats\r\n}\r\nmainJumping = false;\r\n<\/pre>\n
    We have to define the showFinalStats()<\/tt> function at the end of the code, but let’s first create a MovieClip that will pop up with the stats. Create a gray 300×250 sized square as a background for this MovieClip. Then, add some text like “Here is your final score:”. Then add a dynamic textfield with an instance name of txtFinalScore<\/tt> below and a “Play Again?” button below that with an instance name of btnPlayAgain<\/tt>. This is what mine looks like:<\/p>\n
    <\/center><\/p>\n
    Now, add the following code to the bottom of everything:<\/p>\n
    \r\nvar finalScreen:mcFinalStats = new mcFinalStats();\r\n\r\nfunction showFinalStats():void{\r\n\t\/\/attach the final screen to the stage:\r\n\taddChild(finalScreen);\r\n\t\/\/setting the coordinates\r\n\tfinalScreen.x = 115;\r\n\tfinalScreen.y = 75;\r\n\tfinalScreen.txtFinalScore.text = String(score);\/\/showing the score\r\n\tfinalScreen.btnPlayAgain.addEventListener(MouseEvent.CLICK, clickPlayAgain);\/\/when user clicks on the button\r\n}\r\n\r\nfunction clickPlayAgain(e:MouseEvent):void{\r\n\t\/\/reset everything\r\n\tremoveChild(finalScreen);\r\n\tgameOver = false;\r\n\tstartedJumping = false;\r\n\tscore = 0;\r\n\tscoreInc = 0;\r\n}\r\n<\/pre>\n
    Well, now we can be jubilant, for we are soon finished with this game. Next time, we’ll just fix some issues and add some extras to the game. Join us!<\/p>\n
    The Final Product<\/h4>\n
    <\/embed><\/object><\/p>\n
    Source Files (zipped)<\/a><\/center><\/p>\n","protected":false},"excerpt":{"rendered":"
    Basic Character Programming Programming the “Bells” Level Creation Scoring Finishing Touches Step 4: Scoring Now, we get to score this game. In addition to adding a score, we’re also going to add a few other components, including displaying the points each bell is worth, as well as the game over stuff. Shall we begin? Let’s […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5,8,4,6,68],"tags":[8,233,235,18,68,234,236,11,232],"_links":{"self":[{"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/posts\/1280"}],"collection":[{"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/comments?post=1280"}],"version-history":[{"count":3,"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/posts\/1280\/revisions"}],"predecessor-version":[{"id":1339,"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/posts\/1280\/revisions\/1339"}],"wp:attachment":[{"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/media?parent=1280"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/categories?post=1280"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.mrsunstudios.com\/blog\/wp-json\/wp\/v2\/tags?post=1280"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}