Technology Lesson

Review:
Even games with the best of intentions come and go, if they fall short in a couple key areas, to be eventually shuffled off to the graveyard of industry footnotes. A new graphical innovation here, a good sense of humor there, but something just doesnt gel. With Far Cry, however, you can see so many places where things could have gone wrong, but didnt. The AI could easily have been blindly aggressive or stone deaf. The load times could have been constant and distracting. In almost all major areas, Far Cry manages to walk the tightrope of game design over a chasm of Things Gone Wrong. Ive always wondered why no one apparently tried to license the AI of the Marines in Half-Life, because after that, I was always a little bit disappointed with the FPSs that came after. And finally someone has answered the call and the creatures here are actually smart.

Its not all wine and roses, though. Its important to keep in mind that this game is meant to push your rig to its limit. My home system is a 2.4GHz P4 with 512MB of RAM and a 9700 Pro, and while this has been more than enough for 99% of the games Ive played on, with all the details cranked up, its not the case here. I need the full power of the Alienware rig at work, a 3.0GHz P4 with a gigabyte of RAM and a 9800 Pro. The deciding factor seems to be the extra RAM and CPU horsepower, as I can run everything on Very High on this machine, but the home rig has to do Medium and High on most options. However, the many graphical options provide plenty of flexibility. You cant ratchet down view distance, but you can tone down things like dynamic lighting, water effects, and shadows. The game will only load once for each of the enormous areas, and it takes about a minute, but reloading from a save game after dying only takes a few seconds. The system with a gigabyte of RAM did both operations noticeably quicker.


With that said, Far Cry can be an incredibly beautiful game. From the 1-kilometer view distance, to the almost-overflowing foliage, lighting and more, this game is a bullet point list of things youd want a game to be able to do. Im very pleased to say, though, that its more than just a glorified tech demo. It creates a continuous strategic and tactical challenge while wowing my eyeballs with next-generation bells and whistles. There is some clipping--it seems to be unavoidable in a 3D engine--and textures at a distance scale down noticeably even with everything maxed out. Also, youll sometimes see long-range targets fade in as you get close to them. Lastly, lowering some of the graphical settings for the environment can produce foliage popping, where a bush will start out as a flat, basic texture, then sort of spring into a full-fledged, high-detail image as you get close to it. However, the smallest (and most numerous) foliage objects would fade into view as you may have seen in PlanetSide, which is much more transparent for the player. Read more

System requirements:
MINIMUM PC REQUIREMENTS
Windows 98SE/2000/XP
MINIMUM
Pentium III or AMD Athlon 1GHz Processor
256MB RAM
64MB DirectX compatible Video Card
DirectX compatible Sound Card
4X CD-ROM Drive
4GB Hard Disk Space
DirectX 9.0b
RECOMMENDED
Pentium 4 2GHz or AMD Athlon XP 2000+ Processor
512MB RAM
128MB GeForce 4 or ATI Radeon 9500 Class Video Card
Sound Blaster Audigy Series Sound Card
DirectX 9.0b
8X DVD or 32X CD-ROM Drive
4GB Hard Disk Space
MULTIPLAYER SYSTEM REQUIREMENTS

Broadband with 64Kbps Upstream

Screen Shots: Click on the image to view large screen

Exercise File
Start_Quiz_App.fla

In this tutorial, we are going to learn how to create a quiz in Flash using ActionScript 3. Were going to make use of arrays and for loops in order to complete this project.

This tutorial comes with an exercise file (the download link can be found at the top of the article). Lets go ahead and open it and take a look at its contents. This Flash movie has 2 frames. The first frame contains the elements needed for the user to take the quiz. The second frame contains elements that will display the results (answers and scores). The Flash movie should start at frame 1, and stay there until the user finishes answering all the questions. Once the user is done, the Flash movie goes to frame 2 where the answers are checked and the score is given. Since the quiz and the results are separated into two different frames, then the code will be separated as well. Frame 1 will contain the code that is needed to run the quiz (displaying questions and storing the answers submitted by the user), while frame 2 will contain the code that is needed to check the answers, compute the results and display them.

So first, lets go ahead and work on frame 1. Frame 1 contains 3 objects:

1. questions_txt - This is a Dynamic TextField that will be used to display the questions. In the Properties Inspector, this TextField has been set to be multilined.
2. answers_txt - This is an Input TextField where the user will type in the answer. In the Properties Inspector, this TextField has been set to have a border and to be a single line TextField.
3. submit_btn - This button will be used by the user to submit each answer.

