Create a Flash racing game – Flex version
- July 30, 2010 by Emanuele Feronato
- Filed under Actionscript 3, Flex, Game design, Users contributions | 9 Comments
In the same series:
- Create a Flash Racing Game Tutorial
- Create a Flash Racing Game Tutorial - AS3 version
- Create a Flash Racing Game Tutorial - Artificial stupidity
- Create a Flash racing game - Flex version
Hamilton Lombardi is a brazilian Flex programmer who decided to rewrite the code you can find in the original post for Flex 4.
Moreover he added a splash screen, as you can see:
The source code is clearly formatted and commented as you can see from Level class:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 | package { import flash.geom.*; import flash.media.*; import flash.net.*; import flash.utils.*; import mx.containers.Canvas; import mx.controls.Alert; import mx.controls.Label; import mx.controls.Text; import mx.core.*; public class Level { protected static var instance:Level = null; public static var player:Player = null; public static var track:Track = null; //this is the max number of laps public const totalLaps:Number = 3; // Moment the race started public var initialTime:Date; // Current lap time public var lapTime:Date; // Current fastest lap public var bestLap:Number = 0; // Current lap number public var currentLap:int = 0; // Current checkpoint - 1 Start Line , 2 - Mid track public var currentCheckpoint:int = 1; // History of all the lap times public var raceHistory:String; static public function get Instance():Level { if ( instance == null ) instance = new Level(); return instance; } public function Level(caller:Function = null ) { if ( Level.instance != null ) throw new Error( "Only one Singleton instance should be instantiated" ); } public function startup():void { // Start all clock timers startupTimeClocks(); // Start time display startupTimeDisplay(); // Creates the race track track = new Track(); track.startupTrack(); // Creates the racer player = new Player(); player.startupPlayer(); } public function shutdown():void { } public function enterFrame():void { // Check if the lap had been completed checkPoints(); // Update total race time display setTimes(); } public function setTimes():void { var timeElapsed:Number = 0; var milliseconds:Number = 0; var seconds:Number = 0; var minutes:Number = 0; var minutesTXT:Number = 0; var secondsTXT:Number = 0; var tensTXT:Number = 0; var totalTXT:String; var totalTimeLabel:Label; var timeCanvas:Canvas; // Only starts the timer if the car cross the start line for the first time if (this.currentLap != 0) { //we calculate the time elapsed from the moment the race started in millisecond var thisTime:Date = new Date(); timeElapsed = (thisTime.getTime() - initialTime.getTime()); //we calculate the minutes, seconds and tens of seconds and set them to their respective variables milliseconds = timeElapsed; seconds = Math.floor(milliseconds/1000); minutes = Math.floor(seconds/60); minutesTXT = minutes; secondsTXT = seconds-minutes*60; tensTXT = Math.round((milliseconds-seconds*1000)/10); //if the minutes, seconds or the tens of seconds number has only one character we add a "0" before it - that's just because we want the time to look good ;) if (minutesTXT<10) totalTXT = "0" + minutesTXT; else totalTXT = "" + minutesTXT; if (secondsTXT<10) totalTXT = totalTXT + "." + "0" + secondsTXT; else totalTXT = totalTXT + "." + secondsTXT; if (tensTXT<10) totalTXT = totalTXT + "." + "0" + tensTXT; else totalTXT = totalTXT + "." + tensTXT; //Update total time label timeCanvas = FlexGlobals.topLevelApplication.timeDisplay; totalTimeLabel = (Label) (timeCanvas.getChildByName("totalTimeTXT")); totalTimeLabel.text = totalTXT; } } //and the second function public function setBestLap():void { //this function does the exact same thing as the first one, only here we will use the time elapsed from the last time the car has passed the finish line var currentTime: Date = new Date(); var currentLap:Number = 0; currentLap = currentTime.getTime()- this.lapTime.getTime(); var seconds:Number = 0; var minutes:Number = 0; var minutesTXT:Number = 0; var secondsTXT:Number = 0; var tensTXT:Number = 0; var bestLapTXT:String; var bestLapLabel:Label; var timeCanvas:Canvas; seconds = Math.floor(currentLap/1000); minutes = Math.floor(seconds/60); minutesTXT = minutes; secondsTXT = seconds-minutes*60; tensTXT = Math.round((currentLap-seconds*1000)/10); //if the minutes, seconds or the tens of seconds number has only one character we add a "0" before it - that's just because we want the time to look good ;) if (minutesTXT<10) bestLapTXT = "0" + minutesTXT; else bestLapTXT = "" + minutesTXT; if (secondsTXT<10) bestLapTXT = bestLapTXT + "." + "0" + secondsTXT; else bestLapTXT = bestLapTXT + "." + secondsTXT; if (tensTXT<10) bestLapTXT = bestLapTXT + "." + "0" + tensTXT; else bestLapTXT = bestLapTXT + "." + tensTXT; //we don't calculate the lap time if the car passes the finish/start line for the first time if ( (this.bestLap>currentLap) || (this.bestLap == 0) ) { this.bestLap = currentLap; //Update best lap time label timeCanvas = FlexGlobals.topLevelApplication.timeDisplay; bestLapLabel = (Label) (timeCanvas.getChildByName("bestLapTXT")); bestLapLabel.text = bestLapTXT; } // Save race history if (this.raceHistory == null) this.raceHistory = "Lap: " + this.currentLap + " - " + bestLapTXT + "\n"; else this.raceHistory = this.raceHistory + "Lap: " + this.currentLap + " - " + bestLapTXT + "\n"; //we set the initial time to the moment the car passed the finish line this.lapTime = new Date(); } public function checkPoints():void { var currentLapTXT:String; var currentLapLabel:Label; var timeCanvas:Canvas; var levelEndCanvas:Canvas; var historyText:Text; //we check to see if the car "touches" the checkpoint1 - start/finish line) if (FlexGlobals.topLevelApplication.finishLine.hitTestPoint(player.position.x, player.position.y, true)) { // if (this.currentLap == 0) { this.initialTime = new Date(); this.lapTime = new Date(); this.currentLap = 1; } //if the current checkpoint is the mid track line - increase the lap number if (this.currentCheckpoint === 2) { //check if this is the best lap this.setBestLap(); //if this is the final lap, move to the "finish" frame if (this.currentLap == totalLaps) { historyText = new Text(); historyText.text = this.raceHistory; historyText.x = 10; historyText.y = 115; FlexGlobals.topLevelApplication.currentState = "LevelEnd"; FlexGlobals.topLevelApplication.levelEndCanvas.addChild(historyText); } else { //if the current checkpoint is the start line - increase the lap number this.currentLap++; } currentLapTXT = this.currentLap + "/" + totalLaps; //Update cuurent lap label timeCanvas = FlexGlobals.topLevelApplication.timeDisplay; currentLapLabel = (Label) (timeCanvas.getChildByName("currentLapTXT")); currentLapLabel.text = currentLapTXT; //we set to checkpoint to be checked to the next checkpoint this.currentCheckpoint = 1; } } //we check to see if the car "touches" the checkpoint2 - mid track line) if (FlexGlobals.topLevelApplication.checkpoint.hitTestPoint(player.position.x, player.position.y, true)) { //if the current checkpoint is the start line - reached the mid track point if (this.currentCheckpoint === 1) { //we set to checkpoint to be checked is the next checkpoint this.currentCheckpoint = 2; } } } public function startupTimeClocks():void { this.initialTime = new Date(); this.lapTime = new Date(); this.bestLap = 0; this.currentLap = 0; this.currentCheckpoint = 1; this.raceHistory = ""; } public function startupTimeDisplay():void { var timeCanvas:Canvas; var currentLapLabel:Label; var bestLapLabel:Label; var totalTimeLabel:Label; //Update time display labels timeCanvas = FlexGlobals.topLevelApplication.timeDisplay; currentLapLabel = (Label) (timeCanvas.getChildByName("currentLapTXT")); currentLapLabel.text = (this.currentLap + 1) + "/" + totalLaps; bestLapLabel = (Label) (timeCanvas.getChildByName("bestLapTXT")); bestLapLabel.text = "00.00.00"; totalTimeLabel = (Label) (timeCanvas.getChildByName("totalTimeTXT")); totalTimeLabel.text = "00.00.00"; } } } |
Really a nice conversion.
Download the full source code.
9 Responses
Leave a Reply
TUTORIAL SERIES:
- Una guida completa al gioco del poker online e una selezione dei migliori casino online.
- casino online
- migliori casino online
- BlackJack online
- casinò online

(5 votes, average: 4.80 out of 5)

That IS nice conversion.
But I don’t understand why one would want to code in Flex instead of Flash?
It’s a free alternative to Adobe Flash
Some say it is faster to code in Flex. And you can separate logic from assets. Do your graphics in flash, export and code in flex.
Nice convertion Hamilton!
Nice, but there is a bug : when you finish at last 2 races, the time you took to finish the race is written over the last ones, who are not cleared…
Also, Emenuele, you forgot to mention the tutorial about artificial intelligence :)
ololo google marked you as dangerous site
This is great for the people who don’t have flash, plus it seems to run smoother on my computer too.
BTW, Chrome is giving me a malware warning when I visit this site.
Very good work and thanks for sharing it.
[...] http://www.emanueleferonato.com/2010/07/30/create-a-flash-racing-game-flex-version/ Flex4????:http://www.emanueleferonato.com/wp-content/uploads/2010/07/FlexRacer.zip [...]