What is iPhone Game Kit? You may treat it as a higher level game development framework (or engine) which is built upon iPhone SDK and Cocos2d. Developers can use it as a starting point for their iPhone game development.

Why? Normally, it is still difficult for a beginner to complete a relatively complicated game after learning some techniques or doing some tutorials, because they have no ideas where to start and how to utilize the knowledge they have learnt. It is very common that the program written by beginners has a bad or inflexible structure which is difficult to extend or suffers from performance problems. Fortunately, iPhone Game Kit has built up a reliable and flexible framework for you. What you need to do is to fill in your own stuff, and the kit will handle the rest things. The author of iPhone Game Kit, who is Net Weiss, has many years game development experiences on different platforms. He knows what structure that a good game should own. The kit also contains a lot of clear codes you can use or customize , such as Joystick touch control…. The kit will include high resolution support in next version for iPad and iPhone 4, and the guide book will show you how to do that in your development.

Guide Book: iPhone Game Kit also provides a good guide book to teach you how to create a game using this kit. Based on my experience, this guide book is very readable and covers most essential things. You will know the structure of the kit and how the kit works after reading the book. Many parts explain the codes piece-by-piece and show you how to complete a task step-by-step. Of course, for some details you need to explore by yourself, but I don’t think this is difficult when you have a big picture in your head. Surprisingly, this book even covers most essential knowledge of Objective C, which means beginners won’t have difficulties in reading the codes. In addition, this guide book also shows how to create map using Tiled Map Editor, create sprite sheet using Sprite Sheet Maker, and do some simple image processing using Pixen. In a word, the beginner will know the whole story about iPhone game development after reading the book.

Art Works: The kit provides a collection of art files including characters, items, menu graphics and sound effects. These files come from Reiner‘s kind sharing. You can use them for free. I think this is very useful for individual developers.

Publishing Guide: After the developers finish building their games. They need to publish their games to App store. The kit provides a publishing guide to help beginners achieve this.

Where to get it: You can get the game kit from their web site iphonegamekit.com. It has a 50% off discount right now until 1st, September. You don’t have to wait for the newer version because it has free updates for life.

Here I want to use some words from iPhone Game Kit to end this post: “Once you have mastered the Game Kit, you will have a solid foundation to develop games on other platforms and languages“.

Update: The new version 2.0 came out. A new chapter about iOS4 high resolution display and multi-thread programming is added. Now people can use Paypal to make a payment.

Disclaimer: This post is not a commercial ads. The opinions in this post are based on my own research and book reading.

————————–

Download: You can download source codes from here.

Method:

1. Create a body;

2. Using the body to create the shapes of all components.

3. Setup body’s mass.

Example:

int matrix[2][2]=
{
{1,0},
{1,1}
};
 
        b2BodyDef boxBodyDef;
	boxBodyDef.position.Set(150.0f/PTM_RATIO, 400.0f/PTM_RATIO);
	boxBody = world->CreateBody(&boxBodyDef);
 
	for(int i = 0; i<2; i++)
	{
		for(int j=0; j<2; j++) 		{
                     if(matrix[i][j] == 1){
b2PolygonDef* boxShapeDef = new b2PolygonDef;
boxShapeDef->SetAsBox(50.0f/PTM_RATIO/2, 50.0f/PTM_RATIO/2, b2Vec2(i*50.0f/PTM_RATIO,j*50.0f/PTM_RATIO), 0);
				boxShapeDef->density = 1.0f;
				boxShapeDef->friction = 0.3f;
				boxShapeDef->restitution = 0.1f;
				boxBody->CreateFixture(boxShapeDef);
			}
		}
	}
 
	boxBody->SetMassFromShapes();

In the codes above, we created a composite object with the help of an array matrix, its values determines where a box should be added. Another point should be noted is the method SetAsBox. You need to specify the location of the box in local coordinate with the third parameter.

—————————

Download: You can download the source codes from here.

Step 1: Create a box in the physics world. (in the initialization method)