The first thing well do is to stop the Flash movie on frame 1. If we dont, then the movie will just continue looping between frames 1 and 2. So select frame 1 of the actions layer, then go to the Actions Panel and put in a stop action.

stop();

Next, lets create a couple of objects:

stop();

var nQNumber:Number = 0;
var aQuestions:Array = new Array();
var aCorrectAnswers:Array = new Array("Jupiter", "Mars", "war", "Titan");
var aUserAnswers:Array = new Array();

What are these instances for?
nQNumber
We will be storing the quiz questions in an array. Each question will therefore be numbered starting at 0. This nQNumber variable will be used to move through each of those quiz questions. After the user answers one question, we will have this number increase by one and use that number to retrieve the next question.

aQuestions
This is the array that will be used to store the questions.

aCorrectAnswers
This is the array that stores all the correct answers. Of course we will have to be the ones to provide what the correct answers are, which is why this array is already populated with values. When the array was created, the values were also declared in the array constructor, therefore populating the array. The first value will have an index of 0, the second value will have an index of 1, and so on... You will notice that the aQuestions array, which is supposed to store the questions, has not been given any values yet. Dont worry, well provide those values shortly using array access notation instead.

aUserAnswers
This array will be used to store the answers given by the user. Each time the user (the quiz taker) submits an answer, then that answer will go into this array. So we just create this array first, but we dont put any values in it initially. Well have to wait for what the user will input in the answer field and use those to populate this array instead.

Next, lets go ahead and create the questions. Weve provided 4 answers when the aCorrectAnswers array was created, so well need to provide 4 questions as well. Make sure that the order of the questions corresponds to the order of the answers as well (question index 0 should match answer index 0, question index 1 should match answer index 1, and so on...). We will populate the aQuestions array using Array Access Notation:

var nQNumber:Number = 0;
var aQuestions:Array = new Array();
var aCorrectAnswers:Array = new Array("Jupiter", "Mars", "war", "Titan");
var aUserAnswers:Array = new Array();

aQuestions[0] = "What is the biggest planet in our solar system?";
aQuestions[1] = "Which planet in our solar system is the 4th planet from the sun?";
aQuestions[2] = "Mars is named after the Roman god of ___.";
aQuestions[3] = "What is the name of Saturns largest moon?";

So now that weve created all the needed objects and have added all the questions and answers for this first part of our project, lets now go ahead and create the actual quiz functionality.

The first thing well do is display the first question in the questions_txt TextField. So what we can do is get aQuestions[0] (the 0 index corresponds to the first item in the array, and therefore the first question) and assign it to the text property of our TextField like so: questions_txt.text = aQuestions[0] . But the problem here is that wed like to be able to update to the next question after the user finishes answering the first one. So instead of manually inputting the index number, we can make use of a variable instead. And then we can just update that variable whenever needed. This is where our nQNumber variable comes in. Initially, it has a value of 0, so typing in questions_txt.text = aQuestions[nQNumber] will be the the same as typing in questions_txt.text = aQuestions[0] . And then later on, well add some code that will increment the value of nQNumber every time the user submits an answer, thereby updating to the next question. But first, update your code so that the first question will be displayed in the questions_txt TextField:

aQuestions[0] = "What is the biggest planet in our solar system?";
aQuestions[1] = "Which planet in our solar system is the 4th planet from the sun?";
aQuestions[2] = "Mars is named after the Roman god of ___.";
aQuestions[3] = "What is the name of Saturns largest moon?";

questions_txt.text = aQuestions[nQNumber];

So now, if you test the movie, you should see the first question displayed in the TextField.

And now that we have that, the next thing we need to fix is how our Flash movie is going to respond whenever a quiz taker types an answer in the input field and clicks on the submit button. So lets break it down. When the user clicks on the submit button, our flash movie should:

1. get the users answer (what he or she inputs in the answer field) and add it to the aUserAnswers array
2. update to the next question

Since we want all this to happen whenever the user clicks on the button, well have to create a CLICK event handler for submit_btn. And lets give the event listener function the name quiz.

questions_txt.text = aQuestions[nQNumber];

submit_btn.addEventListener(MouseEvent.CLICK, quiz);

function quiz(e:MouseEvent):void 
{
     // This function will be responsible for:
     // 1. pushing the users answers to the aCorrectAnswers array
     // 2. updating to the next question
}

