Introduction

This tutorial is an add-on to the Simulator Test tutorial. We will be picking up where we left off previously. This saves us the time of having to create a new project from scratch. Open up the TouchGame.t2dproj you created previously. If you do not know how to do this, click here.

Creating Behaviors

One of the coolest and most useful TGB features is the Behavior System. Behaviors are script files you develop, which contain functionality that can be dropped onto any object. We are going give each of our sprites a behavior.

In the future, you can create your own behaviors. For now, I'm going to provide you with two. Start by copying the text found below.

//-----------------------------------------------------------------------------
// Torque Game Builder
// Copyright (C) GarageGames.com, Inc.
//-----------------------------------------------------------------------------

if (!isObject(MouseDraggableBehavior))
{
   %template = new BehaviorTemplate(MouseDraggableBehavior);
   
   %template.friendlyName = "Mouse Draggable";
   %template.behaviorType = "Input";
   %template.description = "Make an object draggable by the mouse";
   
   %template.addBehaviorField(centerOnMouse, "Center the object on the mouse", bool, false);
   %template.addBehaviorField(toggleDragState, "Start dragging on one click, stop dragging on the next click", bool, false);
}

function MouseDraggableBehavior::onBehaviorAdd(%this)
{
   %this.dragging = false;
   %this.cancelOnMouseUp = true;
   %this.offset = "0 0";
   %this.owner.setUseMouseEvents(true);
}

function MouseDraggableBehavior::onMouseDown(%this, %modifier, %worldPos)
{
   // Toggle the drag status.
   %this.dragging = !%this.dragging;
   
   // We always stop dragging on mouse up unless the toggle option is set.
   %this.cancelOnMouseUp = !%this.toggleDragState;
   
   // Schedule this or else we'll get two onMouseDowns. One for the locked
   // objects, and again for the not locked objects.
   %this.owner.schedule(0, setMouseLocked, %this.dragging);
   
   if (!%this.centerOnMouse)
      %this.offset = t2dVectorSub(%this.owner.position, %worldPos);
}

function MouseDraggableBehavior::onMouseUp(%this, %modifier, %worldPos)
{
   if (%this.cancelOnMouseUp)
   {
      %this.dragging = false;
      %this.owner.setMouseLocked(false);
   }
}

function MouseDraggableBehavior::onMouseDragged(%this, %modifier, %worldPos)
{
   if (%this.dragging)
   {
      %this.moveToMouse(%worldPos);
      
      // Once we have dragged, then dragging will always stop on mouse up.
      %this.cancelOnMouseUp = true;
   }
}

function MouseDraggableBehavior::onMouseMove(%this, %modifier, %worldPos)
{
   if (%this.dragging)
      %this.moveToMouse(%worldPos);
}

function MouseDraggableBehavior::moveToMouse(%this, %worldPos)
{
   %this.owner.position = t2dVectorAdd(%worldPos, %this.offset);
}

Next, you will need to save it to a file. In the TouchGame/game/behaviors directory, create a file called mouseDraggable.cs. The .cs extension is vital, so make sure it saves that way. Copy the above text into your new behavior file. Make sure you save, and let's get one more:

//-----------------------------------------------------------------------------
// Torque Game Builder
// Copyright (C) GarageGames.com, Inc.
//-----------------------------------------------------------------------------

if (!isObject(FaceObjectBehavior))
{
   %template = new BehaviorTemplate(FaceObjectBehavior);
   
   %template.friendlyName = "Face Object";
   %template.behaviorType = "AI";
   %template.description  = "Set the object to face another object";

   %template.addBehaviorField(object, "The object to face", object, "", t2dSceneObject);
   %template.addBehaviorField(turnSpeed, "The speed to rotate at (degrees per second). Use 0 to snap", float, 0.0);
   %template.addBehaviorField(rotationOffset, "The rotation offset (degrees)", float, 0.0);
}

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

function FaceObjectBehavior::onUpdate(%this)
{
   if (!isObject(%this.object))
      return;
   
   %vector = t2dVectorSub(%this.object.position, %this.owner.position);
   %targetRotation = mRadToDeg(mAtan(%vector.y, %vector.x)) + 90 + %this.rotationOffset;
   
   if (%this.turnSpeed == 0)
      %this.owner.setRotation(%targetRotation);
   else
      %this.owner.rotateTo(%targetRotation, %this.turnSpeed, true, false, true, 0.1);
}

Copy the above text into a new behavior file called faceObject.cs. Save it to the same location as the previous behavior. MouseDraggable will allow us to click on our sprite and drag it around the screen. FaceObject will cause the other sprite to rotate in place, constantly facing the object we are dragging.

Adding Behaviors

Back in TGB, click on the pointy sprite that looks like a shuriken. In the top right, you'll see three tabs (Shown in Figure 1). Click on the Edit tab, then scroll down to the Behaviors section (Shown in Figure 2).

Figure 1


Figure 2

Click the drop down menu and click the MouseDraggable behavior (Shown in Figure 3). You still need to click the green (+) button to add the behavior, which will finalize your selection (Shown in Figure 4).

Figure 3


Figure 4

While you still have the the shuriken selected, scroll through the Edit tab until you find the Scripting rollout. Give the sprite the name "Shuriken", (Shown in Figure 5).

Figure 5

Next, select the circular sprite. Just as you did with the shuriken, go to the behavior section, find the FaceObject behavior, and add it to the object (Shown in Figure 6). In the object field for the behavior, type in the name of the object you want this sprite to face (Shuriken in this case). Go ahead and press the Play Scene button to see how your new behaviors work. You should be able to drag around the Shuriken, while the circle follows your movement (Shown in Figure 7)

Figure 6


Figure 7

Testing Your New Game

It's time to back into the compiler. Open the engine/compilers/xCode_iPhone/Torque2D.xcodeproj file. Once you are in, you will want to perform a full clean (Shown in Figure 8). You will be prompted with a dialog to confirm the cleaning (Shown in Figure 9(.


Figure 2


Figure 3

Once the clean is complete, Build and Go. If all went well, no errors in the solution, your iPhone simulator should pop up with your new game (Shown in Figure 10). You should now be able to "touch" and drag the shuriken object on the screen. Congrats!

Figure 10

Conclusion

What you've learned how to do is create a behavior, add it to an object in TGB, then test the game in your iPhone simulator. More advanced tutorials are on the way!