A fast, easy to use, free, and community supported 2D game engine
RishabhShah
Member
hello Friends,
Is anyone here familiar with "adding game levels"?
i want to make game with different levels. In game i have sprites at some specific position. now i want to change the position of sprites for each level and i want the logic(action) on sprite will remain same for all level. how is it possible? any ideas?
Is there any example or logic? and guys please explain me in details because i am new to cocos2d.
Duckwit
Member
Lately I have been working on a level editor for my game, created using Cocos2d-mac.
What I am doing is giving each object a unique integer id (e.g. 1,2, 47, 99, 32) and using the editor to place objects from a selectiojn panel onto a grid.
The application will then save the positions and IDs of each object into a JSON string, which will be parsed into the iPhone game to load levels with items at specific positions.
What you need, basically, is the following:
1. Some way of inserting object positions, whether it be manually typing them, using an exisiting editor (e.g. Tiled) or creating your own.
2. A data format for storing the positions in the game. (e.g. property lists (.plist), JSON, etc...)
3. Code to interpret this data and load objects into the game for each level.
For example (psuedo code) you would have a loop to instantiate your objects:
for (int i = 0;i < [number of objects for this level];i++) {
MyObject* object = [Myobject objectWithPosition:[get Position from data]];
[arrayOfObjects addObject:object];
}This is a very general approach and doesn't cover specifics for creating levels and it only covers one certain approach, which might not suite what you want to do.
If you want specific help with an approach to creating levels, be more detailed in your topic posts - or else you are likely to either not get a response or get answers you aren't at all interested in.
Nexus6
Member
I'm using Inkscape to manage my levels. Some time ago i wrote a post on another forum, you will find a lot of working code in this thread and also a video showing how it work.
If you adopt that code use the one posted from WhiteGollum, because it manage the rotation of the objects as well.
Tiled is a great choice too, depending the kind of game. You don't have that much freedom, but still pretty ok for many of your needs.
When I started development of my first title, I didn't know what to do, as far as level creation went. I tried several different things, and eventually used the Tiled tilemap editor for all of my objects and level design, and created a parser from scratch that met my needs.
Of course, I want to make a much more robust system in the future for level generation, but I don't think that's necessary for this particular game.
RishabhShah
Member
Thanks all of you for responding my question.
@Nexus6 : i am very new to Inkscape. i don't know how to import svg file in cocos2d and nothing about Inkscape and also how svg file does work in cocos2d. how to do parsing of svg file in cocos2d? is there any beginner tutorial for Inkscape? And i want tutorial only for cocos2d... i don't want to use chipmunk and box2d.
@RishabhShah, did you follow the link @Nexus6 posted? It provides the code you need to parse the SVG file within your project.
Just include the SVG file within your project, include the code listed and then create your objects based on the tags you interpret from the XML.
The parsing of the XML is simply done in Xcode, regardless of wether you are using Cocos2D or not.
When you use Inkscape to create your object, look at the object properties. You then set a value against the LEVEL label (example #brick, #tree, #car, etc) to create the object you desire.
When the XML is parsed, examine the value for key inkscape:label. When you have this, then the properties that follow relate to that object.
Here is an cut-down version of what I do to parse the XML from the SVG file to create my objects.
-(void) parseXML {
// Parse the SVG level
int lvlNo = 100 + [GameManager sharedGameManager].activeLevel;
NSLog(@"SVG Level Builder Initiated.");
for (int i=lvlNo; i<lvlNo+1; i++) {
NSString *filePath = [[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"level%i",i] ofType:@"svg"];
NSXMLParser *parser;
parser = [[NSXMLParser alloc] initWithData:[NSData dataWithContentsOfFile:filePath]];
[parser setDelegate:self];
[parser parse];
}
}
- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName attributes:(NSDictionary *)attributeDict{
// Parsing the SVG
NSString *transform;
if ([elementName isEqualToString:@"g"]) {// Get the document transformation values
transform = [attributeDict valueForKey:@"transform"];
NSString *transformString = [transform substringToIndex:[transform length] - 1];
transformString = [transformString substringFromIndex:10];
} else if ([elementName isEqualToString:@"image"]) {// Get the Images
NSString *type = [attributeDict valueForKey:@"inkscape:label"];
NSString *numType = [type substringFromIndex:1];
int tln = [numType intValue]; // Object type
float x = [[attributeDict valueForKey:@"x"] floatValue];
float y = [[attributeDict valueForKey:@"y"] floatValue];
float width = [[attributeDict valueForKey:@"width"] floatValue];
float height = [[attributeDict valueForKey:@"height"] floatValue];
// Calculate centre of image
int iX = (x + width/2);
int iY = y - (height/2);
[self createLayerObject:tln withX:iX withY:iY withZ:9]; // This is the method called to create my object
}
}
- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName{
//
}
- (void)parser:(NSXMLParser *)parser foundCharacters:(NSString *)string{
//
}
- (void) parserDidEndDocument:(NSXMLParser *)parser{
NSLog(@"SVG Level Builder Terminated.");
}When you create your game object, create it as you would normally within your game. If you are not using any physics, etc, then you may just simply be adding sprites etc as child items to the layer.
You also need to make sure that you make reference to the correct delegate methods for your layer.
@interface GameLayer () <NSXMLParserDelegate>
Hope that helps.
Tony B
RishabhShah
Member
@vishesh.l : its okay with your post. and i know how to add sprites and how to do action on the sprite but i don't have any idea about svg. so i am asking this type of question.
In Details,
suppose we use one rectangle object in inkscape named #block. and we parse the svg file using @breskit post. so, i am asking that how to do action on this object(#block)?
In @breskit post, he used [self createLayerObject:tln withX:iX withY:iY withZ:9]; for creating object.
if we use physic engine then we can create block by using,
CMBody *squareBody = [mSpace addBodyWithMass:5 moment:0];
[squareBody setPositionUsingVect:position];
[squareBody addToSpace];
CMShape *squareShape = [squareBody addRectangleWithWidth:width height:height];
[squareShape setElasticity:0.5];
[squareShape setFriction:0.5];
[squareShape addToSpace];
but i am using simple cocos2d, so how can i create block?
All you need to do in order to create your objects is to inspect the value that gets assigned to 'tln' (in my example) and then act accodingly.
So, when you call the method createLayerObject, just inspect the values passed in and act accordingly.
Here's a small example.
-(void) createLayerObject:(int)tln withX:(int)xcoord withY:(int)ycoord wDepth:(int)opt1 {
switch (tileid) {
case 1:
// call method to create BLOCK object
break;
case 2:
// call method to create TREE object
break;
default:
break;
}
}Within the SWITCH statement, simply have enough cases for each type of object you wish to create.
RishabhShah
Member
@breskit : thanks a lot man. you are awesome.
How to create BLOCK object in cocos2d or how to detect any action on this object? which method is used to create block object in cocos2d? because i am not using any physics engine.
Sorry for asking question again and again but i am getting little bit confuse.
The method you use to create the object is for you to write. You need to ask yourself how this object will work.
In the project I am working on I am using Chipmunk to apply my physics, so in my method to create an object I create the Chipmunk body, add it to the chipmunk space, define the sprite I'm using, set it's location, etc. I have separate methods to detect collisions between the Chipmunk bodies.
You will need to do something similar.
RishabhShah
Member
This is my code and i am using cocos2d simple engine.
-(id) init
{
// always call "super" init
// Apple recommends to re-assign "self" with the "super" return value
if( (self=[super init])) {
NSLog(@"SVG Level Builder Initiated.");
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"level_01" ofType:@"svg"];
parser = [[NSXMLParser alloc] initWithData:[NSData dataWithContentsOfFile:filePath]];
[parser setDelegate:self];
[parser parse];
}
return self;
}
- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName attributes:(NSDictionary *)attributeDict{
// Parsing the SVG
NSString *transform;
if ([elementName isEqualToString:@"g"]) {// Get the document transformation values
transform = [attributeDict valueForKey:@"transform"];
NSString *transformString = [transform substringToIndex:[transform length] - 1];
transformString = [transformString substringFromIndex:10];
NSArray *transformCoords = [transformString componentsSeparatedByString:@","];
transformX = [[transformCoords objectAtIndex:0] floatValue];
transformY = [[transformCoords objectAtIndex:1] floatValue];
}else if ([elementName isEqualToString:@"rect"]) {// Get the Blocks
NSString *type = [attributeDict valueForKey:@"inkscape:label"];
if ([type isEqualToString:@"#Block"]) {
NSString *x = [attributeDict valueForKey:@"x"];
NSString *y = [attributeDict valueForKey:@"y"];
NSString *width = [attributeDict valueForKey:@"width"];
NSString *height = [attributeDict valueForKey:@"height"];
CGPoint location;
location.x = transformX+[x floatValue]+[width floatValue]/2;
location.y = transformY+[y floatValue]+[height floatValue]/2;
[self createBlock:ccp(location.x,location.y) width:[width floatValue] height:[height floatValue]];
}
}
}
- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName{
//
}
- (void)parser:(NSXMLParser *)parser foundCharacters:(NSString *)string{
//
}
- (void) parserDidEndDocument:(NSXMLParser *)parser{
NSLog(@"SVG Level Builder Terminated.");
}
- (void)createBlock:(CGPoint)position width:(float)width height:(float)height {
CCSprite *sprite1 = [CCSprite spriteWithFile:@"Icon.png"];
sprite1.position = position;
[self addChild:sprite1];
}
If i use this type of code then i will get only sprite(icon.png) but i want to display object exactly which is in the svg file. means i want to display a block which i used in svg file same as @Nexus6 tutorial. but i don't want to use chipmunk or any physics engine. how can i define body or shape in simple cocos2d? how it will work for simple cocos2d?
The way I have used Inkscape to create my levels is that I have exactly the same images in my level design as I do in my project (on a spite sheet). So the objects I create within my project are identical to what I see in my level design.
If you are drawing (freehand) objects within Inkscape that you wish to create within your project, then you obviosuly need to construct the image that will represent what you have drawn. If this is simply a rectangular box, then you could create a simple UIImage to those dimensions (W x H). If it's more complex than that, then you will need to extract the properties of the BLOCK to create from the SVG and act accordingly.
EDIT: In the example provided from @Nexus6, the code uses CMShape to define the BLOCK object. I think this is a Chipmunk Pro method used to create shapes. As you are not using Chipmunk, you will need to have an equivilent method to create your shape.
Nexus6
Member
Cocos2d and Inkscape are on two different coordinate systems, one have it's origin at top-left and the other at the bottom-left. To make cocos2d objects appear in the correct position you have to change the inkscape Y value in this way:
cocos2dYvalue = cocos2dScreenHeight - inkscapeYvalue.
As breskit explained, from inkscape you can even gain a complex (freehand) shape. This involves that you create a custom CCNode or CCSprite with an overridden OpenGL draw method that map a texture on an OpenGL triangle strip (or a triangle fan) built with the vertices of the object parsed from inkscape.
This is not simple at all but you can find some working code looking in the forum for "polygon texture", "texture filling", etc.
I'm a beginner too so i would suggest you to try to avoid this frustrating things for the moment. Cocos2d exists because people don't like to get crazy with OpenGL ;)
Go for steps:
- learn how to make a class that inherit from CCSprite that put a simple image on the screen
- learn how to add that custom class while parsing the inkscape file
- learn how to draw basic primitives in the draw method of your custom class
- learn how to map a texture on your custom polygon
- mix all together in your game
It's not fair to cover all this arguments in a thread about the "game levels" , you will gain a better attention and from more professional coders than me if you split your questions in separated and dedicated forum threads ;)
----
Edit: Sorry, for the double answer about the coordinates... i spent so much time trying to write in english that i missed breskit's answer
You must log in to post.