Lets first work on how to get the users answer and add it to the aUserAnswers array. To do that, well use the push() method of the array class. Well get the contents of the answers_txt TextField using the text property, and then well pass that to the push() method like so: aUserAnswers.push(answers_txt.text) . So whatever text is inside the answers_txt TextField at the time the submit button is clicked will be added to the aUserAnswers array (the first value that is pushed to the array gets an index of 0, the next one after that will get an index of 1, and so on...). Then after each answer is pushed to the array, make the input TextField blank again, clearing it for the next question. So heres how the updated event listener function will look like:

function quiz(e:MouseEvent):void 
{
     aUserAnswers.push(answers_txt.text);
     answers_txt.text = ""; // This line puts an empty string, making the TextField appear empty again
}

So after the user submits the answer, the next question should then be displayed. To display the next question, well need to retrieve it from the aQuestions array and assign it to the questions_txt TextField. Recall that we used questions_txt.text = aQuestions[nQNumber] (where nQNumber is initially equal to 0) in order to display the first question. The next question that follows has an index of 1. So in order to retrieve that next question, we will need to increment the value of nQNumber by 1 so that it goes from 0 to 1. Once it is incremented, well then assign aQuestions[nQNumber] to the questions_txt TextField once again. And then the next time the user clicks on the submit button, then nQNumber gets incremented by one again, allowing us to retrieve the item with the next index, and so on... Heres the updated event listener function:

function quiz(e:MouseEvent):void 
{
     aUserAnswers.push(answers_txt.text);
     answers_txt.text = "";
     nQNumber++;
     questions_txt.text = aQuestions[nQNumber];
}

But wait! We arent done yet. There are still some fixes that we need to put in this function. Recall that we have a limited number of questions. In this example, we only have 4. A problem will arise when the user clicks on the submit button for the fourth time.

Why will there be a problem? There are 4 questions, so naturally, the user will end up clicking the submit button for a total of 4 times.
Yes that is true. But the 4th time the user clicks on the button, nQNumber will be increased to 4. And recall that our array index numbers start at 0, not at 1. So the last question is actually at aQuestions[3]. And aQuestions[4] is actually for a fifth question. But there is no fifth question, and trying to retrieve one from the array will cause an error.

So what do we do then?
Well need to put an if statement that will tell our Flash movie to no longer try to retrieve any more questions, once we get to the last one.

So lets do that now. We need to get the line questions_txt.text = aQuestions[nQNumber]; and place it in an if statement. The if statement needs to check if nQNumber is less than 4. If nQNumber is still less than 4, then go ahead and retrieve the next question. If it is no longer less than 4, then we dont want our code to retrieve any more questions. So we can type in if(nQNumber < 4) as our condition. But... thats actually not what well do. Instead of typing in 4, well use aQuestions.length instead. The length property of the array class tells us how many items there are in the array. So if an array has 5 items, then the array length will be 5. If it has 6 items, then the length will be 6. In this particular example, our array has 4 items, and therefore has an array length of 4.

Why cant I just type in 4? Is there a benefit to using the length property instead?
Well, no one is stopping you from hard-coding in a value of 4, but the great thing about making use of the length property instead is that if you decide to add more questions (or maybe remove some questions), then you wont have to go back to the if statement and hard-code in a new value. The length property will automatically update itself once you add or reduce items in the array. This will be especially useful if you had numerous items in your code that need to reference how long your array is. Imagine if you hard-coded the data numerous times in different parts of your code. Then every time you decide to add or subtract items to the array, then youll have to go back to all those hard-coded parts of your code, and manually change the value. That would not be very efficient.

So our updated event listener function will now look like this:

function quiz(e:MouseEvent):void 
{
     aUserAnswers.push(answers_txt.text);
     answers_txt.text = "";
     nQNumber++;
     if(nQNumber < aQuestions.length) 
     {
          questions_txt.text = aQuestions[nQNumber];
     }
}

Great! So once the user gets through all the questions, what do we do next?
We then tell the Flash movie to go to the next frame where the user will get the quiz results. To do that, we just add an else clause to our if statement that will instruct our Flash movie to go the the next frame. We will use the nextFrame() method of the MovieClip class to move the playhead to the next frame. So basically, what were telling our Flash movie is that if nQNumber is no longer less than aQuestions.length, then it means that we dont have anymore questions and the quiz is done, and it can now move to frame 2 where the results will be displayed. So finally, our updated event listener function will look like this:

function quiz(e:MouseEvent):void 
{
     aUserAnswers.push(answers_txt.text);
     answers_txt.text = "";
     nQNumber++;
     if(nQNumber < aQuestions.length) 
     {
          questions_txt.text = aQuestions[nQNumber];
     }
     else 
     {
          nextFrame();
     }
}

In the next part of this tutorial, we will work on the code that will display the answers that the user submitted alongside the correct answers. We will also work on the code that will check the answers and calculate and display the users score.

Heres the frame 1 code in full:

stop();

var nQNumber:Number = 0;
var aQuestions:Array = new Array();
var aCorrectAnswers:Array = new Array("Jupiter", "Mars", "war", "Titan");
var aUserAnswers:Array = new Array();

aQuestions[0] = "What is the biggest planet in our solar system?";
aQuestions[1] = "Which planet in our solar system is the 4th planet from the sun?";
aQuestions[2] = "Mars is named after the Roman god of ___.";
aQuestions[3] = "What is the name of Saturns largest moon?";

questions_txt.text = aQuestions[nQNumber];

submit_btn.addEventListener(MouseEvent.CLICK, quiz);

function quiz(e:MouseEvent):void 
{
     aUserAnswers.push(answers_txt.text);
     answers_txt.text = "";
     nQNumber++;
     if(nQNumber < aQuestions.length) 
     {
          questions_txt.text = aQuestions[nQNumber];
     } 
     else 
     {
          nextFrame();
     }
}

NEXT: How to Create a Quiz in Flash - ActionScript 3 Tutorial - PART 2

• Part 1
• Part 2
• Part 3
• Part 4
• Part 5

When you use the drawing tools in Flash, you have the option to draw in two modes: object drawing mode vs merge drawing mode. This article will explain a few of the differences between the two.

Step 1

Create a new Flash document.

Step 2

Select the brush tool. You can use any brush size, color and shape that youd like. But I recommend that you choose a brush size thats not too small so that what you draw will be thicker and more visible. Also, make sure that the color you choose is different from the background color of your document.

Step 3

Once the brush tool is selected, take a look at the toolbar and look for the icon that shows a circle inside a square.


You can click on this button, and it allows you to activate or deactivate the object drawing mode. If the icon appears to look inset, it means that the object drawing mode is ON. If not, then it means that the object drawing mode is OFF, and you are therefore on merge drawing mode instead.


Clicking on this button lets you switch between object mode and merge mode. Check the object drawing mode button in your toolbar to see whether its ON or OFF. If its ON, then click on it to turn it OFF. If not, then leave it as is.

Step 4

The best way to explain the differences between the two drawing modes is to create examples. So make sure that the object drawing mode is OFF. Then draw a line on the left side of the stage using the brush tool.


Now remember, since the object drawing mode is OFF, this means that this line was drawn in merge mode.

Step 5

Now lets switch to the object drawing mode. So this time, make sure that the object drawing mode is ON. And then draw another line on the right side of the stage using the brush tool.


Immediately, youll notice a difference. Youll see that this new line that you drew while you were in the object drawing mode is enclosed in a box. When its enclosed in this box, it means that the artwork is currently selected. And when its selected, this means that you can edit it (e.g. move it, change the color, modify the size). However, when you select something that was drawn in merge mode, it will NOT show a box or a border around it. In the next step, well see what happens instead.

Step 6

Now lets select the other line to see how artwork drawn in merge mode will look like when its selected.

In the toolbar, choose the selection tool (its the black arrow).


Then click on the line that you drew on the left side of the stage in order to select it.


Here, youll see that the selection looks different (click on the image above to enlarge). Instead of being enclosed in a box, youll see dots all over the artwork. So when you see this, this means that you currently have a merge type of drawing selected.

So here we see that object drawings and merge drawings look different from each other when they are selected. This easily lets us know whether something is an object drawing or a merge drawing.

But aside from this, what other differences do they have?
Another difference between a merge drawing and an object drawing is this:

Merge drawing - you have the ability to directly select just a portion of the drawing

Object drawing - if you try to select even just a small portion of the object drawing, the entire object drawing automatically gets selected

To better understand this, lets practice it using our examples on the stage.

Step 7

Make sure youre still using the selection tool. Lets first try to select a portion of the merge drawing on the left side of the stage. To select a portion, use the selection tool, then just click and drag a selection area that covers a small part of the artwork. Refer to the image below as a guide:


Once you release the mouse and youve selected the portion, youll see the dots appear only on top of the part that was selected. So this means that the parts that are not covered with dots are not included in the selection.

Step 8

Now lets edit the currently selected portion.

Go to the toolbar, and select a new color for the selected portion by picking one from the fill color box.


Just click on the color box and select a different color. Youll then see that the new color only applies to the selected portion.


So with merge drawings, you see that we can easily select just a portion of it. The selected portion can then be edited without affecting the rest of the drawing. You can change the selected portions color, modify its shape, move it to a different location, or you can even delete it if youd like.

In the next step, well see if we can do the same thing with the object drawing on the right.

Step 9

So now, while still using the selection tool, well try to select just a portion of the drawing on the right.

Go ahead and click and drag a selection area that just covers a portion of the shape, similar to what we did in step 7.


Once you release the mouse, youll see that even though you selected only a portion of the drawing, the entire shape still gets selected. That is what happens with object drawings. As long as you select even the tiniest portion of the drawing, the entire thing gets selected.

But what can you do if youve got an object drawing, but youd still like to be able to select only a portion of it? The next step will show you how.

Step 10

With object drawings, its still possible to select just a portion of the shape. Theres just an extra step that you have to do.

First, take note of the edit bar, which can be found above the stage. It should say Scene 1.


The edit bar tells you where you are. Right now, you are on scene 1.

Now go ahead and double-click on the object drawing on the right side of the stage.

After you double-click on it, look at the edit bar again. It should now say Scene 1 followed by Drawing Object.


What this means is that you are now inside the drawing object. You should see that you no longer have the box around your drawing. So in a way, its as if you opened the box to get direct access to the artwork inside it. And now that youre inside the box, youll be able to treat the artwork as a merge drawing. So youll now have the ability to select just portions of it instead of the entire shape.

Step 11

Once youre finished editing an object drawing, its important that you go back to the main scene. Otherwise, you might end up inadvertently adding unwanted elements to the object drawing that youre currently editing.

To go back to scene 1, just click on the Scene 1 link in the edit bar.


NOTE: Always be mindful of the edit bar. Its a common mistake for many to accidentally double-click on an object drawing, and then they fail to notice that they are no longer in the main scene, but continue to work as if they are.


In part 2 of this series, well create some object and merge drawing examples using the oval tool.

Today we will start working on an advanced alert manager class for AS3.

The idea behind this tutorial series is to create a flexible AS3 class for displaying alert messages to the users.

The closest thing to this is the Alert class for Flex - however, I think it still lacks a few things. This is why I am writing this class and these articles - to create an universal and customizable class that would provide the developers with ability to quickly implement alert/notice/warning windows in their application.

If you have any additions to the code I provide, have any suggestions or questions - leave a comment. I hope you will find this series useful!

So, lets begin.

Im using FlashDevelop for writing the class, but Ill also use Flash for debugging. The class itself is just a folder of as3 files, but they alone are not viewable without an environment. Thats why well create a new AS3 project as a testing area for our class.

Im using Flash to create a new project and set its main class path to "main" (located under Publish tab in the tool panel). You can, of course, use FlashDevelop or any other IDE to do this.

Next to the Flash file Ill create a new class main.as.

Make the class extend MovieClip and declare a new variable called AlertManager. Set its type to AdvAlertManager. Import com.kircode.AdvAlertManager class. In the constructor, add a listener for ADDED_TO_STAGE event, set its handler to init() function.

In init(), set AlertManager to a new instance of AdvAlertManager. Call its alert() method to display a simple message.


Now create a new folder "com", inside of it add a folder "kircode", and there add a new class callde AdvAlertManager.as:



The class for now will only have a constructor that traces a message that an instance of this class has been created, and a public function alert().

The alert() function will later open a real alert window, but for now let it just trace the message:


And thats all for today!

Its not much yet, but the basis is there.

Thanks for reading!

Ive created a few introductory tutorials on how to get started with Adobe Premiere Pro 1.5. I will be adding more videos to the list.

• 01 Creating a new Adobe Premiere Pro Project
• 02 About the Source View in Adobe Premiere Pro 1.5s Monitor Window
• 03 Importing Files In Adobe Premiere Pro 1.5
• 04 About Adobe Premiere Pro 1.5s Timeline Window
• 05 About the Program View in Adobe