removing jagged edges of my ropes using antialiasing of OpenGLES

Question

i have implemented ropes in which i have used Revolute joints to connect dynamic b2bodied , now i successfully created this ropes but my ropes not looking smoothy , i want them smooth just like ribbons . anyone having idea on this !! i found that it could be achieved by openGLES using anti-aliasing but still not getting idea that exactly how to achieve this .. any kind of help would be appreciated .

my Rope is polygon shaped dynamic body , this way b2BodyDef bodyDef; bodyDef.type = b2_dynamicBody; bodyDef.position = currentPos;

b2PolygonShape polygonShape;
polygonShape.SetAsBox(linkWidth,linkHeight);

b2FixtureDef fixtureDef;
fixtureDef.density =20.0;

fixtureDef.shape = &polygonShape;

b2Body* link = world->CreateBody( &bodyDef );
link->CreateFixture( &fixtureDef );

Revolute Joint :

b2RevoluteJointDef revoluteJointDef;
revoluteJointDef.localAnchorA.Set( 0,  linkHeight);
revoluteJointDef.localAnchorB.Set( 0, -linkHeight);            
revoluteJointDef.bodyA = link;
revoluteJointDef.bodyB = lastLink;
world->CreateJoint( &revoluteJointDef );

please help .

i want my ropes smoother just like right most image

my output looks like this

Answer 1

You will have to enable multisampling if you want to get rid of the edges of textures. Multisampling will act on the entire screen and enabling it will have a performance penalty, most severely on older devices (iPhone 3GS).

Locate the line where CCGLView is instantiated in AppDelegate, and enable multi sampling and set the number of samples to 2 or 4.

CCGLView *glView = [CCGLView viewWithFrame:[window bounds]
pixelFormat:kEAGLColorFormatRGBA8    // <-- use whichever is your default
depthFormat:GL_DEPTH_COMPONENT24_OES // <-- use whichever is your default
preserveBackbuffer:NO
sharegroup:nil
multiSampling:YES    // <-- enable
numberOfSamples:4];  // <-- set to 2 or 4

One thing to keep in mind: on Retina devices you won't be able to see the jagged edges due to the high resolution of the display. Multisampling on Retina devices in a 2D app is likely a waste of performance and hardly increases image quality. That leaves you with another option: consider to just support Retina devices, or simply ignore that the issue exists on non-Retina devices because they're about to go away anyway.

Btw, the CCTexture2D aliasing and antialiasing methods are confusingly named, they do not perform full-screen or texture-edge aliasing or antialiasing. They change the texture's filtering mode between linear ("antialias", blurry) and nearest ("alias", no filtering).

The effect is that pixels within a texture are either linear filtered and thus individual pixel colors gradually change, whereas nearest filtering does not perform such filtering. Nearest filtering is most commonly needed for pixel art and tilemap tileset textures. Both only change filtering modes of the texture's pixels and not their edges. For that you need multisampling.