b2BodyDef boxBodyDef;
	boxBodyDef.position.Set(200.0f/PTM_RATIO, 400.0f/PTM_RATIO);
	boxBody = world->CreateBody(&boxBodyDef);
	b2PolygonDef boxShapeDef;
	boxShapeDef.SetAsBox(50.0f/PTM_RATIO/2, 50.0f/PTM_RATIO/2);
	boxShapeDef.density = 1.0f;
	boxShapeDef.friction = 0.3f;
	boxShapeDef.restitution = 0.5f;
	boxBody->CreateFixture(&boxShapeDef);
	boxBody->SetMassFromShapes();

Step 2: Create a distance joint between the box and ball. (in the initialization method)

b2DistanceJointDef dj;
	dj.Initialize(ballBody, boxBody, ballBody->GetPosition(),boxBody->GetPosition());
	dj.collideConnected = true;
	m_distanceJoint = (b2DistanceJoint*) world->CreateJoint(&dj);

Note: the attribute collideConnected determines if the box and the ball collide. If the valie is false, the box and ball will overlap.

All done!

——————————–

Download: You can download the source codes from here.

DebugDraw is a very useful tool for verifying simulating and speeding up your game development. At the initial stage of development, you usually don’t want to think much of graphics, so you can use DebugDraw to help draw physics entities. When you are confident about the game logic, simulation or some other important things, you can use your own pretty sprites to replace DebugDraw.

In order to use DebugDraw, you need two steps:

Step 1: Setup DebugDraw in initialization. To use DebugDraw of Box2d, normally we need to inherit from class DebugDraw and implement our own methods (e.g., DrawPolygon, DrawSolidCircle, etc.) of drawing physics entities.  In Cocos2d, we can easily use GLESDebugDraw instead of implementing our own ones. Therefore, in the initialization function, simply add the following codes:

m_debugDraw = new GLESDebugDraw(PTM_RATIO);
	uint32 flags = 0;
	flags += 1	* b2DebugDraw::e_shapeBit;
	flags += 1	* b2DebugDraw::e_jointBit;
	flags += 1	* b2DebugDraw::e_controllerBit;
	flags += 1	* b2DebugDraw::e_coreShapeBit;
	flags += 1	* b2DebugDraw::e_aabbBit;
	flags += 1	* b2DebugDraw::e_obbBit;
	flags += 1	* b2DebugDraw::e_pairBit;
	flags += 1	* b2DebugDraw::e_centerOfMassBit;
	m_debugDraw->SetFlags(flags);
	world->SetDebugDraw(m_debugDraw);

The value of flags determines what kind of things you want to draw. You can set your own value of flags.

Step 2: Add b2World::DrawDebugData in draw method. In Cocos2d, drawing stuff should be placed in draw method.

-(void) draw{
	[super draw];
	glEnableClientState(GL_VERTEX_ARRAY);
	world->DrawDebugData();
	glDisableClientState(GL_VERTEX_ARRAY);
}

All done!

————————-

Download: You can download the source codes from here.

Step 1: Enable the touch. Add the following line of code into the init function of BallLayer.

isTouchEnabled = YES;

Step 2:  Response the touch begin event by implementing ccTouchesBegan method. In this method, we first need to use the touch position (Note: a coordinate and unit conversion is required) to construct a very small area (the touch position is within this small area). Then we find all the shapes that intersect with this small area using AABB queries (b2World::Query). If such shapes exist, we should get their associated bodies and test whether the body is not static and the touch position is inside the body. The body which is not static and contain the touch position will be selected to create a mouse joint. The codes are as follows:

- (void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
   UITouch* myTouch = [touches anyObject];
   CGPoint location = [myTouch locationInView: [myTouch view]];
   location = [[Director sharedDirector]convertCoordinate:location];
   m_mouseWorld.Set(location.x/PTM_RATIO, location.y/PTM_RATIO);
   if (m_mouseJoint != NULL)
   {
      return;
   }
   b2AABB aabb;
   b2Vec2 d;
   d.Set(0.001f, 0.001f);
   aabb.lowerBound = m_mouseWorld - d;
   aabb.upperBound = m_mouseWorld + d;
   const int32 k_maxCount = 10;
   b2Shape* shapes[k_maxCount];
   int32 count = world->Query(aabb, shapes, k_maxCount);
   b2Body* nbody = NULL;
   for (int32 i = 0; i < count; ++i) 	{
     b2Body* shapeBody = shapes[i]->GetBody();
     if (shapeBody->IsStatic() == false && shapeBody->GetMass() > 0.0f)
     {
          bool inside = shapes[i]->TestPoint(shapeBody->GetXForm(), m_mouseWorld);
          if (inside)
          {
              nbody = shapes[i]->GetBody();
              break;
           }
     }
   }
   if (nbody)
   {
      b2MouseJointDef md;
      md.body1 = world->GetGroundBody();
      md.body2 = nbody;
      md.target = m_mouseWorld;
#ifdef TARGET_FLOAT32_IS_FIXED
      md.maxForce = (nbody->GetMass() < 16.0)? (1000.0f * nbody->GetMass()) : float32(16000.0);
#else
      md.maxForce = 1000.0f * nbody->GetMass();
#endif
      m_mouseJoint = (b2MouseJoint*)world->CreateJoint(&md);
      nbody->WakeUp();
   }
}

Step 3: Response the touch cancelled event by implementing ccTouchesCancelled method. In this method, the created mouse joint is destroyed.

- (void)ccTouchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event {
   if (m_mouseJoint)
   {
      world->DestroyJoint(m_mouseJoint);
      m_mouseJoint = NULL;
   }
}

Step 4: Response the touch move event by implementing ccTouchesMoved method. Get the new touch position, then update the position of the joint bodies (b2MouseJoint::SetTarget).

- (void)ccTouchesMoved:(NSSet*)touches withEvent:(UIEvent*)event{
   UITouch* myTouch = [touches anyObject];
   CGPoint location = [myTouch locationInView: [myTouch view]];
   location = [[Director sharedDirector]convertCoordinate:location];
   m_mouseWorld.Set(location.x/PTM_RATIO, location.y/PTM_RATIO);
 
   if (m_mouseJoint)
   {
      m_mouseJoint->SetTarget(m_mouseWorld);
   }
}

All done!

—————————————

Download: You can download the source codes from here.

Get into the folder of the project template you want to change the icon. Right click the file ___PROJECTNAME___.xcodeproj. You will see the following menu:

Select “Show Package Contents”. A window which contains some files shows up:

What you need to do here is just using your icon to replace the existing icon Templateicon.icns.

Step 1: Download the Cocos2d library from here. Untar the file, then move the folder cocos2d-iphone-0.8 to /Developer/Library. For convenience in following steps, we first add a source entry in xcode Preferences as follows:

Step 2: Make a copy of Window-Based Application Template and name it with “My Cocos2d Application“. On my desktop, Window-Based Application Template locates in folder /Developer/Platforms/iphoneos.platform/developer/library/xcode/project templates/application. Place the copied template My  Cocos2d Application in the same folder.

Step 3: Get into the folder My Cocos2d Application, and open the file ___PROJECTNAME___.xcodeproj. Delete MainWindow.xib from the Resources group because Cocos2d project doesn’t need this nib file.

Step 4: Edit Info.plist file. Remove entry “Main nib file base name”. Add a UIStatusBarHidden entry to hide status bar.

Step 5: Add some required libraries. Double Click the target “___PROJECTNAME___” to open Target Info dialog. Click “+” button under  Linked Libraries. Add the libraries shown below:

Step 6: Go to the folder of Cocos2d library /Developer/Library/cocos2d-iphone-0.8,  drag and drop the file cocos2d-iphone.xcodeproj under “___PROJECTNAME___” on the sidebar. Please don’t check “Copy items into destination group’s fold (if needed)”. Select “Reletive to COCOS2D_SRC” as the Reference Type. The screen shot is shown below:

Then what we need to do is ticking the required Cocos2d static libraries (libChipmunk.a, libcocos2d.a, libbox2d.a) as shown below:

Step 7: Add Dependencies. Double click the target “___PROJECTNAME___” to open Target Info dialog. Click “+” button under Direct Dependencies. Add box2d, Chipmunk, cocos2d to the dependency list.

