A fast, easy to use, free, and community supported 2D game engine
bagusflyer
Member
I'd like to to customize CCTransitionPageTurn. For example, I don't want the back side of a scene will be shown during page turning. Instead I want it be white color.
Anyway to implement this? Should I change the source code of CCTransitionPageTurn or create another class?
Thanks
For maintenance purposes, it is better if you create a new class. It will be easier for you to migrate to a new version of cocos2d if you don't alter the cocos2d sources.
Would love to hear if you're successful at this. I've always thought we needed a more book-like effect on the page turn.
I haven't tried it, but it seems to me that if you create a white image and make it do the exact same transformations at the same time, you might get the effect you want, although I'm not sure if this will cause some Z-order fighting as it turns.
bagusflyer
Member
I've tried to add another background in white color behind the current CCSprite ( for example, current background z is -1, and the one behind the current one -2. But it doesn't work, the backside of the page is still showing the current background when I turn the page.
Any idea? Thanks
A 3D polygon, like the tiles in the grid that performs the page turn have a front face and back face. What you want is that the back face, which is the transformed part of the grid has a white color instead of the texture. Luckily OpenGL can separate front and back faces by their vertices winding. Normally a CCW (counter clock wise) winding stands for the front face and CW for the back face of a polygon. Another useful technique is culling, which instructs the renderer to discard the front or back face of a polygon completely.
Combine the two and that's almost enough to get it working.
Edit, this code is fully working.
the blit method of CCGrid3D
-(void)blit
{
NSInteger n = gridSize_.x * gridSize_.y;
// Default GL states: GL_TEXTURE_2D, GL_VERTEX_ARRAY, GL_COLOR_ARRAY, GL_TEXTURE_COORD_ARRAY
// Needed states: GL_TEXTURE_2D, GL_VERTEX_ARRAY, GL_TEXTURE_COORD_ARRAY
// Unneeded states: GL_COLOR_ARRAY
//enable culling, the default cull face is back
glEnable(GL_CULL_FACE);
//now only the front facing polygons are drawn
glDisableClientState(GL_COLOR_ARRAY);
glVertexPointer(3, GL_FLOAT, 0, vertices);
glTexCoordPointer(2, GL_FLOAT, 0, texCoordinates);
glDrawElements(GL_TRIANGLES, (GLsizei) n*6, GL_UNSIGNED_SHORT, indices);
//change the winding of what OpenGl considers front facing
//only the back facing polygons will be drawn
//this works better then changing the cull face
glFrontFace(GL_CW);
glDisableClientState(GL_TEXTURE_COORD_ARRAY);
glColor4ub(255,255,255,255);
glDrawElements(GL_TRIANGLES, (GLsizei) n*6, GL_UNSIGNED_SHORT, indices);
//restore GL default states
glFrontFace(GL_CCW);
glDisable(GL_CULL_FACE);
glEnableClientState(GL_TEXTURE_COORD_ARRAY);
glEnableClientState(GL_COLOR_ARRAY);
}Basically the grid is drawn twice, so it will perform slower than the original. But due to the dismissing of front/back facing polygons it won't be twice as computational intense.
You'll need to do some proper subclassing to get this working nicely, without affecting other effects that rely on CCGrid3D.
bagusflyer
Member
Araker, thanks for your reply. I understand what your mean now. Your method partially worked. Now the frontface is not visible. But the color of backface is not white. It seems random color. It's different in every page.
I saw your glColor4ub(255,255,255,255); function. But I don't know why it's not working.
daylord
Member
Hi, I also tried this solution. It's working fine in Test.
But in my individual project backside of the page is showing in black color.
And i am not using the depth buffer.
EAGLView *glView = [EAGLView viewWithFrame:self.frame
pixelFormat:kEAGLColorFormatRGB565 //kEAGLColorFormatRGBA8
depthFormat:0
preserveBackbuffer:NO
sharegroup:nil
multiSampling:NO
numberOfSamples:0];If i use "kEAGLColorFormatRGB565" backside of the scene is coming in black color.
And if i use "kEAGLColorFormatRGBA8" backside of the scene is coming in transparent. It doesn't show anything.
EvilRabbit
Member
EvilRabbit
Member
@bagusflyer - did you resolve the random colors issue?
@bagusflyer, I think it's weird as well, like I said before in the transitions test I don't have a color problem at all. I'm using cocos 1.0.0 RC 1.
bagusflyer
Member
araker, I found the problem. I replaced the background1.jpg and background2.jpg with my pictures, then I can reproduce my problem. So the problem is caused by jpg itself.
I though it's because of the original jpgs are black and white. Actually it's not, the backside turn to gray color if I change my pictures in gray scale.
Then I add a white background (1024x768) and shrink my original picture to 1014x758 then place it inside the white background. And run my the testing project again. It works. But this will leaves a problem for me, every picture I used will have a white border which is not what I want? Any better solution? Thanks
You must log in to post.