post

What Makes a Good iPhone Developer

Long time no updates. Currently I am focusing on my final thesis. Hope I could submit it in June. After that, I will probably become a .NET software engineer, but I will continue to update this blog and develop iPhone apps during my spare time.

Today, I would like to recommend two articles written by MarinTop ten tips to creating profitable iPhone appsand 10 mistakes developers would do.  I still believe technical skill is not the most important factor if you want to make lots of money by creating iPhone apps. What things are more important? You will find answers after you read them.

Posted on 31st May 2011 in iPhone Development  •  No comments yet
post

iPhone Game Kit Review

There is no doubt that Cocos2d can accelerate our game development on iPhone. But do you want to be faster? You may consider iPhone Game Kit.

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 BookiPhone 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 sheetusing 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.

Posted on 21st July 2010 in iPhone Development  •  No comments yet
post

Rope Simulation with Cocos2d and Box2d

This post presents a good idea on how to simulate a rope using the distance joint in Box2d . I re-implemented it using  Cocos2d.  If you have got problems, please refer to that post for more details or leave a comment. In addition, you can also find another way of simulating a rope using Box2d from here.

————————–

Download: You can download source codes from here.

Posted on 5th February 2010 in iPhone Development  •  No comments yet
post

Create Composite Object with Box2D

With Box2D, it’s very easy to create the composite object, which is composed of different standard small objects (e.g, polygon, circle, etc). This feature is useful when the shape of your sprite is complex. In this article, I will present how to achieve it.

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.

Posted on 14th August 2009 in iPhone Development  •  No comments yet
post

Distance Joint of Box2D

In this article, I will present how to create a distance joint with Box2D. The example in my last article How to Use DebugDraw of Box2d with Cocos2d is used as the basis. A box is added to the world, and a distance joint between the box and ball will be created.

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.

Posted on 12th August 2009 in iPhone Development  •  No comments yet
post

How to Use DebugDraw of Box2d with Cocos2d

Cocos2d-iPhone just released v0.8.1-Beta. A great news is DebugDraw of Box2D works with Cocos2d now. I tried DebugDraw with Cocos2d v0.8.0 before, but nothing shows up. In this article, I will briefly introduce how to use DebugDraw with Cocos2d v0.8.1-Beta. Note: The following example is based on the article How to Implement Grabbing a Sprite with Cocos2d and Box2d. I used DebugDraw instead of the ball sprite. Another thing should be noticed is something changed in Box2d. For example, b2Body::CreateShape is removed, you should use b2Body::CreateFixture instead. You can see some changes from the source codes of following example.

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.

Posted on 10th August 2009 in iPhone Development  •  No comments yet
post

How to Implement Grabbing a Sprite with Cocos2d and Box2d

With Box2d,  it’s not difficult to implement an app in which we can grab a sprite with touches. The core function we should use is called mouse joint. In this article, I want to show the basic ideas and steps of implementation. Note: this example is based on one of my previous articles – Cocos2d Example – Box2d. The only difference is I moved the codes regarding to the sprite ball from MyScene to BallLayer.

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 usingAABB 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.

Posted on 5th August 2009 in iPhone Development  •  No comments yet
post

How to Change the Icon of a Project Template

In last article, I presented how to create a Cocos2d project template. In this article, I will show you how to change the icon of a project template. It is a very easy task.

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.

Posted on 31st July 2009 in iPhone Development  •  No comments yet
post

How to Create Your Own Cocos2d Project Template

In this article, I will present how to create your own Cocos2d project template. The version of Cocos2d is 0.8. The approach used in this article can also be applied when creating the project template using other static libraries.

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. DeleteMainWindow.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 filecocos2d-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 hereNote: 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.

Posted on 29th July 2009 in iPhone Development  •  No comments yet
post

How to Install Cocos2d 0.8 Project Template

Step 1: Download Cocos2d 0.8 Beta project template from here. This template works well for 0.8 beta, rc, and final version.

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 withCOCOS2D_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 andChipmunk 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. UnderGeneral, 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 Infoagain. 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?

Posted on 28th July 2009 in iPhone Development  •  No comments yet