Step 8: Add “User Header Search Paths“. Double click “___PROJECTNAME___” to open project Info dialog. Under Build Tab, double click “User Header Search Paths” and you will see the following dialog. Add the same path shown in the picture.

Step 9: Updating the codes. The codes actually depend on your requirements. You can download an example of files main.m and ___PROJECTNAMEASIDENTIFIER___AppDelegate.m from here. Note: updating the main function in main.m is necessary.

int main(int argc, char *argv[]) {
	NSAutoreleasePool *pool = [NSAutoreleasePool new];
	int retVal = UIApplicationMain(argc, argv, nil, @"___PROJECTNAMEASIDENTIFIER___AppDelegate");
	[pool release];
	return retVal;
}

Step 10: Add fps_images.png to Resources.

All done! Now you can create a new Cocos2d project with the project template you just created.

Step 2: Unzip the downloaded file in Step 1. Move the the folder to project templates folder. On my desktop, this folder’s location is /Developer/Platforms/iphoneos.platform/developer/library/xcode/project templates/application.

Step 3: Download Cocos2d Library from here. Untar the file, then move the folder to /Developer/Library.

Step 4: Under xcode – Preferences – Source Trees, add a source record. You can set the setting name with COCOS2D_SRC. The path is the location of Cocos2d Library, which is /Developer/Library/cocos2d-iphone-0.8/

Step 5: Now, you can create a Cocos2d project in xcode. The Dependency and Linked Library of cocos2d and Chipmunk have been added to the project by default.

Step 6: If you want to use other libraries (e.g., Box2d, etc) integrated in cocos2d, please follow the steps below.

Step 7: Add Direct Dependency. After a new project is created, right click the target and select Get Info. Under General, click the ‘+’ button of Direct Dependencies. You will see a list of target dependencies, just add the dependency you want (e.g., box2d). This step can guarantee the static library always exists (if not, the compiler will build one).

Step 8: Build the project. The dependency you added in Step 7 was built up in this step.

Step 9: Add the Linked Static Library to the project. built up in Step 8. Right click the target and select Get Info again. Under General, click the ‘+’ button of Linked Libraries. In the popped-up library list, you can’t  find the library built up in Step 8. You need to click “Add Other” button. Then you need to find the library yourself. The library just built up is under the folder /Developer/Library/cocos2d-iphone-0.8/build/Debug-iphonesimulator. Select the library you just built up (e.g., libbox2d.a). Now, the library has been added to the project. Click cocos2d-iphone.xcodeproj on the left side, find the target (i.e., Static Library) you want to add from the file list on the right hand side. Just simply tick the target (e.g., libbox2d.a) as shown below:

All done!

———————–

Update: In the future, if a newer version of Cocos2d is released, what you need to do is just to replace the old Cocos2d library with the new one. You don’t need to update the template. It’s very easy, isn’t it?

Method 1 – Define collision groups with group index. The shapes which are in the same group and have positive (negative) index will always (never) collide with each other. This is the simplest way to define what kind of shapes can collide with each other, but it has limitations. Collisions between the shapes which are in the different groups need to be filtered in other ways.

Example: In our previous example, if we want the ball doesn’t collide with the ground, we can just add the following codes in the initialization:

groundShapeDef.filter.groupIndex = -1;

ballShapeDef.filter.groupIndex = -1;

Method 2 – Define category and mask bits. This method is a little more complex than Method 1, but it can filter the collision not only between the shapes in the same category, but also between the shapes in different categories.

Example:

groundShapeDef.filter.categoryBits = 0×0002;
groundShapeDef.filter.maskBits = 0×0008;

ballShapeDef.filter.categoryBits = 0×0008;
ballShapeDef.filter.maskBits = 0×002;

With the codes above, the ball will collide with the ground, but the balls will not collide with each other.

Method 3 – Implementing our own contact filtering function. We need to derive from class b2ContactFilter and implement the method ShouldCollide. From the documentation, you can see the default behavior of method ShouldCollide. It can be seen that group filtering (Method 1) has higher precedence than category filtering (Method 2).