TGB/Tutorials/Alien Invasion

From TDN

    • Making Indie Games has moved to torquescripter.com. Kevin O'Flaherty will upload the images and full tutorial if he finds the files.

The images for your game are in this ** Outdated **!

Contents

Alien Invasion Part 1

The Alien Invasion will consist of two parts. Note the second part doesn't exist yet. The first will be making the UFO move and making our game switch from day to night. The UFO will move side to side and up and down. When it moves left and right it will rotate to make a cool effect in our video game. Let's begin by creating a new project named Alien Invasion Tutorial.

Image:AITutorial1.jpg

Setting Up Our UFO

Download the AlienInvasionImagesPart1.zip at the top and copy all of the images into your images folder. Go back to Torque Game Builder and click the create new ImageMap button. Load the UFO and set it's size to about 3.5 by 9. Set its layer to 10 and check the send and receive collision. Now we need to edit the collision poly. Make it's collision to be about the same as the picture. We will be using the collision to check for people abducted in part 2.

Image:AITutorial2.jpg

Making the behavior for the UFO

Make a new script file and add the following code.

if (!isObject(UFOMovement))
{
  %template = new BehaviorTemplate(UFOMovement);
   
  %template.friendlyName = "UFO Controls";
  %template.behaviorType = "Input";
  %template.description  = "UFO movement control";
   
  %template.addBehaviorField(upKey, "Key to bind to ascend", keybind, "keyboard up");
  %template.addBehaviorField(downKey, "Key to bind to decend", keybind, "keyboard down");
  %template.addBehaviorField(leftKey, "Key to bind to move left", keybind, "keyboard left");
  %template.addBehaviorField(rightKey, "Key to bind to move right", keybind, "keyboard right");
   
  %template.addBehaviorField(VerticalSpeed, "Vertical acceleration", float, 7.5);
  %template.addBehaviorField(HorizontalSpeed, "Horizontal acceleration", float, 15.0);
  %template.addBehaviorField(damping, "Damp movement", float, 5.0);
}

function UFOMovement::onBehaviorAdd(%this)
{
  if (!isObject(moveMap))
    return;

  %this.owner.enableUpdateCallback();
  %this.owner.setDamping(%this.damping);


  moveMap.bindObj(getWord(%this.upKey, 0), getWord(%this.upKey, 1), "moveUp", %this);
  moveMap.bindObj(getWord(%this.downKey, 0), getWord(%this.downKey, 1), "moveDown", %this);
  moveMap.bindObj(getWord(%this.leftKey, 0), getWord(%this.leftKey, 1), "moveLeft", %this);
  moveMap.bindObj(getWord(%this.rightKey, 0), getWord(%this.rightKey, 1), "moveRight", %this);
   
  %this.up = 0;
  %this.down = 0;
  %this.left = 0;
  %this.right = 0;
}

function UFOMovement::onBehaviorRemove(%this)
{
  if (!isObject(moveMap))
    return;

  %this.owner.disableUpdateCallback();
   
  moveMap.unbindObj(getWord(%this.upKey, 0), getWord(%this.upKey, 1), %this);
  moveMap.unbindObj(getWord(%this.downKey, 0), getWord(%this.downKey, 1), %this);
  moveMap.unbindObj(getWord(%this.leftKey, 0), getWord(%this.leftKey, 1), %this);
  moveMap.unbindObj(getWord(%this.rightKey, 0), getWord(%this.rightKey, 1), %this);
   
  %this.up = 0;
  %this.down = 0;
  %this.left = 0;
  %this.right = 0;
}

function UFOMovement::moveUp(%this, %val)
{
  %this.up = %val;
}

function UFOMovement::moveDown(%this, %val)
{
  %this.down = %val;
}

function UFOMovement::moveLeft(%this, %val)
{
  %this.left = %val;
}

function UFOMovement::moveRight(%this, %val)
{
  %this.right = %val;
}

