Has anyone successfully added a 3d Model?

Forums Programming cocos2d support (graphics engine) Has anyone successfully added a 3d Model?

This topic contains 40 replies, has 16 voices, and was last updated by  PrinceCreed 1 year, 5 months ago.

Viewing 25 posts - 1 through 25 (of 41 total)
Author Posts
Author Posts
July 18, 2009 at 7:28 pm #216189

sunsu
@sunsu

Has anyone successfully added a 3d Model to a cocos app that would be willing to fill in the community on how you did it? In my case, I’m primarily interested in using 3D models on top of a tilemap.

Thanks

-Sunsu

July 19, 2009 at 4:43 am #253283

skeeet
@skeeet

I was working on .POD format loader some time ago, but it is unfinished yet.

I believe you can easily use the same loader from oolong engine, or .obj loader from Jeff LaMarche (http://iphonedevelopment.blogspot.com/2009/03/wavefront-obj-loader-open-sourced-to.html). I will complete my own objective-c wrapper over both loader when i’ll have some time, but don’t expect it soon.

Regards,

Alex.

July 19, 2009 at 11:00 am #253284

patrickC
Participant
@patrickc

I’ve added textured cubes that represent buildings (on tilemaps, gta style).

Not exactly models, if you’re wanting to import models then yes skeeet already told you what there is to know.

July 19, 2009 at 5:55 pm #253285

sunsu
@sunsu

Ahh patrickC, that sounds interesting. Do you mind sending an example image just so I can see what you’re talking about? I might not need 3d “models” after all. (its fairly likely, I am completely inexperienced with anything 3d).

thanks,

Sunsu

July 19, 2009 at 8:06 pm #253286

patrickC
Participant
@patrickc

Aye, here’s a super secret preview screenshot of my upcoming game ;)

As you can see, there are 3 “buildings”, simply cubes seen from above with perspective to add the feeling of depth to the game.

If you’re familiar with GTA (1 and 2), that’s what they did, just much better :)

Is that the effect you’re after?

July 19, 2009 at 8:11 pm #253287

Codemattic
Moderator
@codemattic

looks kewl patrickC

July 19, 2009 at 10:43 pm #253288

PhilM
Participant
@philm

looks very cool! Looks like you’ve got the mini map working and everything. You going for a gta style game or a micro machines racing style (both would be sweet!).

Sorry to go off topic ; )

July 19, 2009 at 10:48 pm #253289

patrickC
Participant
@patrickc

Well thanks for the kind words ;)

I’m going for a “crazy taxi” theme if you’re familiar with that game.

Except it has micro machines like graphics, with those 3d cubes there.

Basically you drive around the city, pick up clients and drop them off within a time limit to make money.

Arcade-style, the way I like it :)

July 19, 2009 at 11:11 pm #253290

PhilM
Participant
@philm

sounds sweet! Yup played crazy taxi back in the day, a simple but strangely addictive game ; )

good luck, can’t wait to give it a try when its released!

July 19, 2009 at 11:37 pm #253291

Codemattic
Moderator
@codemattic

loved Crazy Taxi – and a top down 3d-ish CT-like game sounds like fun!

Theres also a 2.5-iso-perspective TaxiBall which is pretty fun. But it has a completely different look/gameplay than yours.

http://www.148apps.com/reviews/taxiball/

July 20, 2009 at 12:26 am #253292

sunsu
@sunsu

WoW looks great! Thanks for sharing your idea with us! Yes that’s similar to what I envision in my head. I’ll keep it in mind as I move forward.

-Sunsu

July 20, 2009 at 9:45 am #253293

patrickC
Participant
@patrickc

Well thanks again for your support ;)

I could provide some code sunsu if you want, it’s pretty basic stuff but it can be quite difficult to get the texture mapping correct, some of it is still a mistery to me as to how it works.

The game will be called “Mini Taxi” and it will be submitted to Apple next week, I really hope it pays off cos I gave up my job to try do this full time, and money’s running out :)

