Terrain Generation with Cocos2D

Here is some iOS code that allows you to generate your own terrain in a 2d iPhone side-scrolling style game by simply dragging your finger up and down. The possible potential uses are endless. This code uses Cocos2D.




Create a new Cocos2D project and edit HelloWorldScene.h like this:

#import "cocos2d.h"
 
@interface HelloWorld : CCLayer
{
	CGFloat screenWidth, screenHeight;
	float touchPt;
}
 
typedef struct surface {
	float x;
	float y;
} surface;
 
surface *surfaceArray;
 
+(id) scene;
 
@end

Open HelloWorldScene.m and edit the init and dealloc methods, and add the following new methods (draw, ccTouchesBegan, ccTouchesMoved, ccTouchesEnded):

-(id) init
{
	if( (self=[super init] )) {
		CCLabel* label = [CCLabel labelWithString:@"Terrain Test" fontName:@"Marker Felt" fontSize:64];
		CGSize size = [[CCDirector sharedDirector] winSize];
 
		screenWidth = size.width;
		screenHeight = size.height;
 
		label.position =  ccp( size.width/2, size.height/2 );
		[self addChild: label];
 
		// Allocate our surfaceArray
		surfaceArray = (surface *)malloc(((int)screenWidth) * sizeof(surface));
 
		// Init our surfaceArray
		for (int i = 0; i < screenWidth; i++) {
			surfaceArray[i].x = i;
			surfaceArray[i].y = 0;
		}
 
		// If this isn't added, touches won't be recognized
		self.isTouchEnabled = YES;
	}
	return self;
}
 
- (void)draw {
	// Set color to blue
	glColor4f(0.2, 0.4, 0.85, 1.0);  
    glLineWidth(4.0f);
 
	// Loop through each point on the X-axis
	for (int i = 0; i <= screenWidth; i++) {
		// Draw a line from our point straight down
		ccDrawLine( ccp(screenWidth - surfaceArray[i].x, surfaceArray[i].y), ccp(screenWidth - surfaceArray[i].x, -screenHeight) );
 
		// If a point moved offscreen, recycle and respawn it
		if (surfaceArray[i].x > screenWidth) {
			surfaceArray[i].x = 0;
		} else { // If not, move two points to the left
			surfaceArray[i].x += 2;
		}
 
		// If the point is the furthest to the right, relocation its x-axis to the location of our touch
		if (surfaceArray[i].x == 0) {
			surfaceArray[i].y = touchPt;
		}
	}
}
 
-(void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
	UITouch *touch = [touches anyObject];
	CGPoint location = [touch locationInView: [touch view]];
 
	touchPt = location.x;
}
 
-(void)ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
	UITouch *touch = [touches anyObject];
	CGPoint location = [touch locationInView: [touch view]];
 
	touchPt = location.x;
}
 
-(void)ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
	touchPt = 0;
}
 
- (void) dealloc
{	
	free(surfaceArray);
 
	[super dealloc];
}

[Download: Terrain Touch Generator - 541k]

Random Posts:

If you found this useful, shoot me a small donation or at the very least leave a comment, every bit of encouragement helps keep me motivated to update with more content on a regular basis!

Comments

*

5 Responses to “Terrain Generation with Cocos2D”

  1. GamingHorror says:

    How does it perform (especially on the device)? I imagine that drawing 480 lines with an average height of 160 pixels can’t be performing too well. I would try to render it as a filled polygon instead.

  2. Nick Vellios says:

    GamingHorror, thanks for the suggestion. The performance on my iPhone 4 is a solid 60FPS. The simulator varies depending on how many lines are rendered. I have looked into using a shifting polygon shape already. My experience with OpenGL on the iPhone is limited so I am still learning how it all comes together. The point of this was merely a test, a performance test mainly. It is one of several techniques I will apply over the next few weeks and the code to each will surely be posted for all to try.

  3. Nick Vellios says:

    GamingHorror, I’ve been having a hell of a time getting a filled polygon to render in the same way. I can render a solid polygon with a preassigned number of points, but having a tough time manipulating them properly. Might post my code and have my readers dig through it and find my flaw. Still learning Cocos2D and OpenGL so I’ll admit when I don’t know it all. :)

  4. [...] the deal. I wrote a bit of sample code to generate 2D terrain. (See here and here) A fellow blogger and reader pointed out a performance flaw to me and suggested I do it [...]

  5. Sean-o says:

    Sorry for my bad english. Thank you so much for your good post. Your post helped me in my college assignment, If you can provide me more details please email me.

Twitter Me