function UFOMovement::onUpdate(%this)
{
  if(%this.right == 1)
  {
    %this.owner.setImpulseForce(%this.HorizontalSpeed,0);
    %this.TargetRotation = 15;
  }
  if(%this.left == 1)
  {
    %this.owner.setImpulseForce(%this.HorizontalSpeed * -1,0);
    %this.TargetRotation = -15;
  }
  if(%this.right == 0 && %this.left == 0)
  {
    %this.TargetRotation = 0;
  }
  if(%this.right == 1 && %this.left == 1)
  {
    %this.TargetRotation = 0;
  }
  if(%this.up == 1)
  {
    %this.owner.setImpulseForce(0 , %this.VerticalSpeed * -1);
  }
  if(%this.down == 1)
  {
    %this.owner.setImpulseForce(0 , %this.VerticalSpeed);
  }
  %this.owner.rotateTo(%this.TargetRotation, 60);
}

Save the file as UFOBehavior.cs. Before you can test out your UFO you have to reload the project in Torque Game Builder so the engine can recognize it. Now that that is done select your UFO and add the UFO Controls by clicking the green plus. Test out your UFO controls.

Let's look at this behavior. We have our standard arrow key which we can use by %this.up, %this.down, %this.left and %this.right. When you press the arrow keys the UFO moves to that direction according to the vertical acceleration and horizontal acceleration. Now let's look at the TargetRotation. When the ship moves left and right it is rotated towards the TargetRotation by the line of code that reads %this.owner.rotateTo(%this.TargetRotation, 60);

Coding the Background - Camera

It is time to add the background which will switch between day and night. This time we will code it first and then add the objects to Torque Game Builder.

The first behavior we will make it a custom scrolling camera that only scrolls left and right according to the UFO's position. Make a new script file and save it as CameraMovement.cs. Add the following code to the script file.

if (!isObject(CameraScrollerX))
{
  %template = new BehaviorTemplate(CameraScrollerX);
   
  %template.friendlyName = "Camera X Scroller";
  %template.behaviorType = "Camera";
  %template.description  = "Camera X Scroller control";
   
  %template.addBehaviorField(MinX, "MinX (no units)", float, -70);
  %template.addBehaviorField(MaxX, "MaxX (no units)", float, 70);
}

function CameraScrollerX::onBehaviorAdd(%this)
{
  %this.owner.enableUpdateCallback();
}

function CameraScrollerX::onBehaviorRemove(%this)
{
  if (!isObject(moveMap))
    return;

  %this.owner.disableUpdateCallback();
}

function CameraScrollerX::onUpdate(%this)
{
  %CameraPointX = %this.owner.getpositionX();

  if(%CameraPointX < %this.MinX)
  {
    %CameraPointX = %this.MinX;
    //makes it so the camera doesn't go off the background
  }
  if(%CameraPointX > %this.MaxX)
  {
    %CameraPointX = %this.MaxX;
  }
  sceneWindow2D.setCurrentCameraPosition(%CameraPointX*  0.5, 0);
  // the * 0.5 makes the camera move a little smoother
  // it also makes the camera move only %50 so if you where to add this code to a platformer delete the 0.5
}

The code above simply moves the camera to the object it is mounted to. It caps out at the MinX and the MaxX. If we tested this code we couldn't tell if it was working because the background is black so let's add the background.

Coding the Background - Moving the Background

Another popular thing to have in scrollers is backgrounds that moves at different rates. Also in this game we will make it so the video game switch between day and night about every minute. Make a new script file and name it Background.cs. Add the following code to it.

if (!isObject(BackgroundBehavior))
{
  %template = new BehaviorTemplate(BackgroundBehavior);
   
  %template.friendlyName = "Background Scroller";
  %template.behaviorType = "Camera";
  %template.description  = "Scrolls the background by the position of the camera";
   
  %template.addBehaviorField(Scroll, "Amount to scroll (0-1)", float, 0.5);
  %template.addBehaviorField(DayNightBool, "Affected by time", bool, 0);
}

function BackgroundBehavior::onBehaviorAdd(%this)
{
  %this.owner.enableUpdateCallback();
}

function BackgroundBehavior::onBehaviorRemove(%this)
{
  if (!isObject(moveMap))
    return;

  %this.owner.disableUpdateCallback();
}

function BackgroundBehavior::onUpdate(%this)
{
  %position = sceneWindow2D.getCurrentCameraPosition();
  %this.owner.setPositionX(%position * %this.Scroll);

  //if affected by time fade to invisible when time gets coloser to 0
  if(%this.DayNightBool)
  {
    %this.owner.setBlendAlpha($Time/1000);
  }
}

Coding the Background - Coding Time of Day