Yeah codemattic I saw Taxiball it looks cool, I haven’t played it yet though.

Gameplay will be quite different, so I hope people won’t steer away from MiniTaxi because they already have Taxiball.

Hope is the last to die, they say…

July 20, 2009 at 10:04 am #253294

jptsetung
Participant
@jptsetung

@patrickC, the game looks great but the app store seems to be a random market. I don’t think it’s a good idea to quit your job, but now it’s too late, so you don’t have the choice ^_^.

I’m also interested to know how to integrate 3D stuff in cocos2D and would love to see a short example of code. I’m a 3D noob.

July 20, 2009 at 10:29 am #253295

patrickC
Participant
@patrickc

Well, it’s actually very straightforward.

We want to draw a 6 faced cube, so we need to tell opengl to draw 12 triangles (opengl es can only draw triangles and not quads).

Two triangles will compose one face of the cube.

To optimize the calls to opengl, we’ll group all of the vertices into one array, so that with one opengl call we draw all of the cube.

To map a texture, we simply bind a texture that we’ve pre-loaded, and similarly to the vertices array, we have another array that defines which region of the texture each polygon will display.

This is the code to draw a 6 faced texture mapped cube.

-(void)draw {
glColor4f(1,1,1,1);
glEnable(GL_TEXTURE_2D);
glEnableClientState(GL_VERTEX_ARRAY);
glEnableClientState(GL_TEXTURE_COORD_ARRAY);
glBindTexture(GL_TEXTURE_2D, spriteTexture);
glVertexPointer(3, GL_FLOAT, 0, cubeVertices);
glTexCoordPointer(2, GL_FLOAT, 0, texCoords);
glDrawArrays(GL_TRIANGLES, 0, 36);
glDisableClientState(GL_VERTEX_ARRAY);
glDisableClientState(GL_TEXTURE_COORD_ARRAY);
glDisable(GL_TEXTURE_2D);
}

The “cubeVertices” array:

GLfloat cubeVerticesTemp[] = {
posX, posY+depth, height,
width+posX, posY+depth, 0.0f,
width+posX, posY+depth, height,

posX, posY+depth, height,
posX, posY+depth, 0.0f,
width+posX, posY+depth, 0.0f,

posX, depth+posY, height,
width+posX, posY, height,
width+posX, depth+posY, height,

posX, depth+posY, height,
posX, posY, height,
width+posX, posY, height,

posX, posY, height,
width+posX, posY, 0.0f,
width+posX, posY, height,

posX, posY, height,
posX, posY, 0.0f,
width+posX, posY, 0.0f,

posX, posY,0.0f,
width+posX, depth+posY, 0.0f,
width+posX, posY, 0.0f,

posX, posY, 0.0f,
posX, depth+posY, 0.0f,
width+posX, depth+posY, 0.0f,

posX, depth+posY, height,
posX, posY, 0.0f,
posX, depth+posY, 0.0f,

posX, depth+posY, height,
posX, posY, height,
posX, posY, 0.0f,

width+posX, depth+posY, height,
width+posX, posY, 0.0f,
width+posX, depth+posY, 0.0f,

width+posX, depth+posY, height,
width+posX, posY, height,
width+posX, posY, 0.0f,
};

and the “texCoords” array:

GLfloat cubeTextureCoords[] = {
0.0f, 0.5f, // bottom-upper-right
1.5f, 1.0f,
1.0f, 0.5f,

0.0f, 0.5f, // bottom-lower-left
0.0f, 1.0f,
1.0f, 1.0f,

0.0f, 0.0f, // front-upper-right
1.0f, 0.5f,
1.0f, 0.0f,

0.0f, 0.0f, // front-lower-left
0.0f, 0.5f,
1.0f, 0.5f,

0.0f, 0.5f, // bottom-upper-right
1.0f, 1.0f,
1.0f, 0.5f,

0.0f, 0.5f, // bottom-lower-left
0.0f, 1.0f,
1.0f, 1.0f,

0.0f, 1.0f, // back-upper-right
1.0f, 0.5f,
0.0f, 0.5f,

0.0f, 1.0f, // back-lower-left
1.0f, 1.0f,
1.0f, 0.5f,

1.0f, 0.5f, // right-upper-right
0.0f, 1.0f,
1.0f, 1.0f,

1.0f, 0.5f, // right-lower-left
0.0f, 0.5f,
0.0f, 1.0f,

1.0f, 0.5f, // right-upper-right
0.0f, 1.0f,
1.0f, 1.0f,

1.0f, 0.5f, // right-lower-left
0.0f, 0.5f,
0.0f, 1.0f

I’m aware of the following problem with this code:

Two of the faces (left and top, I think), are drawn with the normal pointing the wrong way.

This needs to be fixed by changing the order the vertices are drawn in (winding).

Not much of a problem in itself, but if we want to improve performance by enabling backface culling (so that backfaces that are not visible are not rendered), then those two faces are not visible.

If anyone needs further explanation don’t hesitate to ask :)

Regarding the game, I realize that leaving my job to develop an iPhone game is a very risky, if not stupid, move.

On the other hand, I needed a change anyway and took the opportunity, not trying to make a fortune, but if I manage to survive and pay rent while making games that would be a success :)

Once the game is out, I will post in detail my experience with the development, release and future of what could be.

There will be some voodoo spells too, and possible iPhone sacrifices in a stone circle up north.

Cheers :)

Patrick

July 20, 2009 at 8:36 pm #253296

Codemattic
Moderator
@codemattic

“and money’s running out :)”

pC, Im in a similar sitch – so man, good luck!

July 20, 2009 at 8:49 pm #253297

sunsu
@sunsu

You guys should pool your knowledge and time since you are in the same boat!

-Sunsu

July 20, 2009 at 11:05 pm #253298

PhilM
Participant
@philm

I respect anyone who took the plunge to do this full time! I’ve turned down a lot of web work over the last 6 months to try and spend more time on iphone developing, but had to keep a few clients on board to pay the bills.

At the very least, you’ll (hopefully) have a release on the App Store, and a s*** hot C.V, so I’d look at it as some form of home schooling, which could help you get a job in future if you need to go that route (hopefully not!).

At least that’s what I’m telling myself when I’m up to all hours of the morning working on my dev stuff, rather than working on clients work :-/

July 22, 2009 at 3:08 pm #253299

rbrooky
@rbrooky

Very interesting post. To PatrickC and CodeMattic: brave move, I hope it works out well for you guys! Part of me wants to do the exact same…

I ran into some trouble with a game I’m developing also related to 3D. The game it self is mostly a 2D game but I want to show a 3D background (a streetview in perspective). The streetview is moving scrolling away from the viewer giving the illusion that he character in the middle of the screen is moving towards you. I’m having a very hard time getting this accomplished. I actually have something that sort of works but it is far from perfect and probably not the best way to do it. On top of it, the last step that creates the floor rotates the entire view which you notice when you leave the GameScene back to the MenuScene (now the menu scene is in perspective).

Some parts of the code I have:

//Two building layers like below, this one create the left wall

@implementation BuildingViewLayerLeft

@synthesize buildings, buildings2;

- (id) init {

self = [super init];

if (self != nil) {

//Load file

buildings = [Sprite spriteWithFile:@"buildings2.png"];

//Set the position of the buildings on the layer

[buildings setPosition:ccp(780, 160)];

[self addChild:buildings z:0];

//Below creates a Z-Vertex effect like in AtlasSpriteTest. duration is 0 so transformation is immediately

[self runAction:[OrbitCamera actionWithDuration:0 radius: 2 deltaRadius:0 angleZ:82 deltaAngleZ:0 angleX:0 deltaAngleX:0]];

[self schedule: @selector(updatePositions) interval: 0.02f];

}

return self;

}

The main problem is with the floor view:

- (id) init {

self = [super init];

if (self != nil) {

//This is where the issues start. It gives the desired effect but also rotates the character which I can correct with an OrbitCamera

glRotatef(-90.0, 0.0, -1.0, 0.0);

road = [Sprite spriteWithFile:@"road.png"];

//Set the position of the layer

[road setPosition:ccp(240, 160)];

[road setScale:2.0f];

[self addChild:road z:0];

[self setRotation:1];

[self schedule: @selector(updatePositions) interval: 0.02f];

}

return self;

}

Clearly not the right way to do it but it gives me the desire effect. I have played around with the Camera a lot too to get the effect but I was unsuccesful

[self.camera setEyeX: ...]; and

[self.camera setCenterX: ...];

Any suggestions how to accomplish this would be very helpful!

July 22, 2009 at 3:31 pm #253300

patrickC
Participant
@patrickc

Hum, I think I understand what you’re trying to achieve.

Personally, I probably would have gone a slightly different path, but the concepts are the same.

I would try to do the walls/floor by hand, without relying on cocos2d’s camera.

In dirty-pseudo code:

drawLeftWall {
//save current matrix
glPushMatrix();
//rotate matrix so that we draw correctly
glRotate(whatever);
//bind texture and draw geometries
glBindTexture...
glDraw...
//restore previous matrix
glPopMatrix();
}

The same would go for the other wall and the floor.

If you take the code I posted above, get that to work, and then start messing around with the matrix, you should be able to create 3d cubes, rotated the correct way to give depth.

In having a look at your code, perhaps you’re not familiar with pushing/popping the opengl matrix, you should have a quick look into that.

You mention that the “floor” view rotates everything, and then you counter with an orbit camera, you should either rotate back with glRotate, or even better, just push/pop the matrix.

Then again, I’m still a noob when it comes to opengl, so take it for what it is.

Hope that’s of some kind of help :)

cheers

Patrick

July 22, 2009 at 5:54 pm #253301

rbrooky
@rbrooky

Thanks Patrick,

I actually used glPushMatrix and popMatrix yesterday like this:

(id) init {

self = [super init];

if (self != nil) {

glPushMatrix();

glRotatef(-90.0, 0.0, -1.0, 0.0);

road = [Sprite spriteWithFile:@"road.png"];

//Set the position of the layer

[road setPosition:ccp(240, 160)];

[road setScale:2.0f];

[self addChild:road z:0];

[self setRotation:1];

glPopMatrix();

[self schedule: @selector(updatePositions) interval: 0.02f];

}

return self;

}

Problem was that it indeed restored the orientation on all the other objects but unfortunately also on the floor object/layer.

Someone suggested a patch to CocosNode in an earlier post that I will try today. I will let you know how that came out

July 27, 2009 at 2:59 pm #253302

sunsu
@sunsu

patrickC, could you take a look at this thread?

http://www.cocos2d-iphone.org/forum/topic/934?replies=3#post-5543

Thanks,

Sunsu

April 2, 2010 at 1:46 am #253303

ashmira
Participant
@ashlovemira

How did u do the mini map..? if there any example code of mini map?

April 2, 2010 at 1:51 am #253304

AkumaStreak
Participant
@akumastreak

I thought the new rage was 1d?!

April 2, 2010 at 2:39 am #253305

aerostat
Participant
@aerostat

patrickC, Codemattic and PhilM – I’m in the same boat too! Good luck to you all! maybe we should start a club or something …

(sorry for offtopic post)

April 2, 2010 at 8:41 am #253306

patrickC
Participant
@patrickc

The club of poor indie developers?

I’m lucky my expenses are cut down to a couple hundred euros a month…

@ashmira

Can’t post any relevant code unfortunately, but the minimap is simply a CCSpriteSheet (used to be an Atlas).

The whole texture represents the whole map (512×512) but I only display a small portion of it through a CCSprite

[sprite setTextureRect:...]

and at every tick, based on the position of the car in the real map, I make appropriate calculations and update the rectangle of the CCSprite to display the correct portion.

Good enough? ;)

Viewing 25 posts - 1 through 25 (of 41 total)

You must be logged in to reply to this topic.