Next we need to make a program that sets the time. We will make a behavior that sets the time of day in our video game. Make a new code file and name it Time.cs. Add the following code to time.cs.

if (!isObject(TimeBehavior))
{
  %template = new BehaviorTemplate(TimeBehavior);
   
  %template.friendlyName = "Time Keeper";
  %template.behaviorType = "Other";
  %template.description  = "Keeps track of the time";
}

function TimeBehavior::onBehaviorAdd(%this)
{
  %this.owner.enableUpdateCallback();
}

function TimeBehavior::onBehaviorRemove(%this)
{
  if (!isObject(moveMap))
    return;

  %this.owner.disableUpdateCallback();
}

function TimeBehavior::onUpdate(%this)
{
  if($TimeOfDay == 0)
  {
    $Time += 1;
    if($Time > 1000)
    {
      $TimeOfDay = 1;
    }
  }

  if($TimeOfDay == 1)
  {
    $Time += -1;
    if($Time == 0)
    {
      $TimeOfDay = 0;
    }
  }
}

Making the Background

Now we can start building our level. First we have to reload the project so Torque Game Builder can recognize our newly added behaviors. Then add the Time Keeper behavior and the Camera X Scroller to the UFO. The camera is a little to close so let's zoom it out. Unselect anything you may have selected. In the Camera Tab change the width and height to 200 by 150.

Now we can start making the level. Click the create new image button and open all the images. All the images you just added are a cell 1 by 2 so make them a cell. Put in the Level1 and move it so the X axis is 0. Then lower the image so only a little of the street is shown in the camera. Set it's layer to 15. Add the background scroller to the town and scroll to 0 and check the DayNightBool so it is affected by time.

Duplicate the town and set it's frame to 1 so the town is blue. Uncheck the DayNightBool and set it's layer to 16. You can now test the game and see it switch from day to night.

Let's add the hills. Add the hills image to the level and set it's position X to 0. Move its Y so it is a little higher than the town. Now add the background scroller behavior to the game and set it's scroll to 0.3 and check the DayNightBool. Set it's layer to 17. Duplicate the object and set the frame to 1 then uncheck the DayNightBool. Set its layer to 18.

Next comes the mountains. Add the mountains image to the level and again set it's position X to 0. Move its Y so it is higher than the hills. Add the background scroller and set the scroll to 0.15 and check the DayNightBool. Set it's layer to 19. Next, duplicate the image and set its frame to 1, uncheck the DayNightBool and set its layer to 20.

Finally we will add the sky. Add the sky image and set it's position to 0,0. Now stretch the X a little so when it scrolls it won't go off the screen. This is something you will have to play the game to set. Add the background scroller and set the scroll to 0.08 and check the DayNightBool. Set its layer to 21. Duplicating the image and set the frame to 1. Set its layer to 22 and uncheck the DayNightBool. Your game should look like the picture below.

Image:AITutorial3.jpg

Making the UFO Change Color

The UFO looks good during the day but we need to make a behavior so it is blue at night. Make a new script file and add the following code to it.

if (!isObject(NightBehavior))
{
  %template = new BehaviorTemplate(NightBehavior);
   
  %template.friendlyName = "Night Behavior";
  %template.behaviorType = "Other";
  %template.description  = "Makes the object blue at night";
}

function NightBehavior::onBehaviorAdd(%this)
{
  %this.owner.enableUpdateCallback();
}

function NightBehavior::onBehaviorRemove(%this)
{
  if (!isObject(moveMap))
    return;

  %this.owner.disableUpdateCallback();
}

function NightBehavior::onUpdate(%this)
{
  %color = $Time * 0.00025 + 0.75;
  %this.owner.setBlendColor(%color, %color, 1);
}

This code makes it so the red and green values are lowered by 25% at midnight. Also if you were to change the length of the time you would also have to change the value that make up the %color variable which is calculated by the formula %color = Time / 1000 * Percentage lowered + Percentage not changed

End of Part I

Now that that is done feast your eyes to a visual display unlike any other. Of course I'm just saying this because we made it but hey, it looks pretty darn good. The second part of this tutorial is coming soon but if you would like to expand this on your own be my guest.

If this tutorial was confusing or if you want to jump start your way into Torque Script, I recommend checking out our Interactive Torque Script Tutorial on torquescripter.com.