<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" version="2.0">

<channel>
	<title>Uchidacoonga</title>
	
	<link>http://www.uchidacoonga.com</link>
	<description>"Do it until it becomes boring, then keep doing it until it becomes beautiful."</description>
	<lastBuildDate>Wed, 04 Apr 2012 00:50:17 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/uchidacoonga/feed" /><feedburner:info xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" uri="uchidacoonga/feed" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><feedburner:emailServiceId xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0">uchidacoonga/feed</feedburner:emailServiceId><feedburner:feedburnerHostname xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0">http://feedburner.google.com</feedburner:feedburnerHostname><item>
		<title>Quick Tip: Max Texture Size</title>
		<link>http://www.uchidacoonga.com/2012/04/quick-tip-max-texture-size/</link>
		<comments>http://www.uchidacoonga.com/2012/04/quick-tip-max-texture-size/#comments</comments>
		<pubDate>Wed, 04 Apr 2012 00:50:17 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1404</guid>
		<description><![CDATA[Max Texture Size of iOS Devices When loading OpenGL textures (or sprites, sprite sheets in Cocos2d), the max size for 1024 x 1024 2048 x 2048 4096 x 4096 iPhone 2giPhone 3g iPhone 3gsiPhone 4iPad iPhone 4siPad 2iPad 3]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>Max Texture Size of iOS Devices</strong></span></h4>
<p>When loading OpenGL textures (or sprites, sprite sheets in Cocos2d), the max size for</p>
<table border=0>
<tr>
<td><b>1024 x 1024</b></td>
<td><b>2048 x 2048</b></td>
<td><b>4096 x 4096</b></td>
</tr>
<tr>
<td valign="top">iPhone 2g<br />iPhone 3g</td>
<td valign="top">iPhone 3gs<br />iPhone 4<br />iPad</td>
<td valign="top">iPhone 4s<br />iPad 2<br />iPad 3</td>
</tr>
</table>

<p><a href="http://feedads.g.doubleclick.net/~a/kphfG-96lXbbfJOW8WWg5jKNrjI/0/da"><img src="http://feedads.g.doubleclick.net/~a/kphfG-96lXbbfJOW8WWg5jKNrjI/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/kphfG-96lXbbfJOW8WWg5jKNrjI/1/da"><img src="http://feedads.g.doubleclick.net/~a/kphfG-96lXbbfJOW8WWg5jKNrjI/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2012/04/quick-tip-max-texture-size/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Soft Body Physics With Box2d (and Cocos2d) Part 4/4</title>
		<link>http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/</link>
		<comments>http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/#comments</comments>
		<pubDate>Sun, 01 Apr 2012 20:35:55 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1367</guid>
		<description><![CDATA[Prerequisites This is the final part to a four part series about simulating a soft body physics in Box2d. Before continuing, you should read and understand the following tutorials. 1. Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan) 2. Soft Body Physics with Box2d and Cocos2d Part 1/4 3. Soft Body Physics with Box2d and <a href='http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>Prerequisites</strong></span></h4>
<p>This is the final part to a four part series about simulating a soft body physics in Box2d. Before continuing, you should read and understand the following tutorials.</p>
<p>1. <a href="http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/">Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan)</a><br />
2. <a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/">Soft Body Physics with Box2d and Cocos2d Part 1/4</a><br />
3. <a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/">Soft Body Physics with Box2d and Cocos2d Part 2/4</a><br />
4. <a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/">Soft Body Physics with Box2d and Cocos2d Part 3/4</a></p>
<p>In this final part, I will be showing you how to texture map the circular polygon constructed from the coordinates of the Box2d wheel structure.</p>
<h4><span style="color: #ff6600;"><strong>Texture Mapping a Circle</strong></span></h4>
<p><a href="http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/texturemapcircle/" rel="attachment wp-att-1368"><img src="http://www.uchidacoonga.com/wp-content/uploads/2012/04/textureMapCircle.png" alt="" title="textureMapCircle" width="414" height="439" class="alignnone size-full wp-image-1368" /></a><br />
In the previous article, we texture mapped a square. Now, we will texture map a circle. In the image above, you see that the circle polygon is constructed with a triangle fan, with the center at 1, then going to 2, 3, 4, 5, 6, 7 and 9 (which is the same as 2). We need to map these vertices to the texture image. So we map 1 to A, 2 to B, 3 to C, 4 to D, 5 to E, 6 to F, 7 to G, 8 to H and 9 to I (etc, for however many number of vertices you have).</p>
<p>Just remember that the texture map coordinates must be in the range of 0 to 1. We use the cosine and sine functions to calculate the x and y coordinates of each segment. However, cosine and sine functions give outputs in the rage of -1 to 1. So we must normalize the cosine and sine functions so that the values fall between 0 to 1. </p>
<p>Here is the source code for MyNode. You will also find the full source code for download and a demo video at the bottom of the article.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;CCNode.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Box2D.h&quot;</span>
&nbsp;
<span style="color: #a61390;">typedef</span> <span style="color: #a61390;">struct</span> <span style="color: #002200;">&#123;</span>
    GLfloat x;
    GLfloat y;
<span style="color: #002200;">&#125;</span> Vertex2D;
&nbsp;
<span style="color: #a61390;">static</span> inline Vertex2D Vertex2DMake<span style="color: #002200;">&#40;</span>GLfloat inX, GLfloat inY<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
    Vertex2D ret;
    ret.x <span style="color: #002200;">=</span> inX;
    ret.y <span style="color: #002200;">=</span> inY;
    <span style="color: #a61390;">return</span> ret;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #6e371a;">#define NUM_SEGMENTS 20</span>
&nbsp;
<span style="color: #a61390;">@interface</span> MyNode <span style="color: #002200;">:</span> CCNode <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// Texture</span>
    CCTexture2D <span style="color: #002200;">*</span>texture;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Physics bodies</span>
    <span style="color: #400080;">NSMutableArray</span> <span style="color: #002200;">*</span>bodies;
    <span style="color: #a61390;">float</span> deltaAngle;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Center circle</span>
    b2Body <span style="color: #002200;">*</span>innerCircleBody;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Polygon vertices</span>
    Vertex2D triangleFanPos<span style="color: #002200;">&#91;</span>NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Texture coordinate array</span>
    Vertex2D textCoords<span style="color: #002200;">&#91;</span>NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> createPhysicsObject<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>b2World<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>world;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> bounce;
&nbsp;
<span style="color: #a61390;">@end</span></pre></div></div>


<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
<span style="color: #6e371a;">#import &quot;MyNode.h&quot;</span>
&nbsp;
<span style="color: #6e371a;">#define PTM_RATIO 32.f</span>
&nbsp;
<span style="color: #a61390;">@implementation</span> MyNode
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> init <span style="color: #002200;">&#123;</span>
    self <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span>;
&nbsp;
    texture <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCTextureCache sharedTextureCache<span style="color: #002200;">&#93;</span> addImage<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;Ball.png&quot;</span><span style="color: #002200;">&#93;</span>;        
&nbsp;
    <span style="color: #a61390;">return</span> self;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> createPhysicsObject<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>b2World <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>world <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// Center is the position of the circle that is in the center (inner circle)</span>
    b2Vec2 center <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">240</span><span style="color: #002200;">/</span>PTM_RATIO, <span style="color: #2400d9;">160</span><span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
    b2CircleShape circleShape;
    circleShape.m_radius <span style="color: #002200;">=</span> 0.1f;
&nbsp;
    b2FixtureDef fixtureDef;
    fixtureDef.shape <span style="color: #002200;">=</span> <span style="color: #002200;">&amp;</span>circleShape;
    fixtureDef.density <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.1</span>;
    fixtureDef.restitution <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.05</span>;
    fixtureDef.friction <span style="color: #002200;">=</span> <span style="color: #2400d9;">1.0</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Delta angle to step by</span>
    deltaAngle <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>.f <span style="color: #002200;">*</span> M_PI<span style="color: #002200;">&#41;</span> <span style="color: #002200;">/</span> NUM_SEGMENTS;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Radius of the wheel</span>
    <span style="color: #a61390;">float</span> radius <span style="color: #002200;">=</span> <span style="color: #2400d9;">50</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Need to store the bodies so that we can refer back</span>
    <span style="color: #11740a; font-style: italic;">// to it when we connect the joints</span>
    bodies <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span><span style="color: #400080;">NSMutableArray</span> alloc<span style="color: #002200;">&#93;</span> init<span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #11740a; font-style: italic;">// Current angle</span>
        <span style="color: #a61390;">float</span> theta <span style="color: #002200;">=</span> deltaAngle<span style="color: #002200;">*</span>i;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Calculate x and y based on theta</span>
        <span style="color: #a61390;">float</span> x <span style="color: #002200;">=</span> radius<span style="color: #002200;">*</span>cosf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span>;
        <span style="color: #a61390;">float</span> y <span style="color: #002200;">=</span> radius<span style="color: #002200;">*</span>sinf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span>;
        <span style="color: #11740a; font-style: italic;">// Remember to divide by PTM_RATIO to convert to Box2d coordinate</span>
        b2Vec2 circlePosition <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>x<span style="color: #002200;">/</span>PTM_RATIO, y<span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
&nbsp;
        b2BodyDef bodyDef;
        bodyDef.type <span style="color: #002200;">=</span> b2_dynamicBody;
        <span style="color: #11740a; font-style: italic;">// Position should be relative to the center</span>
        bodyDef.position <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>center <span style="color: #002200;">+</span> circlePosition<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Create the body and fixture</span>
        b2Body <span style="color: #002200;">*</span>body;
        body <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;CreateBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>bodyDef<span style="color: #002200;">&#41;</span>;
        body<span style="color: #002200;">-</span>&gt;CreateFixture<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>fixtureDef<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Add the body to the array to connect joints to it</span>
        <span style="color: #11740a; font-style: italic;">// later. b2Body is a C++ object, so must wrap it</span>
        <span style="color: #11740a; font-style: italic;">// in NSValue when inserting into it NSMutableArray</span>
        <span style="color: #002200;">&#91;</span>bodies addObject<span style="color: #002200;">:</span><span style="color: #002200;">&#91;</span><span style="color: #400080;">NSValue</span> valueWithPointer<span style="color: #002200;">:</span>body<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#93;</span>;
    <span style="color: #002200;">&#125;</span>
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Circle at the center (inner circle)</span>
    b2BodyDef innerCircleBodyDef;
    <span style="color: #11740a; font-style: italic;">// Make the inner circle larger</span>
    circleShape.m_radius <span style="color: #002200;">=</span> 0.8f;
    innerCircleBodyDef.type <span style="color: #002200;">=</span> b2_dynamicBody;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Position is at the center</span>
    innerCircleBodyDef.position <span style="color: #002200;">=</span> center;
    innerCircleBody <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;CreateBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>innerCircleBodyDef<span style="color: #002200;">&#41;</span>;
    innerCircleBody<span style="color: #002200;">-</span>&gt;CreateFixture<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>fixtureDef<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Connect the joints</span>
    b2DistanceJointDef jointDef;
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #11740a; font-style: italic;">// The neighbor</span>
        <span style="color: #a61390;">const</span> <span style="color: #a61390;">int</span> neighborIndex <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>i <span style="color: #002200;">+</span> <span style="color: #2400d9;">1</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">%</span> NUM_SEGMENTS;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Get current body and neighbor</span>
        b2Body <span style="color: #002200;">*</span>currentBody <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>bodies objectAtIndex<span style="color: #002200;">:</span>i<span style="color: #002200;">&#93;</span> pointerValue<span style="color: #002200;">&#93;</span>;
        b2Body <span style="color: #002200;">*</span>neighborBody <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>bodies objectAtIndex<span style="color: #002200;">:</span>neighborIndex<span style="color: #002200;">&#93;</span> pointerValue<span style="color: #002200;">&#93;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Connect the outer circles to each other</span>
        jointDef.Initialize<span style="color: #002200;">&#40;</span>currentBody, neighborBody,
                            currentBody<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>, 
                            neighborBody<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#41;</span>;
        <span style="color: #11740a; font-style: italic;">// Specifies whether the two connected bodies should collide with each other</span>
        jointDef.collideConnected <span style="color: #002200;">=</span> <span style="color: #a61390;">true</span>;
        jointDef.frequencyHz <span style="color: #002200;">=</span> 0.0f;
        jointDef.dampingRatio <span style="color: #002200;">=</span> 0.0f;
&nbsp;
        world<span style="color: #002200;">-</span>&gt;CreateJoint<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>jointDef<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Connect the center circle with other circles        </span>
        jointDef.Initialize<span style="color: #002200;">&#40;</span>currentBody, innerCircleBody, currentBody<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>, center<span style="color: #002200;">&#41;</span>;
        jointDef.collideConnected <span style="color: #002200;">=</span> <span style="color: #a61390;">true</span>;
        jointDef.frequencyHz <span style="color: #002200;">=</span> <span style="color: #2400d9;">8.0</span>;
        jointDef.dampingRatio <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.5</span>;
&nbsp;
        world<span style="color: #002200;">-</span>&gt;CreateJoint<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>jointDef<span style="color: #002200;">&#41;</span>;
    <span style="color: #002200;">&#125;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> draw <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// Using the wheel defined by the box2d objects, we'll be mapping a circle on</span>
    <span style="color: #11740a; font-style: italic;">// top of it using a triangle fan. First, we calculate the center. The center</span>
    <span style="color: #11740a; font-style: italic;">// needs to be mulitplied by the PTM_RATIO (to get the pixel coordinate from box2d coordinate)</span>
    <span style="color: #11740a; font-style: italic;">// and also must be offset by the current position (remember, in HelloWorldLayer, we set</span>
    <span style="color: #11740a; font-style: italic;">// the position to the center of the screen (myNode.position = ccp(240, 160).</span>
    triangleFanPos<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">0</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>innerCircleBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.x <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.x, 
                                     innerCircleBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.y <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.y<span style="color: #002200;">&#41;</span>;
    <span style="color: #11740a; font-style: italic;">// Use each box2d body as a vertex and calculate coordinate for the triangle fan</span>
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        b2Body <span style="color: #002200;">*</span>currentBody <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>bodies objectAtIndex<span style="color: #002200;">:</span>i<span style="color: #002200;">&#93;</span> pointerValue<span style="color: #002200;">&#93;</span>;
        Vertex2D pos <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>currentBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.x <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.x, 
                                    currentBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.y <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.y<span style="color: #002200;">&#41;</span>;
        triangleFanPos<span style="color: #002200;">&#91;</span>i<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>pos.x, pos.y<span style="color: #002200;">&#41;</span>;
    <span style="color: #002200;">&#125;</span>
    <span style="color: #11740a; font-style: italic;">// Loop back to close off the triangle fan</span>
    triangleFanPos<span style="color: #002200;">&#91;</span>NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> triangleFanPos<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// The first vertex is the center of the triangle fan.</span>
    <span style="color: #11740a; font-style: italic;">// So the first coordinate of the texture map should</span>
    <span style="color: #11740a; font-style: italic;">// map to the center of the triangle fan. The texture</span>
    <span style="color: #11740a; font-style: italic;">// map coordinates are normalized between 0 and 1, so</span>
    <span style="color: #11740a; font-style: italic;">// the center is (0.5, 0.5)</span>
    textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">0</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>0.5f, 0.5f<span style="color: #002200;">&#41;</span>;
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
&nbsp;
        GLfloat theta <span style="color: #002200;">=</span> M_PI <span style="color: #002200;">+</span> <span style="color: #002200;">&#40;</span>deltaAngle <span style="color: #002200;">*</span> i<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Calculate the X and Y coordinates for texture mapping.</span>
        <span style="color: #11740a; font-style: italic;">// Need to normalize the cosine and sine functions so that the</span>
        <span style="color: #11740a; font-style: italic;">// values are between 0 and 1. Cosine and sine functions have</span>
        <span style="color: #11740a; font-style: italic;">// values from -1 to 1, so we divide by 2 and add 0.5 to it to</span>
        <span style="color: #11740a; font-style: italic;">// normalize the values between 0 and 1.</span>
        textCoords<span style="color: #002200;">&#91;</span>i<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">0.5</span><span style="color: #002200;">+</span>cosf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span><span style="color: #002200;">*</span><span style="color: #2400d9;">0.5</span>, 
                                       <span style="color: #2400d9;">0.5</span><span style="color: #002200;">+</span>sinf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span><span style="color: #002200;">*</span><span style="color: #2400d9;">0.5</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #002200;">&#125;</span>
    <span style="color: #11740a; font-style: italic;">// Close it off.</span>
    textCoords<span style="color: #002200;">&#91;</span>NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Enable texture mapping stuff</span>
    glEnable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
    glDisableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Bind the OpenGL texture</span>
    glBindTexture<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D, <span style="color: #002200;">&#91;</span>texture name<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Send the texture coordinates to OpenGL</span>
    glTexCoordPointer<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>, GL_FLOAT, <span style="color: #2400d9;">0</span>, textCoords<span style="color: #002200;">&#41;</span>;
    <span style="color: #11740a; font-style: italic;">// Send the polygon coordinates to OpenGL</span>
    glVertexPointer<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>, GL_FLOAT, <span style="color: #2400d9;">0</span>, triangleFanPos<span style="color: #002200;">&#41;</span>;
    <span style="color: #11740a; font-style: italic;">// Draw it </span>
    glDrawArrays<span style="color: #002200;">&#40;</span>GL_TRIANGLE_FAN, <span style="color: #2400d9;">0</span>, NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> bounce <span style="color: #002200;">&#123;</span>
    b2Vec2 impulse <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>innerCircleBody<span style="color: #002200;">-</span>&gt;GetMass<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">*</span> <span style="color: #2400d9;">0</span>, innerCircleBody<span style="color: #002200;">-</span>&gt;GetMass<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">*</span> <span style="color: #2400d9;">40</span><span style="color: #002200;">&#41;</span>;
    b2Vec2 impulsePoint <span style="color: #002200;">=</span> innerCircleBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
    innerCircleBody<span style="color: #002200;">-</span>&gt;ApplyLinearImpulse<span style="color: #002200;">&#40;</span>impulse, impulsePoint<span style="color: #002200;">&#41;</span>;	          
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">@end</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Source and Video</strong></span></h4>
<p>You can download the full source code <a href="http://www.uchidacoonga.com/SoftPhysics.zip">here.</a></p>
<p><object width="560" height="315"><param name="movie" value="http://www.youtube.com/v/6xZFmbTPVBk?version=3&amp;hl=en_US&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/6xZFmbTPVBk?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/">Soft Body Physics with Box2d and Cocos2d Part 1/4</a><br />
<a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/">Soft Body Physics with Box2d and Cocos2d Part 2/4</a><br />
<a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/">Soft Body Physics with Box2d and Cocos2d Part 3/4</a></p>

<p><a href="http://feedads.g.doubleclick.net/~a/FAcFkCNosok2LXsovrz43fstxhU/0/da"><img src="http://feedads.g.doubleclick.net/~a/FAcFkCNosok2LXsovrz43fstxhU/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/FAcFkCNosok2LXsovrz43fstxhU/1/da"><img src="http://feedads.g.doubleclick.net/~a/FAcFkCNosok2LXsovrz43fstxhU/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Soft Body Physics With Box2d (and Cocos2d) Part 3/4</title>
		<link>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/</link>
		<comments>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/#comments</comments>
		<pubDate>Sat, 31 Mar 2012 19:59:59 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1336</guid>
		<description><![CDATA[Prerequisites This is the third part to a four part series about simulating a soft body physics in Box2d. Before continuing, you should read and understand the following tutorials. 1. Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan) 2. Soft Body Physics with Box2d and Cocos2d Part 1/4 3. Soft Body Physics with Box2d and <a href='http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>Prerequisites</strong></span></h4>
<p>This is the third part to a four part series about simulating a soft body physics in Box2d. Before continuing, you should read and understand the following tutorials.</p>
<p>1. <a href="http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/">Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan)</a><br />
2. <a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/">Soft Body Physics with Box2d and Cocos2d Part 1/4</a><br />
3. <a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/">Soft Body Physics with Box2d and Cocos2d Part 2/4</a></p>
<p>The next step is to texture map the circle polygon. But before texture mapping the circle we have created in part 2 of the tutorial, let&#8217;s get some basics out of the way and texture map a simple shape in OpenGL. I will save the actual texture mapping of the soft body physics object for the final installment of the tutorial in part 4.</p>
<h4><span style="color: #ff6600;"><strong>Texture Mapping Basics</strong></span></h4>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/texturemap/" rel="attachment wp-att-1339"><img src="http://www.uchidacoonga.com/wp-content/uploads/2012/03/textureMap-282x300.png" alt="" title="textureMap" width="282" height="300" class="alignnone size-medium wp-image-1339" /></a></p>
<p>The idea behind texture mapping is fairly straight forward. For each vertex of a polygon, we map that vertex to a coordinate on the texture. In the image above, the polygon is a square constructed with a triangle strip and has 4 vertices. We map each vertex of the square to a coordinate on the texture. We store the texture coordinates into an array called a texture coordinate array. Once we have the vertex array (for the vertices of the polygon) and the texture coordinate array, we send those off to OpenGL. </p>
<h4><span style="color: #ff6600;"><strong>A Few Things to Remember</strong></span></h4>
<p>1. Texture coordinates must in the range of 0 to 1, with the origin at (0, 0).<br />
2. On iOS (and hence when texture is loaded in Cocos2d), the texture is vertically flipped about the x-axis.<br />
3. The width and height of an OpenGL texture must be in powers of 2. </p>
<p>To solve the #2 above, we&#8217;re going to simply flip the mapping like in the image below so that the top maps to the bottom and bottom maps to the top.</p>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/texturemapflipped/" rel="attachment wp-att-1346"><img src="http://www.uchidacoonga.com/wp-content/uploads/2012/03/textureMapFlipped-300x288.png" alt="" title="textureMapFlipped" width="200" height="188" class="alignnone size-medium wp-image-1346" /></a></p>
<h4><span style="color: #ff6600;"><strong>Let&#8217;s Code!</strong></span></h4>
<p>We will be loading the texture using Cocos2d. We then define the vertices for the square (triangle strip), vertices for the texture coordinates and then send them off to OpenGL. Here is MyNode.h and MyNode.m. Instantiate an instance of MyNode in HelloWorldLayer and add it to the layer. When you run it, you should see an image of Kirby on the screen mapped to the square polygon. The code is commented so you should be able to easily follow it.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;CCNode.h&quot;</span>
&nbsp;
<span style="color: #a61390;">typedef</span> <span style="color: #a61390;">struct</span> <span style="color: #002200;">&#123;</span>
    GLfloat x;
    GLfloat y;
<span style="color: #002200;">&#125;</span> Vertex2D;
&nbsp;
<span style="color: #a61390;">static</span> inline Vertex2D Vertex2DMake<span style="color: #002200;">&#40;</span>GLfloat inX, GLfloat inY<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
    Vertex2D ret;
    ret.x <span style="color: #002200;">=</span> inX;
    ret.y <span style="color: #002200;">=</span> inY;
    <span style="color: #a61390;">return</span> ret;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">@interface</span> MyNode <span style="color: #002200;">:</span> CCNode <span style="color: #002200;">&#123;</span>
    Vertex2D vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">4</span><span style="color: #002200;">&#93;</span>;   <span style="color: #11740a; font-style: italic;">// For the polygon</span>
    Vertex2D textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">4</span><span style="color: #002200;">&#93;</span>; <span style="color: #11740a; font-style: italic;">// For the texture</span>
&nbsp;
    CCTexture2D <span style="color: #002200;">*</span>texture;
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@end</span></pre></div></div>


<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
<span style="color: #6e371a;">#import &quot;MyNode.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@implementation</span> MyNode
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> init <span style="color: #002200;">&#123;</span>
    self <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Load the texture</span>
    texture <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCTextureCache sharedTextureCache<span style="color: #002200;">&#93;</span> addImage<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;Kirby.png&quot;</span><span style="color: #002200;">&#93;</span>;        
&nbsp;
    GLfloat size <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>texture pixelsWide<span style="color: #002200;">&#93;</span><span style="color: #002200;">/</span><span style="color: #2400d9;">2</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Vertices for the square (we'll be using a triangle strip)</span>
    vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">0</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #002200;">-</span>size, size<span style="color: #002200;">&#41;</span>;
    vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>size, size<span style="color: #002200;">&#41;</span>;
    vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #002200;">-</span>size, <span style="color: #002200;">-</span>size<span style="color: #002200;">&#41;</span>;
    vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">3</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>size, <span style="color: #002200;">-</span>size<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Because the texture is flipped about its x-axis,</span>
    <span style="color: #11740a; font-style: italic;">// we flip the y coordinates to correct this.</span>
    textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">0</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">0</span>, <span style="color: #2400d9;">0</span><span style="color: #002200;">&#41;</span>;
    textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">1</span>, <span style="color: #2400d9;">0</span><span style="color: #002200;">&#41;</span>;
    textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">0</span>, <span style="color: #2400d9;">1</span><span style="color: #002200;">&#41;</span>;
    textCoords<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">3</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">1</span>, <span style="color: #2400d9;">1</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// If you use the mapping below, then the image will</span>
    <span style="color: #11740a; font-style: italic;">// be flipped. To correct this, use the coordinates</span>
    <span style="color: #11740a; font-style: italic;">// above, or save the image in a flipped state so it</span>
    <span style="color: #11740a; font-style: italic;">// will be unflipped when mapped!</span>
    <span style="color: #11740a; font-style: italic;">/*
    textCoords[0] = Vertex2DMake(0, 1);
    textCoords[1] = Vertex2DMake(1, 1);
    textCoords[2] = Vertex2DMake(0, 0);
    textCoords[3] = Vertex2DMake(1, 0);
     */</span>
&nbsp;
    <span style="color: #a61390;">return</span> self;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> draw <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// Following two states must be enabled for texture mapping</span>
    glEnable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
&nbsp;
    glDisableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Bind the OpenGL texture</span>
    glBindTexture<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D, <span style="color: #002200;">&#91;</span>texture name<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// The vertices for the polygon</span>
    glVertexPointer<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>, GL_FLOAT, <span style="color: #2400d9;">0</span>, vertices<span style="color: #002200;">&#41;</span>;
    <span style="color: #11740a; font-style: italic;">// The vertices for the texture</span>
    glTexCoordPointer<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>, GL_FLOAT, <span style="color: #2400d9;">0</span>, textCoords<span style="color: #002200;">&#41;</span>;
    <span style="color: #11740a; font-style: italic;">// Send it off to OpenGL</span>
    glDrawArrays<span style="color: #002200;">&#40;</span>GL_TRIANGLE_STRIP, <span style="color: #2400d9;">0</span>, <span style="color: #2400d9;">4</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Re-enable states</span>
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@end</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Source and Video</strong></span></h4>
<p>You can download the source code for the tutorial <a href="http://www.uchidacoonga.com/manualTextureMap.zip">here.</a></p>
<p><object width="560" height="315"><param name="movie" value="http://www.youtube.com/v/LELnnOJdMwU?version=3&amp;hl=en_US&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/LELnnOJdMwU?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/">Soft Body Physics with Box2d and Cocos2d Part 1/4</a><br />
<a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/">Soft Body Physics with Box2d and Cocos2d Part 2/4</a><br />
<a href="http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/">Soft Body Physics with Box2d and Cocos2d Part 4/4</a></p>

<p><a href="http://feedads.g.doubleclick.net/~a/JaYs5Jw61k4DSFFVR76m9gS7M3k/0/da"><img src="http://feedads.g.doubleclick.net/~a/JaYs5Jw61k4DSFFVR76m9gS7M3k/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/JaYs5Jw61k4DSFFVR76m9gS7M3k/1/da"><img src="http://feedads.g.doubleclick.net/~a/JaYs5Jw61k4DSFFVR76m9gS7M3k/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Soft Body Physics With Box2d (and Cocos2d) Part 2/4</title>
		<link>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/</link>
		<comments>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/#comments</comments>
		<pubDate>Sat, 31 Mar 2012 15:50:47 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1329</guid>
		<description><![CDATA[Prerequisites This is the second part to a four part series about simulating a soft body physics in Box2d. Before continuing, you should read and understand the following two tutorials. 1. Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan) 2. Soft Body Physics with Box2d and Cocos2d Part 1/4 We will be using OpenGL to <a href='http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>Prerequisites</strong></span></h4>
<p>This is the second part to a four part series about simulating a soft body physics in Box2d. Before continuing, you should read and understand the following two tutorials.</p>
<p>1. <a href="http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/">Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan)</a><br />
2. <a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/">Soft Body Physics with Box2d and Cocos2d Part 1/4</a></p>
<p>We will be using OpenGL to map a circle to the Box2d wheel object, using a triangle fan.</p>
<h4><span style="color: #ff6600;"><strong>Making the Wheel Bounce</strong></span></h4>
<p>We will also be making the wheel bounce when you touch the screen. In HelloWorldLayer, we will be calling the bounce method in MyNode, which will apply an impulse force to the wheel. Here is the code to do this. If you are unfamiliar with how Box2d works, please refer to the Box2d tutorials on this site.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> bounce <span style="color: #002200;">&#123;</span>
    b2Vec2 impulse <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>innerCircleBody<span style="color: #002200;">-</span>&gt;GetMass<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">*</span> <span style="color: #2400d9;">0</span>, innerCircleBody<span style="color: #002200;">-</span>&gt;GetMass<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">*</span> <span style="color: #2400d9;">150</span><span style="color: #002200;">&#41;</span>;
    b2Vec2 impulsePoint <span style="color: #002200;">=</span> innerCircleBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
    innerCircleBody<span style="color: #002200;">-</span>&gt;ApplyLinearImpulse<span style="color: #002200;">&#40;</span>impulse, impulsePoint<span style="color: #002200;">&#41;</span>;	        
<span style="color: #002200;">&#125;</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Drawing the Circle</strong></span></h4>
<p>Inside the draw method is where we can place custom OpenGL calls in Cocos2d, so this is where we will be drawing the circle. What we are doing is using the Box2d objects we defined as the vertices for the triangle fan. It&#8217;s a simple matter of calculating the vertices to send to OpenGL. Here is the draw method of MyNode.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> draw <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// Using the wheel defined by the box2d objects, we'll be mapping a circle on</span>
    <span style="color: #11740a; font-style: italic;">// top of it using a triangle fan. First, we calculate the center. The center</span>
    <span style="color: #11740a; font-style: italic;">// needs to be mulitplied by the PTM_RATIO (to get the pixel coordinate from box2d coordinate)</span>
    <span style="color: #11740a; font-style: italic;">// and also must be offset by the current position (remember, in HelloWorldLayer, we set</span>
    <span style="color: #11740a; font-style: italic;">// the position to the center of the screen (myNode.position = ccp(240, 160).</span>
    triangleFanPos<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">0</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>innerCircleBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.x <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.x, 
                                     innerCircleBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.y <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.y<span style="color: #002200;">&#41;</span>;
&nbsp;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Use each box2d body as a vertex and calculate coordinate for the triangle fan</span>
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        b2Body <span style="color: #002200;">*</span>currentBody <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>bodies objectAtIndex<span style="color: #002200;">:</span>i<span style="color: #002200;">&#93;</span> pointerValue<span style="color: #002200;">&#93;</span>;
        Vertex2D pos <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>currentBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.x <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.x, 
                                    currentBody<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.y <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">-</span> self.position.y<span style="color: #002200;">&#41;</span>;
        triangleFanPos<span style="color: #002200;">&#91;</span>i<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>pos.x, pos.y<span style="color: #002200;">&#41;</span>;
    <span style="color: #002200;">&#125;</span>
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Loop back to close off the triangle fan</span>
    triangleFanPos<span style="color: #002200;">&#91;</span>NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> triangleFanPos<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Disable the states. We're not texturing mapping just yet.</span>
    glDisable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
    glDisableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
    glDisableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Set the color to red</span>
    glColor4f<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">1</span>.f, <span style="color: #2400d9;">0</span>.f, <span style="color: #2400d9;">0</span>.f, <span style="color: #2400d9;">1</span>.f<span style="color: #002200;">&#41;</span>;
&nbsp;
    glVertexPointer<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>, GL_FLOAT, <span style="color: #2400d9;">0</span>, triangleFanPos<span style="color: #002200;">&#41;</span>;
    <span style="color: #11740a; font-style: italic;">// Number of vertices is NUM_SEGMENTS+2 because we have the origin</span>
    <span style="color: #11740a; font-style: italic;">// plus the loop back to close off the triangle fan</span>
    glDrawArrays<span style="color: #002200;">&#40;</span>GL_TRIANGLE_FAN, <span style="color: #2400d9;">0</span>, NUM_SEGMENTS<span style="color: #002200;">+</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Re-enable states</span>
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
    glEnable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Source and Video</strong></span></h4>
<p>You can download the full source for this tutorial <a href="http://www.uchidacoonga.com/SquisyPolygon.zip">here.</a></p>
<p><object width="560" height="315"><param name="movie" value="http://www.youtube.com/v/y9OnUdG12B8?version=3&amp;hl=en_US&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/y9OnUdG12B8?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/">Soft Body Physics with Box2d and Cocos2d Part 1/4</a><br />
<a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/">Soft Body Physics with Box2d and Cocos2d Part 3/4</a><br />
<a href="http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/">Soft Body Physics with Box2d and Cocos2d Part 4/4</a></p>

<p><a href="http://feedads.g.doubleclick.net/~a/H6ZQ-euSDVWubTqpXnJ87BOac8M/0/da"><img src="http://feedads.g.doubleclick.net/~a/H6ZQ-euSDVWubTqpXnJ87BOac8M/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/H6ZQ-euSDVWubTqpXnJ87BOac8M/1/da"><img src="http://feedads.g.doubleclick.net/~a/H6ZQ-euSDVWubTqpXnJ87BOac8M/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Soft Body Physics With Box2d (and Cocos2d) Part 1/4</title>
		<link>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/</link>
		<comments>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/#comments</comments>
		<pubDate>Fri, 30 Mar 2012 05:07:12 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1273</guid>
		<description><![CDATA[Rigid Body and Soft Body Physics This is the first of a 4 part series which will show you how to simulate a simple soft body physics object in Box2d. We will be attempting to draw a fully texture mapped, squishy object. In part 1, I will be constructing the physics object. Box2d is a <a href='http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>Rigid Body and Soft Body Physics</strong></span></h4>
<p>This is the first of a 4 part series which will show you how to simulate a simple soft body physics object in Box2d. We will be attempting to draw a fully texture mapped, squishy object. In part 1, I will be constructing the physics object.</p>
<p>Box2d is a rigid body physics engine. This means that the physics bodies are non-deformable. But imagine a scenario where you do want a deformable physics body. A good example is a water balloon. The water balloon should be squishy and should deform when it hits the ground. A soft body physics engine can handle something like this. Unfortunately, Box2d is not a soft body physics engine. But there is a way to simulate this in Box2d using distance joints.</p>
<h4><span style="color: #ff6600;"><strong>Distance Joint</strong></span></h4>
<p>A distance joint keeps the distance between two points a constant. The key feature of distance joint that will help us achieve the soft body physics simulation is that a distance joint can be made soft to simulate a springy connection. We will be creating a wheel like structure in Box2d and then connecting all of the bodies with a springy distance joint in order to simulate the squishiness. </p>
<p>You can read more about distance joints <a href="http://www.box2d.org/manual.html">here.</a></p>
<h4><span style="color: #ff6600;"><strong>Wheel Construction</strong></span></h4>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/screen-shot-2012-03-30-at-12-46-36-am/" rel="attachment wp-att-1280"><img src="http://www.uchidacoonga.com/wp-content/uploads/2012/03/Screen-Shot-2012-03-30-at-12.46.36-AM.png" alt="" title="Screen Shot 2012-03-30 at 12.46.36 AM" width="200" height="172" class="alignleft size-full wp-image-1280" /></a> The shape to the left is what we will be constructing in Box2d. The greater the number of circles in the outer ring, the better the circle will look. In a later part of the tutorial, I will go through constructing a polygon in OpenGL to map to this Box2d wheel construction.</p>
<p>The wheel is constructed of circles surrounding an inner circle. All of the circles are connected to each other by distance joints. The distance joints are configured to be springy. You may find it helpful to read through <a href="http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/">this post</a>, which explains drawing a circle in Cocos2d using OpenGL. The math part will be relevant to our discussion here.<br />
<br/></p>
<h4><span style="color: #ff6600;"><strong>Let&#8217;s Start</strong></span></h4>
<p>Create a Box2d Cocos2d project. You will want to turn on the b2DebugDraw::e_jointBit so that you can see the joints in the debug drawing. I will not go through how to set up the physics world here. You can find articles on this site that can explain it to you if you do not know how to do this. Also, sample source code will be posted so you can refer to that as well. In HelloWorldLayer.mm, you will see the code below. MyNode is the our custom node which will hold our squishy physics object. We add this to the layer and move it to the center of the screen.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// MyNode is the squishy physics</span>
MyNode <span style="color: #002200;">*</span>node <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>MyNode node<span style="color: #002200;">&#93;</span>;
node.position <span style="color: #002200;">=</span> ccp<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">240</span>, <span style="color: #2400d9;">160</span><span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#91;</span>node createPhysicsObject<span style="color: #002200;">:</span>world<span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#91;</span>self addChild<span style="color: #002200;">:</span>node<span style="color: #002200;">&#93;</span>;</pre></div></div>

<p>Here is the source code for MyNode. We create the outer circles and lay them out in a circle pattern around the center circle. Then we connect them all together with distance joints. The code is well commented so you should be able to figure out what&#8217;s going on from reading it.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;CCNode.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Box2D.h&quot;</span>
&nbsp;
<span style="color: #a61390;">typedef</span> <span style="color: #a61390;">struct</span> <span style="color: #002200;">&#123;</span>
    GLfloat x;
    GLfloat y;
<span style="color: #002200;">&#125;</span> Vertex2D;
&nbsp;
<span style="color: #a61390;">static</span> inline Vertex2D Vertex2DMake<span style="color: #002200;">&#40;</span>GLfloat inX, GLfloat inY<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
    Vertex2D ret;
    ret.x <span style="color: #002200;">=</span> inX;
    ret.y <span style="color: #002200;">=</span> inY;
    <span style="color: #a61390;">return</span> ret;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">@interface</span> MyNode <span style="color: #002200;">:</span> CCNode <span style="color: #002200;">&#123;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> createPhysicsObject<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>b2World<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>world;
<span style="color: #a61390;">@end</span></pre></div></div>


<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
<span style="color: #6e371a;">#import &quot;MyNode.h&quot;</span>
&nbsp;
<span style="color: #6e371a;">#define PTM_RATIO 32.f</span>
&nbsp;
<span style="color: #a61390;">@implementation</span> MyNode
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> init <span style="color: #002200;">&#123;</span>
    self <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span>;   
&nbsp;
    <span style="color: #a61390;">return</span> self;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">// The number of outer circles (more, the smoother the circle)</span>
<span style="color: #6e371a;">#define NUM_SEGMENTS 12</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> createPhysicsObject<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>b2World <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>world <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// Center is the position of circle that is in the center</span>
    b2Vec2 center <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">240</span><span style="color: #002200;">/</span>PTM_RATIO, <span style="color: #2400d9;">260</span><span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
&nbsp;
    b2CircleShape circleShape;
    circleShape.m_radius <span style="color: #002200;">=</span> 0.25f;
&nbsp;
    b2FixtureDef fixtureDef;
    fixtureDef.shape <span style="color: #002200;">=</span> <span style="color: #002200;">&amp;</span>circleShape;
    fixtureDef.density <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.1</span>;
    fixtureDef.restitution <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.05</span>;
    fixtureDef.friction <span style="color: #002200;">=</span> <span style="color: #2400d9;">1.0</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// The greater the number, the more springy</span>
    <span style="color: #a61390;">float</span> springiness <span style="color: #002200;">=</span> <span style="color: #2400d9;">4.0</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Delta angle to step by</span>
    <span style="color: #a61390;">float</span> deltaAngle <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>.f <span style="color: #002200;">*</span> M_PI<span style="color: #002200;">&#41;</span> <span style="color: #002200;">/</span> NUM_SEGMENTS;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Radius of the wheel</span>
    <span style="color: #a61390;">float</span> radius <span style="color: #002200;">=</span> <span style="color: #2400d9;">50</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Need to store the bodies so that we can refer back</span>
    <span style="color: #11740a; font-style: italic;">// to it when we connect the joints</span>
    <span style="color: #400080;">NSMutableArray</span> <span style="color: #002200;">*</span>bodies <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #400080;">NSMutableArray</span> array<span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// For each segment...</span>
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #11740a; font-style: italic;">// Current angle</span>
        <span style="color: #a61390;">float</span> theta <span style="color: #002200;">=</span> deltaAngle<span style="color: #002200;">*</span>i;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Calcualte the x and y based on theta </span>
        <span style="color: #a61390;">float</span> x <span style="color: #002200;">=</span> radius<span style="color: #002200;">*</span>cosf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span>;
        <span style="color: #a61390;">float</span> y <span style="color: #002200;">=</span> radius<span style="color: #002200;">*</span>sinf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Remember to divide by PTM_RATIO to convert to Box2d coordinates</span>
        b2Vec2 circlePosition <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>x<span style="color: #002200;">/</span>PTM_RATIO, y<span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
&nbsp;
        b2BodyDef bodyDef;
        bodyDef.type <span style="color: #002200;">=</span> b2_dynamicBody;
        <span style="color: #11740a; font-style: italic;">// Position should be relative to the center</span>
        bodyDef.position <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>center <span style="color: #002200;">+</span> circlePosition<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Create the body and fixture</span>
        b2Body <span style="color: #002200;">*</span>body;
        body <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;CreateBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>bodyDef<span style="color: #002200;">&#41;</span>;
        body<span style="color: #002200;">-</span>&gt;CreateFixture<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>fixtureDef<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Add the body to the array to connect joints to it</span>
        <span style="color: #11740a; font-style: italic;">// later. b2Body is a C++ object, so must wrap it</span>
        <span style="color: #11740a; font-style: italic;">// in NSValue when inserting into it NSMutableArray</span>
        <span style="color: #002200;">&#91;</span>bodies addObject<span style="color: #002200;">:</span><span style="color: #002200;">&#91;</span><span style="color: #400080;">NSValue</span> valueWithPointer<span style="color: #002200;">:</span>body<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#93;</span>;
    <span style="color: #002200;">&#125;</span>
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Circle at the center (inner circle)</span>
    b2BodyDef innerCircleBodyDef;
    innerCircleBodyDef.type <span style="color: #002200;">=</span> b2_dynamicBody;    
    <span style="color: #11740a; font-style: italic;">// Position is at the center</span>
    innerCircleBodyDef.position <span style="color: #002200;">=</span> center;    
    b2Body <span style="color: #002200;">*</span>innerCircleBody <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;CreateBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>innerCircleBodyDef<span style="color: #002200;">&#41;</span>;
    innerCircleBody<span style="color: #002200;">-</span>&gt;CreateFixture<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>fixtureDef<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Connect the joints    </span>
    b2DistanceJointDef jointDef;
    <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>; i &lt; NUM_SEGMENTS; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #11740a; font-style: italic;">// The neighbor.</span>
        <span style="color: #a61390;">int</span> neighborIndex <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>i <span style="color: #002200;">+</span> <span style="color: #2400d9;">1</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">%</span> NUM_SEGMENTS;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Get the current body and the neighbor</span>
        b2Body <span style="color: #002200;">*</span>currentBody <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>bodies objectAtIndex<span style="color: #002200;">:</span>i<span style="color: #002200;">&#93;</span> pointerValue<span style="color: #002200;">&#93;</span>;
        b2Body <span style="color: #002200;">*</span>neighborBody <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>bodies objectAtIndex<span style="color: #002200;">:</span>neighborIndex<span style="color: #002200;">&#93;</span> pointerValue<span style="color: #002200;">&#93;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Connect the outer circles to each other</span>
        jointDef.Initialize<span style="color: #002200;">&#40;</span>currentBody, neighborBody,
                            currentBody<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>, 
                            neighborBody<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#41;</span>;
        jointDef.collideConnected <span style="color: #002200;">=</span> <span style="color: #a61390;">true</span>;
        jointDef.frequencyHz <span style="color: #002200;">=</span> springiness;
        jointDef.dampingRatio <span style="color: #002200;">=</span> 0.5f;
&nbsp;
        world<span style="color: #002200;">-</span>&gt;CreateJoint<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>jointDef<span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Connect the center circle with other circles        </span>
        jointDef.Initialize<span style="color: #002200;">&#40;</span>currentBody, innerCircleBody, currentBody<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>, center<span style="color: #002200;">&#41;</span>;
        jointDef.collideConnected <span style="color: #002200;">=</span> <span style="color: #a61390;">true</span>;
        jointDef.frequencyHz <span style="color: #002200;">=</span> springiness;
        jointDef.dampingRatio <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.5</span>;
&nbsp;
        world<span style="color: #002200;">-</span>&gt;CreateJoint<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>jointDef<span style="color: #002200;">&#41;</span>;
    <span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">@end</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Video and Code</strong></span></h4>
<p>You can download the sample source for this article <a href="http://www.uchidacoonga.com/SquishyBox2d.zip">here.</a></p>
<p><object width="560" height="315"><param name="movie" value="http://www.youtube.com/v/7z1ZiJy8CaQ?version=3&amp;hl=en_US&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/7z1ZiJy8CaQ?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p><a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-24/">Soft Body Physics with Box2d and Cocos2d Part 2/4</a><br />
<a href="http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-34/">Soft Body Physics with Box2d and Cocos2d Part 3/4</a><br />
<a href="http://www.uchidacoonga.com/2012/04/soft-body-physics-with-box2d-and-cocos2d-part-44/">Soft Body Physics with Box2d and Cocos2d Part 4/4</a></p>

<p><a href="http://feedads.g.doubleclick.net/~a/bfRjawDvwQIK-znPUU1dWvZgBrw/0/da"><img src="http://feedads.g.doubleclick.net/~a/bfRjawDvwQIK-znPUU1dWvZgBrw/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/bfRjawDvwQIK-znPUU1dWvZgBrw/1/da"><img src="http://feedads.g.doubleclick.net/~a/bfRjawDvwQIK-znPUU1dWvZgBrw/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2012/03/soft-body-physics-with-box2d-and-cocos2d-part-14/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Quick Tip: Mixing OpenGL and Cocos2d (Triangle Fan)</title>
		<link>http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/</link>
		<comments>http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/#comments</comments>
		<pubDate>Fri, 23 Mar 2012 23:27:17 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1200</guid>
		<description><![CDATA[Cocos2d and OpenGL Cocos2d hides most of the complexities of OpenGL, but every now and then you will be forced to write some custom OpenGL code. You can override the draw method of CCNode to perform your custom OpenGL drawing. You don&#8217;t have to write the code for scaling, rotating or translating inside the draw <a href='http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>Cocos2d and OpenGL</strong></span></h4>
<p>Cocos2d hides most of the complexities of OpenGL, but every now and then you will be forced to write some custom OpenGL code.  You can override the draw method of CCNode to perform your custom OpenGL drawing. You don&#8217;t have to write the code for scaling, rotating or translating inside the draw method.  Cocos2d will handle that for you.  For example, if you manually draw a circle inside the draw method, you can move it with openGL&#8217;s glTranslate() call. However, a simpler way is to just reposition it by modifying the position property of the node:</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">mNode.position <span style="color: #002200;">=</span> ccp<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">100</span>, <span style="color: #2400d9;">100</span><span style="color: #002200;">&#41;</span></pre></div></div>

<p>If you need a primer on OpenGL, a good resource is Jeff Lamarche&#8217;s tutorials  <a href="http://iphonedevelopment.blogspot.com/2009/05/opengl-es-from-ground-up-table-of.html" title="here." target="_blank">here.</a></p>
<h4><span style="color: #ff6600;"><strong>Triangle Fan</strong></span></h4>
<p><a href="http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/triangle_fan/" rel="attachment wp-att-1209"><img src="http://www.uchidacoonga.com/wp-content/uploads/2012/03/triangle_fan-300x280.png" alt="" title="triangle_fan" width="300" height="280" class="alignnone size-medium wp-image-1209" /></a><br />
For this quick tip, I will be drawing a circle using a triangle fan. Above is an image of a triangle fan. I&#8217;m going to be using a triangle fan to draw a circle on the screen. </p>
<p>It is pretty simple. First you define the origin, which is represented by 1 on the image. And then you define the rest of the vertices (2, 3, 4, 5, 6, 7) and then finally close it off by going back to 2. After you have defined all the vertices, you send it off to OpenGL to render it onto the screen.</p>
<h4><span style="color: #ff6600;"><strong>Easy Math</strong></span></h4>
<p>I want to draw a circle, and I do not want to manually enter in all the vertices. So I will be generating the vertices in code. If you remember back to high school math, the x and y of a circle can be calculated with the use of the sine and cosine functions. </p>
<pre>
x = radius * cosine(theta)
y = radius * sine(theta)
</pre>
<p>Simple, right?</p>
<h4><span style="color: #ff6600;"><strong>Code</strong></span></h4>
<p>First, create a Cocos2d project. Then create a class called MyNode, which inherits from CCNode. Inside HelloWorldLayer, create an instance of MyNode and add it to the scene like below. Notice that after the node has been added, I move it to position 200, 200 (I can do with OpenGL inside the draw method, but it&#8217;s faster and easier this way).</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">MyNode <span style="color: #002200;">*</span>n <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>MyNode node<span style="color: #002200;">&#93;</span>;
n.position <span style="color: #002200;">=</span> ccp<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">200</span>, <span style="color: #2400d9;">200</span><span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#91;</span>self addChild<span style="color: #002200;">:</span>n<span style="color: #002200;">&#93;</span>;</pre></div></div>

<p>Here is the MyNode.h.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;CCNode.h&quot;</span>
&nbsp;
<span style="color: #a61390;">typedef</span> <span style="color: #a61390;">struct</span> <span style="color: #002200;">&#123;</span>
    GLfloat x;
    GLfloat y;
<span style="color: #002200;">&#125;</span> Vertex2D;
&nbsp;
<span style="color: #a61390;">static</span> inline Vertex2D Vertex2DMake<span style="color: #002200;">&#40;</span>GLfloat inX, CGFloat inY<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
    Vertex2D ret;
    ret.x <span style="color: #002200;">=</span> inX;
    ret.y <span style="color: #002200;">=</span> inY;
    <span style="color: #a61390;">return</span> ret;
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@interface</span> MyNode <span style="color: #002200;">:</span> CCNode <span style="color: #002200;">&#123;</span>
    Vertex2D <span style="color: #002200;">*</span>vertices;
    <span style="color: #a61390;">float</span> radius;
    <span style="color: #a61390;">int</span> numSegments;
<span style="color: #002200;">&#125;</span></pre></div></div>

<p>And here is MyNode.m. I&#8217;ve commented the code, so it should be pretty easy to follow.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#import &quot;MyNode.h&quot;</span>
<span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@implementation</span> MyNode
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> init <span style="color: #002200;">&#123;</span>
    self <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span>;
    <span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>self<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #11740a; font-style: italic;">// Radius of circle</span>
        radius <span style="color: #002200;">=</span> <span style="color: #2400d9;">100</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Number segments of circle (bigger number, smoother circle)</span>
        numSegments <span style="color: #002200;">=</span> <span style="color: #2400d9;">10</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Angle to step by</span>
        <span style="color: #a61390;">float</span> deltaAngle <span style="color: #002200;">=</span> <span style="color: #2400d9;">2</span> <span style="color: #002200;">*</span> M_PI <span style="color: #002200;">/</span> numSegments;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Allocate memory for vertices. We need 1 extra for the origin</span>
        <span style="color: #11740a; font-style: italic;">// and another for the end.</span>
        vertices <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>Vertex2D<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span> <span style="color: #a61390;">malloc</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">sizeof</span><span style="color: #002200;">&#40;</span>Vertex2D<span style="color: #002200;">&#41;</span> <span style="color: #002200;">*</span> <span style="color: #002200;">&#40;</span>numSegments<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">+</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// The origin vertex</span>
        vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">0</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">0</span>, <span style="color: #2400d9;">0</span><span style="color: #002200;">&#41;</span>;
&nbsp;
        <span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span> i <span style="color: #002200;">=</span> <span style="color: #2400d9;">1</span>; i &lt;<span style="color: #002200;">=</span> numSegments; i<span style="color: #002200;">++</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
            GLfloat theta <span style="color: #002200;">=</span> deltaAngle<span style="color: #002200;">*</span><span style="color: #002200;">&#40;</span>i<span style="color: #002200;">-</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#41;</span>;
&nbsp;
            <span style="color: #11740a; font-style: italic;">// Calculate x and y based on theta</span>
            GLfloat x <span style="color: #002200;">=</span> radius <span style="color: #002200;">*</span> cosf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span>;
            GLfloat y <span style="color: #002200;">=</span> radius <span style="color: #002200;">*</span> sinf<span style="color: #002200;">&#40;</span>theta<span style="color: #002200;">&#41;</span>;
&nbsp;
            vertices<span style="color: #002200;">&#91;</span>i<span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> Vertex2DMake<span style="color: #002200;">&#40;</span>x, y<span style="color: #002200;">&#41;</span>;
        <span style="color: #002200;">&#125;</span>
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Close it off</span>
        vertices<span style="color: #002200;">&#91;</span>numSegments<span style="color: #002200;">+</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span> <span style="color: #002200;">=</span> vertices<span style="color: #002200;">&#91;</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #002200;">&#125;</span>
    <span style="color: #a61390;">return</span> self;
&nbsp;
<span style="color: #002200;">&#125;</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> draw <span style="color: #002200;">&#123;</span>
    <span style="color: #002200;">&#91;</span>super draw<span style="color: #002200;">&#93;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Disable these states before drawing else you won't see anything</span>
    glDisable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
    glDisableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
    glDisableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Set the color</span>
    glColor4f<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">1.0</span>, <span style="color: #2400d9;">0.0</span>, <span style="color: #2400d9;">0.0</span>, <span style="color: #2400d9;">1.0</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// First argument - 2 numbers per Vertex2D (x and y)</span>
    <span style="color: #11740a; font-style: italic;">// Second argument - data type</span>
    <span style="color: #11740a; font-style: italic;">// Third argument - stride (ignore for now)</span>
    <span style="color: #11740a; font-style: italic;">// Fourth argument - pass the vertices</span>
    glVertexPointer<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">2</span>, GL_FLOAT, <span style="color: #2400d9;">0</span>, vertices<span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Last argument - total number of vertices</span>
    glDrawArrays<span style="color: #002200;">&#40;</span>GL_TRIANGLE_FAN, <span style="color: #2400d9;">0</span>, <span style="color: #002200;">&#40;</span>numSegments<span style="color: #002200;">+</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// Renable disabled states</span>
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
    glEnableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
    glEnable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@end</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Source Code</strong></span></h4>
<p>You can find the source code for download <a href="http://www.uchidacoonga.com/OpenGL-ES-Beginning.zip">here.</a></p>
<p>It is based on Cocos2d 1.0.1 on Mac OS X Lion and XCode 4.3.</p>

<p><a href="http://feedads.g.doubleclick.net/~a/gwto1xoxS7J1ChglyQjh_a6C3mY/0/da"><img src="http://feedads.g.doubleclick.net/~a/gwto1xoxS7J1ChglyQjh_a6C3mY/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/gwto1xoxS7J1ChglyQjh_a6C3mY/1/da"><img src="http://feedads.g.doubleclick.net/~a/gwto1xoxS7J1ChglyQjh_a6C3mY/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2012/03/quick-tip-mixing-opengl-and-cocos2d-triangle-fan/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Quick Tip: Swapping out CCSprite</title>
		<link>http://www.uchidacoonga.com/2011/11/swapping-out-ccsprite/</link>
		<comments>http://www.uchidacoonga.com/2011/11/swapping-out-ccsprite/#comments</comments>
		<pubDate>Tue, 15 Nov 2011 02:04:08 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1197</guid>
		<description><![CDATA[Tip: Quick tip to swap out the image of a sprite that has already been initialized with an image. CCSprite *sprite = &#91;CCSprite spriteWithSpriteFrameName@&#34;oldImage.png&#34;&#93;; &#91;sprite setDisplayFrame:&#91;&#91;CCSpriteFrameCache sharedSpriteFrameCache&#93; spriteFrameByName:@&#34;newImage.png&#34;&#93;&#93;;]]></description>
			<content:encoded><![CDATA[<p>Tip:</p>
<p>Quick tip to swap out the image of a sprite that has already been initialized with an image.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">CCSprite <span style="color: #002200;">*</span>sprite <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>CCSprite spriteWithSpriteFrameName<span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;oldImage.png&quot;</span><span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#91;</span>sprite setDisplayFrame<span style="color: #002200;">:</span><span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCSpriteFrameCache sharedSpriteFrameCache<span style="color: #002200;">&#93;</span> spriteFrameByName<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;newImage.png&quot;</span><span style="color: #002200;">&#93;</span><span style="color: #002200;">&#93;</span>;</pre></div></div>


<p><a href="http://feedads.g.doubleclick.net/~a/J9JXofSWjuZU41S5ycOh4LZYBD4/0/da"><img src="http://feedads.g.doubleclick.net/~a/J9JXofSWjuZU41S5ycOh4LZYBD4/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/J9JXofSWjuZU41S5ycOh4LZYBD4/1/da"><img src="http://feedads.g.doubleclick.net/~a/J9JXofSWjuZU41S5ycOh4LZYBD4/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2011/11/swapping-out-ccsprite/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Box2d Collision Filtering Demystified</title>
		<link>http://www.uchidacoonga.com/2011/09/box2d-collision-filtering-demystified/</link>
		<comments>http://www.uchidacoonga.com/2011/09/box2d-collision-filtering-demystified/#comments</comments>
		<pubDate>Tue, 13 Sep 2011 17:03:18 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1177</guid>
		<description><![CDATA[To Collide or Not to Collide When you create simple Box2d objects, they will collide with each other. But what if you do not want an object colliding with all other objects? What if you want certain objects colliding with only certain other objects? How do we achieve this finer grained control? Say that our <a href='http://www.uchidacoonga.com/2011/09/box2d-collision-filtering-demystified/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<h4><span style="color: #ff6600;"><strong>To Collide or Not to Collide</strong></span></h4>
<p>When you create simple Box2d objects, they will collide with each other. But what if you do not want an object colliding with all other objects? What if you want certain objects colliding with only certain other objects? How do we achieve this finer grained control? </p>
<p>Say that our game has three game objects: 1. Player, 2. Enemies and 3. Power Ups. Normally, all three objects would collide with each other. But what if what we really want to do is this:</p>
<p>1. Player and enemies can collide<br />
2. Player and power ups can collide<br />
3. Enemies and power ups SHOULD NOT collide</p>
<p>There is something called a groupIndex. Two fixtures with the same positive groupIndex will always collide. And two fixtures with negative groupIndex will never collide. But what if we want an even finer grained control than this?</p>
<h4><span style="color: #ff6600;"><strong>Category Bits and Mask Bits</strong></span></h4>
<p>There are two properties called categoryBits and maskBits which you can set for a fixture. An integer is 16 bits, so you can have up to 16 different categories. What do I mean by this? See below for 16 possible categories (in binary and also in hex).</p>
<p>Category_01 = 0000 0000 0000 0001    (0&#215;0001)<br />
Category_02 = 0000 0000 0000 0010    (0&#215;0002)<br />
Category_03 = 0000 0000 0000 0100    (0&#215;0004)<br />
&#8230;<br />
Category_15 = 0100 0000 0000 0000    (0&#215;4000)<br />
Category_16 = 1000 0000 0000 0000    (0&#215;8000)</p>
<p>The categoryBits and maskBits can be used together with bitwise operators to control collision between objects.</p>
<h4><span style="color: #ff6600;"><strong>Example</strong></span></h4>
<p>So let us put the above information to practical use. We have three game objects, so we can define three categories for our game objects.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #6e371a;">#define CATEGORY_PLAYER    0x0001     // 0000 0000 0000 0001</span>
<span style="color: #6e371a;">#define CATEGORY_ENEMY     0x0002     // 0000 0000 0000 0010</span>
<span style="color: #6e371a;">#define CATEGORY_POWERUP   0x0004     // 0000 0000 0000 0100</span></pre></div></div>

<p>When we define the fixture for our game objects, we can now set the categoryBits and the maskBits like so. The code below says that the player will collide with enemies and power ups.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">b2FixtureDef playerFixture;
... 
playerFixture.filter.categoryBits <span style="color: #002200;">=</span> CATEGORY_PLAYER;
playerFixture.filter.maskBits <span style="color: #002200;">=</span> CATEGORY_ENEMY | CATEGORY_POWERUP;</pre></div></div>

<p>The code below says that the power up only collides with the player (and not enemies)</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">b2FixtureDef powerupFixture;
... 
powerupFixture.filter.categoryBits <span style="color: #002200;">=</span> CATEGORY_POWERUP;
powerupFixture.filter.maskBits <span style="color: #002200;">=</span> CATEGORY_PLAYER;</pre></div></div>

<p>And finally, the code below says that enemies only collides with the player (and not the power up)</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">b2FixtureDef enemyFixture;
... 
enemyFixture.filter.categoryBits <span style="color: #002200;">=</span> CATEGORY_ENEMY;
enemyFixture.filter.maskBits <span style="color: #002200;">=</span> CATEGORY_PLAYER;</pre></div></div>

<p>Once you set the categoryBits and maskBits, Box2d uses these and the rule below to determine whether the objects collide.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">uint16 catA <span style="color: #002200;">=</span> fixtureA.filter.categoryBits;
uint16 maskA <span style="color: #002200;">=</span> fixtureA.filter.maskBits;
uint16 catB <span style="color: #002200;">=</span> fixtureB.filter.categoryBits;
uint16 maskB <span style="color: #002200;">=</span> fixtureB.filter.maskBits;
&nbsp;
<span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span><span style="color: #002200;">&#40;</span>catA <span style="color: #002200;">&amp;</span> maskB<span style="color: #002200;">&#41;</span> <span style="color: #002200;">!=</span> <span style="color: #2400d9;">0</span> <span style="color: #002200;">&amp;&amp;</span> <span style="color: #002200;">&#40;</span>catB <span style="color: #002200;">&amp;</span> maskA<span style="color: #002200;">&#41;</span> <span style="color: #002200;">!=</span> <span style="color: #2400d9;">0</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// fixtures can collide</span>
<span style="color: #002200;">&#125;</span></pre></div></div>

<p>It is important to remember that if you want two fixtures to collide, the maskBits must include the categoryBits of the other fixture with which you want it to collide. Meaning, in the code below, the the player&#8217;s maskBits must include CATEGORY_ENEMY <strong>AND</strong> the enemy&#8217;s maskBits must also include CATEGORY_PLAYER. It is not enough to set it for just one of the fixtures. In other words, just because you set the player&#8217;s maskBits to collide with the enemy does not mean that they will collide. If A is set to collide with B, B must also be set to collide with A in order for the two to actually collide.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">playerDef.categoryBits <span style="color: #002200;">=</span> CATEGORY_PLAYER;
playerDef.maskBits <span style="color: #002200;">=</span> CATEGORY_ENEMY;  <span style="color: #11740a; font-style: italic;">// &lt;-- point to the enemy</span>
&nbsp;
enemyDef.categoryBits <span style="color: #002200;">=</span> CATEGORY_ENEMY;
enemyDef.maskBits <span style="color: #002200;">=</span> CATEGORY_PLAYER;  <span style="color: #11740a; font-style: italic;">// &lt;-- point to the player</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Conclusion</strong></span></h4>
<p>This should be fairly flexible enough for a great deal of your needs. If you need even more control than this, then I would suggest taking a look at Box2d&#8217;s contact listener&#8217;s PreSolve event (b2ContactListener::PreSolve).</p>
<p>Happy coding!</p>

<p><a href="http://feedads.g.doubleclick.net/~a/_tKaH23UQXA6KVKcnHZKLbJF870/0/da"><img src="http://feedads.g.doubleclick.net/~a/_tKaH23UQXA6KVKcnHZKLbJF870/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/_tKaH23UQXA6KVKcnHZKLbJF870/1/da"><img src="http://feedads.g.doubleclick.net/~a/_tKaH23UQXA6KVKcnHZKLbJF870/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2011/09/box2d-collision-filtering-demystified/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Improve Performance and Reduce Memory with PVRTC Textures and Cocos2d</title>
		<link>http://www.uchidacoonga.com/2011/07/pvrtc-textures-and-cocos2d/</link>
		<comments>http://www.uchidacoonga.com/2011/07/pvrtc-textures-and-cocos2d/#comments</comments>
		<pubDate>Sun, 03 Jul 2011 17:35:52 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[Cocos2D]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1130</guid>
		<description><![CDATA[Hello everyone! A few months have passed since I posted Simple Platformer Using Cocos2d and Box2d with Collision Detection. I have received many positive feedbacks and interest on the tutorial. I am glad that it has been helpful for so many in the community! Also, I would like to share the good news that the <a href='http://www.uchidacoonga.com/2011/07/pvrtc-textures-and-cocos2d/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<p>Hello everyone! A few months have passed since I posted <a href="http://www.uchidacoonga.com/2011/03/simple-platformer-using-cocos2d-and-box2d-with-collision-detection/">Simple Platformer Using Cocos2d and Box2d with Collision Detection</a>. I have received many positive feedbacks and interest on the tutorial. I am glad that it has been helpful for so many in the community! </p>
<p>Also, I would like to share the good news that the game we have been working on has been picked up by a major publisher. We hope to release it around September, so please stay tuned! The game has been built using the very same articles and tutorials found on this blog. </p>
<h4><span style="color: #ff6600;"><strong>What Is It?</strong></span></h4>
<p>PVRTC-I and -II are a family of lossy, fixed-rate texture compression formats used in PowerVR&#8217;s MBX and SGX technologies. PVRTC is the compressed texture format used in all generations of the iPhone, iPod Touch and iPad (<a href="http://en.wikipedia.org/wiki/PVRTC">source)</a>. You will see PVR and PVRTC being used interchangeably. They are not the same. They key thing to keep in mind is that a PVR is uncompressed, and PVRTC is compressed. Also, a PVR is a container which may contain various formats (a PVRTC is contained within a PVR file, for example). Some uncompressed PVR types are:</p>
<ul>
<li><strong>RGBA8888</strong>: 32-bit texture with alpha channel, best image quality</li>
<li><strong>RGBA4444</strong>: 16-bit texture with alpha channel, good image quality</li>
<li><strong>RGB565</strong>:  16-bit texture without alpha channel, good image quality but no alpha (transparency)</li>
</ul>
<p>Here are the PVRTC types,  which are compressed and lossy (meaning, quality is degraded):</p>
<ul>
<li><strong>PVRTC4BPP</strong>: Compressed format, 4 bits per pixel, ok image quality</li>
<li><strong>PVRTC2BPP</strong>: Compressed format, 2 bits per pixel, poor image quality</li>
</ul>
<h4><span style="color: #ff6600;"><strong>Pros and Cons</strong></span></h4>
<p>Why would you want to use a PVRTC texture? Because, it is the native texture format and is hardware accelerated. This translates to faster loading time than PNGs. Have you ever been plagued by long load times? Then PVRTC may be the answer. But even better, it will use less memory on the device and give you a performance boost. </p>
<p>It all sounds great! But wait, there is a downside. The downside is that because it is a lossy compression, the quality of your textures will suffer. Given a PNG of the same dimension, a PVRTC4BPP texture will take up more disk space <i>and</i> it will look worse (you will see artifacts, especially if you rely heavily on transparency or have a lot of gradients). </p>
<h4><span style="color: #ff6600;"><strong>Why Size Does Matter</strong></span></h4>
<p>As you may have already guessed, the amount of space used increases as the quality increases. This means RGBA8888 uses the most amount of space (in memory AND on disk). Here is a handy formula to calculate how much space will be used.</p>
<p><em>numBytes = width * height * bitsPerPixel / 8</em></p>
<p>What this means is that given a 1024&#215;1024 image, a RGBA8888 texture will require 4 MB of space. And a PVRTC4BPP will take 512 KB space. Why does size on disk matter at all? There is a very good reason for keeping the amount of space taken by your textures as low as possible.</p>
<p>This is due to the 20 MB size limit imposed by AT&#038;T (I do not know about Verizon or other international providers). If your application is over 20 MB, users will not be able to download your application over the air from their devices. They will have to go to a computer that has iTunes installed and download it from their Mac or PC. If you are working on a game, then you have to start rationing out disk space as textures aren&#8217;t the only assets that will require disk space (the other big one being audio).</p>
<p>So which one should you pick? A PNG will take less space on disk, but the loading time will be longer. The amount of space a PNG will take once loaded to memory is dependent on the pixel format that you set in Cocos2d, like so:</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #002200;">&#91;</span>CCTexture2D setDefaultAlphaPixelFormat<span style="color: #002200;">:</span>kTexture2DPixelFormat_RGBA4444<span style="color: #002200;">&#93;</span>;
<span style="color: #11740a; font-style: italic;">// Available textures </span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_RGBA8888 - 32-bit texture with Alpha channel</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_RGB565 - 16-bit texture without Alpha channel</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_A8 - 8-bit textures used as masks</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_I8 - 8-bit intensity texture</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_AI88 - 16-bit textures used as masks</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_RGBA4444 - 16-bit textures: RGBA4444</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_RGB5A1 - 16-bit textures: RGB5A1</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_PVRTC4 - 4-bit PVRTC-compressed texture: PVRTC4</span>
<span style="color: #11740a; font-style: italic;">// kCCTexture2DPixelFormat_PVRTC2 - 2-bit PVRTC-compressed texture: PVRTC2</span></pre></div></div>

<p>Using a PVRTC will give you better performance and faster loading times, but worse quality and more disk space. Well, I guess you&#8217;ll have to pick the lesser of the two evils <img src='http://www.uchidacoonga.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />  You can always mix PNGs and PVRTCs, so that is another option. It is definitely a balancing act.</p>
<h4><span style="color: #ff6600;"><strong>Tools of the Trade</strong></span></h4>
<p>So, how exactly do you create a PVRTC texture from a PNG? There are a few tools available. </p>
<ul>
<li>
<a href="http://www.texturepacker.com/">TexturePacker</a> allows you create sprite sheets with an option for saving the textures as a PVRTC. </li>
<li><a href="http://developer.apple.com/library/ios/#documentation/3DDrawing/Conceptual/OpenGLES_ProgrammingGuide/TextureTool/TextureTool.html">TextureTool</a> is a tool in the iOS SDK that allows you to compress your textures into a PVR texture format.</li>
<li><a href="http://www.imgtec.com/powervr/insider/powervr-pvrtextool.asp">PVRTexTool</a> is the one I use. It is a free tool which comes with both a GUI and a command line utility.</li>
</ul>
<p>I can&#8217;t speak for TexturePacker because I haven&#8217;t used it before, but with the other two,  you will have to tinker with it to have it generate the correct textures. Let me save you the frustration and give you a simple PVRTexTool command-line command that I use to convert my <a href="http://zwoptexapp.com/">Zwoptex</a> created texture atlas from a PNG to a PVR.</p>
<p><em>PVRTexTool -fOGLPVRTC4 -iMyAtlas.png -yflip0 -premultalpha -pvrtiterations8</em></p>
<p>The command above will create a PVRTC4BPP texture which will be saved as MyAtlas.pvr. If you are curious about what all the options mean, then take a look at the manual that comes with PVRTexTool, which has detailed information about them.</p>
<h4><span style="color: #ff6600;"><strong>How to Load it Using Cocos2d</strong></span></h4>
<p>This part is pretty trivial. Here is the code to load the PVRTC texture in Cocos2d. I&#8217;m assuming that you are loading a sprite atlas.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;">CCTexture2D <span style="color: #002200;">*</span>tex <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCTextureCache sharedTextureCache<span style="color: #002200;">&#93;</span> addImage<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;MyAtlas.pvr&quot;</span><span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCSpriteFrameCache sharedSpriteFrameCache<span style="color: #002200;">&#93;</span> addSpriteFramesWithFile<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;MyAtlas.plist&quot;</span> texture<span style="color: #002200;">:</span>tex<span style="color: #002200;">&#93;</span>;</pre></div></div>

<p>I hope this has been helpful. And for those in the United States, happy 4th of July! I live near Washington D.C., but I am not courageous enough to brave the traffic to go see the fireworks <img src='http://www.uchidacoonga.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />  I-66 will do that to you (if you live around here, you&#8217;ll know what I mean!).</p>

<p><a href="http://feedads.g.doubleclick.net/~a/qEu-8OlYqyvUhoIn9HNK9shEOhI/0/da"><img src="http://feedads.g.doubleclick.net/~a/qEu-8OlYqyvUhoIn9HNK9shEOhI/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/qEu-8OlYqyvUhoIn9HNK9shEOhI/1/da"><img src="http://feedads.g.doubleclick.net/~a/qEu-8OlYqyvUhoIn9HNK9shEOhI/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2011/07/pvrtc-textures-and-cocos2d/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>Simple Platformer Using Cocos2d and Box2d with Collision Detection</title>
		<link>http://www.uchidacoonga.com/2011/03/simple-platformer-using-cocos2d-and-box2d-with-collision-detection/</link>
		<comments>http://www.uchidacoonga.com/2011/03/simple-platformer-using-cocos2d-and-box2d-with-collision-detection/#comments</comments>
		<pubDate>Fri, 18 Mar 2011 02:02:56 +0000</pubDate>
		<dc:creator>Min</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[iPhone Development]]></category>
		<category><![CDATA[Objective-C]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[Box2D]]></category>
		<category><![CDATA[Cocos2D]]></category>

		<guid isPermaLink="false">http://www.uchidacoonga.com/?p=1056</guid>
		<description><![CDATA[I received a few requests for a simple Mario-like platformer tutorial. So I am keeping my promise. The sample is far from a full fledged Mario clone, but I hope it it can at least start you off in the right direction. This tutorial builds upon concepts covered in &#8220;Beginning Box2d Physics Engine&#8221; and &#8220;Side <a href='http://www.uchidacoonga.com/2011/03/simple-platformer-using-cocos2d-and-box2d-with-collision-detection/' class='excerpt-more'>... [READ THE FULL ARTICLE]</a>]]></description>
			<content:encoded><![CDATA[<p>I received a few requests for a simple Mario-like platformer tutorial. So I am keeping my promise. The sample is far from a full fledged Mario clone, but I hope it it can at least start you off in the right direction.  This tutorial builds upon concepts covered in <a href="http://www.uchidacoonga.com/2011/01/lesson-1-beginning-box2d-physics-engine/">&#8220;Beginning Box2d Physics Engine&#8221;</a> and <a href="http://www.uchidacoonga.com/2011/01/side-scrolling-the-background-in-box2d/">&#8220;Side Scrolling the Background in Box2d and Cocos2d&#8221;</a>, so I suggest reading them first. </p>
<h4><span style="color: #ff6600;"><strong>What&#8217;s Covered?</strong></span></h4>
<p>I will be covering the following topics in this tutorial.</p>
<ul>
<li>Simple object oriented game design</li>
<li>User input / touch detection</li>
<li>Applying forces to game objects to make it move and jump</li>
<li>Collision detection</li>
</ul>
<h4><span style="color: #ff6600;"><strong>Simple Object Oriented Game Design</strong></span></h4>
<p>The example app will be a very rudimentary platformer, with some platforms and the player represented by a circle. Again, I am creating the physics world by reading in the tile map designed in the program Tiled as described in my previous tutorial. The newest version of Tiled at the time of this writing is 0.6.0, and you must go into preferences and set gzip as the default compression or Cocos2d will fail to load the tile map file. The player will be able to move to the right (moving to the left is left to the reader as an exercise) and jump. The app has only two objects. The first is the player object and the other is the platform object. Both the player and the platform object will inherit from the general GameObject class. The general GameObject class inherits from Cocos2d&#8217;s CCSprite object and has a property called &#8220;type&#8221; which is used to distinguish between a player and a platform. Having our objects inherit from the same parent object (GameObject) will make it easier to identify objects when we handle collision detection. </p>
<p>Here is the code for the GameObject class. Notice that it inherits from CCSprite and that we initialize the default type to kGameObjectNone (there is an enum defined in Constants.h, which is not shown here but will be included in the sample source).</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// GameObject.h</span>
<span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Constants.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@interface</span> GameObject <span style="color: #002200;">:</span> CCSprite <span style="color: #002200;">&#123;</span>
    GameObjectType  type;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">@property</span> <span style="color: #002200;">&#40;</span>nonatomic, readwrite<span style="color: #002200;">&#41;</span> GameObjectType type;
<span style="color: #a61390;">@end</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">////////////////////////////////////////////////////////</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">// GameObject.m</span>
<span style="color: #a61390;">@implementation</span> GameObject
<span style="color: #a61390;">@synthesize</span> type;
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span>init
<span style="color: #002200;">&#123;</span>
    self <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span>;
    <span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>self<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        type <span style="color: #002200;">=</span> kGameObjectNone;
    <span style="color: #002200;">&#125;</span>
&nbsp;
    <span style="color: #a61390;">return</span> self;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span>dealloc
<span style="color: #002200;">&#123;</span>
    <span style="color: #002200;">&#91;</span>super dealloc<span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@end</span></pre></div></div>

<p>The next one shown is the Player class. Note that the extension for the Player class is Player.mm (two m&#8217;s). Do you see the Box2d&#8217;s b2Body object that is declared? Box2d is written in C++ not Objective-C, so this is the reason we must make the Player class support both Objective-C and C++ by naming the extension with two m&#8217;s. With only one, you will see a lot of errors during compilation. You can see that the type is set to kGameObjectPlayer. You will see the &#8220;type&#8221; come into play when we discuss collision detection later.</p>
<p>The Player class will be in charge of creating the Box2d physics object and adding itself into the physics world when the createBox2dObject method is called. We set the custom user data (playerBodyDef.userData) to &#8220;self&#8221; so that we can access the Cocos2d object from the Box2d&#8217;s contact listener. It also has methods to make the Player move to the right and jump, which will also be discussed later in the tutorial.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// Player.h</span>
<span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Box2D.h&quot;</span>
<span style="color: #6e371a;">#import &quot;GameObject.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@interface</span> Player <span style="color: #002200;">:</span> GameObject <span style="color: #002200;">&#123;</span>
    b2Body          <span style="color: #002200;">*</span>body;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> createBox2dObject<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>b2World<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>world;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> jump;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> moveRight;
&nbsp;
<span style="color: #a61390;">@property</span> <span style="color: #002200;">&#40;</span>nonatomic, readwrite<span style="color: #002200;">&#41;</span> b2Body <span style="color: #002200;">*</span>body;
<span style="color: #a61390;">@end</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">///////////////////////////////////////////////////////</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">// Player.mm</span>
<span style="color: #6e371a;">#import &quot;Player.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Constants.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@implementation</span> Player
<span style="color: #a61390;">@synthesize</span> body;
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> init <span style="color: #002200;">&#123;</span>
	<span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span><span style="color: #002200;">&#40;</span>self <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
		type <span style="color: #002200;">=</span> kGameObjectPlayer;
	<span style="color: #002200;">&#125;</span>
	<span style="color: #a61390;">return</span> self;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> createBox2dObject<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>b2World<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>world <span style="color: #002200;">&#123;</span>
    b2BodyDef playerBodyDef;
	playerBodyDef.type <span style="color: #002200;">=</span> b2_dynamicBody;
	playerBodyDef.position.Set<span style="color: #002200;">&#40;</span>self.position.x<span style="color: #002200;">/</span>PTM_RATIO, self.position.y<span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
	playerBodyDef.userData <span style="color: #002200;">=</span> self;
	playerBodyDef.fixedRotation <span style="color: #002200;">=</span> <span style="color: #a61390;">true</span>;
&nbsp;
	body <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;CreateBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>playerBodyDef<span style="color: #002200;">&#41;</span>;
&nbsp;
	b2CircleShape circleShape;
	circleShape.m_radius <span style="color: #002200;">=</span> <span style="color: #2400d9;">0.7</span>;
	b2FixtureDef fixtureDef;
	fixtureDef.shape <span style="color: #002200;">=</span> <span style="color: #002200;">&amp;</span>circleShape;
	fixtureDef.density <span style="color: #002200;">=</span> 1.0f;
	fixtureDef.friction <span style="color: #002200;">=</span> 1.0f;
	fixtureDef.restitution <span style="color: #002200;">=</span>  0.0f;
	body<span style="color: #002200;">-</span>&gt;CreateFixture<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>fixtureDef<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> moveRight <span style="color: #002200;">&#123;</span>
    b2Vec2 impulse <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>7.0f, 0.0f<span style="color: #002200;">&#41;</span>;
    body<span style="color: #002200;">-</span>&gt;ApplyLinearImpulse<span style="color: #002200;">&#40;</span>impulse, body<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;		
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> jump <span style="color: #002200;">&#123;</span>
    b2Vec2 impulse <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>4.0f, 15.0f<span style="color: #002200;">&#41;</span>;
    body<span style="color: #002200;">-</span>&gt;ApplyLinearImpulse<span style="color: #002200;">&#40;</span>impulse, body<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;		    
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@end</span></pre></div></div>

<p>As for the platform object, there isn&#8217;t a specific Platform object. For convenience, we simply allocate a GameObject object and specifically set the type to kGameObjectPlatform (see makeBox2dObjectAt method in GameScene way below). </p>
<h4><span style="color: #ff6600;"><strong>User Input / Touch Detection</strong></span></h4>
<p>The following two lines inside GameScene&#8217;s init method are responsible for enabling the touch input.  The swallowsTouches argument on line 3 says that whatever touches that GameScene receives is &#8220;swallowed&#8221; or ends in GameScene and is not further propagated.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
</pre></td><td class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// Inside GameScene's init method</span>
self.isTouchEnabled <span style="color: #002200;">=</span> <span style="color: #a61390;">YES</span>;
<span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCTouchDispatcher sharedDispatcher<span style="color: #002200;">&#93;</span> addTargetedDelegate<span style="color: #002200;">:</span>self priority<span style="color: #002200;">:</span><span style="color: #2400d9;">0</span> swallowsTouches<span style="color: #002200;">:</span><span style="color: #a61390;">YES</span><span style="color: #002200;">&#93;</span>;</pre></td></tr></table></div>

<p>The method below is called when the mouse is clicked in the simulator or the screen is touched on the device. We get the location of the touch, and if the touch is on the left half of the screen, we move the player to the right. If the touch is on the right half of the screen, we make the player jump. We are not using it in this tutorial, but if you need it, then there is also a complimentary method to detect when the touch has ended. Note that this code is for a single touch, not multi-touches.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// GameScene.mm</span>
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">BOOL</span><span style="color: #002200;">&#41;</span> ccTouchBegan<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>UITouch <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>touch withEvent<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>UIEvent <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>event <span style="color: #002200;">&#123;</span>    
    CGPoint location <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>touch locationInView<span style="color: #002200;">:</span><span style="color: #002200;">&#91;</span>touch view<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#93;</span>;
    location <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCDirector sharedDirector<span style="color: #002200;">&#93;</span> convertToGL<span style="color: #002200;">:</span>location<span style="color: #002200;">&#93;</span>;
    <span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>location.x &lt;<span style="color: #002200;">=</span> screenSize.width <span style="color: #002200;">/</span> <span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #002200;">&#91;</span>player moveRight<span style="color: #002200;">&#93;</span>;        
    <span style="color: #002200;">&#125;</span> <span style="color: #a61390;">else</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #002200;">&#91;</span>player jump<span style="color: #002200;">&#93;</span>;
    <span style="color: #002200;">&#125;</span>
    <span style="color: #a61390;">return</span> TRUE;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> ccTouchEnded<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>UITouch <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>touch withEvent<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>UIEvent <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>event <span style="color: #002200;">&#123;</span>
    CCLOG<span style="color: #002200;">&#40;</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;Touch ended&quot;</span><span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Applying Forces to Game Objects to Make it Move and Jump</strong></span></h4>
<p>To make the player move and jump, we apply a force to the player object. Recall that the Player class has the createBox2dObject method which should be called to add a physics object representing the player into the physics world. To move the player to the right, we simply tell Box2d to apply a positive &#8216;x&#8217; force to the physics object that represents the player. And to make it jump, we apply a positive &#8216;x&#8217; force along with a positive &#8216;y&#8217; force to the physics object. In this case, we are applying an impulse force (it&#8217;s a sudden burst of force) but you are not limited to it (please see the Box2d manual for information on other kind of forces). All the rest is handled by the Box2d physics engine. Once the force has been applied, we update the player&#8217;s position in the main game loop with the new position provided to us by the physics engine (see the complete GameScene source further down, inside the update method).</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> moveRight <span style="color: #002200;">&#123;</span>
    b2Vec2 impulse <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>7.0f, 0.0f<span style="color: #002200;">&#41;</span>;
    body<span style="color: #002200;">-</span>&gt;ApplyLinearImpulse<span style="color: #002200;">&#40;</span>impulse, body<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;		
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> jump <span style="color: #002200;">&#123;</span>
    b2Vec2 impulse <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>4.0f, 15.0f<span style="color: #002200;">&#41;</span>;
    body<span style="color: #002200;">-</span>&gt;ApplyLinearImpulse<span style="color: #002200;">&#40;</span>impulse, body<span style="color: #002200;">-</span>&gt;GetWorldCenter<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;		    
<span style="color: #002200;">&#125;</span></pre></div></div>

<h4><span style="color: #ff6600;"><strong>Collision Detection</strong></span></h4>
<p>For our simple example, only two objects exist in the world (player and platform). In order to detect when the player has made contact with the platform and when the player has lost contact with the platform, we must set up a contact listener and tell Box2d to use said contact listener. The contact listener is a C++ class which inherits from Box2d&#8217;s b2ContactListener class. </p>
<p>The two functions that we are most interested in are BeginContact and EndContact. As the function name suggests, BeginContact is called whenever two objects in the world make contact with each other. And EndContact is called as soon as the contact is broken.  You see that a b2Contact object is passed to the functions, which can be used to get the user data. The b2Contact object has two function calls GetFixtureA() and GetFixtureB() which can be used to return the two Box2d bodies involved in the collision, and subsequently the user data (our GameObject objects) stored in them. Recall that all the objects in our app is inherited from the GameObject class, so we can safely cast the user data for both to GameObjects. Once we have the two GameObjects, we can check the &#8220;type&#8221; property of each of the objects to check whether it is the player or the platform. It is important to remember that no guarantee is made as to which object of the two objects is the player object or the platform object. It is up to us to determine their types, so both objects must be checked to see if it is one or the other.</p>
<p>To help keep the code cleaner and easier to read, there are two macros called IS_PLAYER(x,y) and IS_PLATFORM(x,y) which test whether either one of the the objects is a player or a platform. For this simple example, a simple message is printed to the console when the contact is made or lost. In a real game, you could, for example, play a sound effect when two objects collide. Also, please remember that although it is tempting to implement game logic that alters the physics world inside a contact callback, this is not allowed. The Box2d manual states that&#8230;</p>
<blockquote><p>&#8230;for example, you may have a collision that applies damage and try to destroy the associated actor and its rigid body. However, Box2D does not allow you to alter the physics world inside a callback because you might destroy objects that Box2D is currently processing, leading to orphaned pointers  (<a href="http://www.box2d.org/manual.html">http://www.box2d.org/manual.html</a>)</p></blockquote>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// ContactListener.h</span>
<span style="color: #6e371a;">#import &quot;Box2D.h&quot;</span>
&nbsp;
class ContactListener <span style="color: #002200;">:</span> public b2ContactListener <span style="color: #002200;">&#123;</span>
public<span style="color: #002200;">:</span>
	ContactListener<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
	~ContactListener<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
	virtual <span style="color: #a61390;">void</span> BeginContact<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact<span style="color: #002200;">&#41;</span>;
	virtual <span style="color: #a61390;">void</span> EndContact<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact<span style="color: #002200;">&#41;</span>;
	virtual <span style="color: #a61390;">void</span> PreSolve<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact, <span style="color: #a61390;">const</span> b2Manifold <span style="color: #002200;">*</span>oldManifold<span style="color: #002200;">&#41;</span>;
	virtual <span style="color: #a61390;">void</span> PostSolve<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact, <span style="color: #a61390;">const</span> b2ContactImpulse <span style="color: #002200;">*</span>impulse<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>;
&nbsp;
<span style="color: #11740a; font-style: italic;">/////////////////////////////</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">// ContactListener.mm</span>
<span style="color: #6e371a;">#import &quot;ContactListener.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Constants.h&quot;</span>
<span style="color: #6e371a;">#import &quot;GameObject.h&quot;</span>
&nbsp;
<span style="color: #6e371a;">#define IS_PLAYER(x, y)         (x.type == kGameObjectPlayer || y.type == kGameObjectPlayer)</span>
<span style="color: #6e371a;">#define IS_PLATFORM(x, y)       (x.type == kGameObjectPlatform || y.type == kGameObjectPlatform)</span>
&nbsp;
&nbsp;
ContactListener<span style="color: #002200;">::</span>ContactListener<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
ContactListener<span style="color: #002200;">::</span>~ContactListener<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">void</span> ContactListener<span style="color: #002200;">::</span>BeginContact<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
	GameObject <span style="color: #002200;">*</span>o1 <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>GameObject<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>contact<span style="color: #002200;">-</span>&gt;GetFixtureA<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetUserData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
	GameObject <span style="color: #002200;">*</span>o2 <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>GameObject<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>contact<span style="color: #002200;">-</span>&gt;GetFixtureB<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetUserData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
	<span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>IS_PLATFORM<span style="color: #002200;">&#40;</span>o1, o2<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&amp;&amp;</span> IS_PLAYER<span style="color: #002200;">&#40;</span>o1, o2<span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        CCLOG<span style="color: #002200;">&#40;</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;-----&gt; Player made contact with platform!&quot;</span><span style="color: #002200;">&#41;</span>;
    <span style="color: #002200;">&#125;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">void</span> ContactListener<span style="color: #002200;">::</span>EndContact<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
	GameObject <span style="color: #002200;">*</span>o1 <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>GameObject<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>contact<span style="color: #002200;">-</span>&gt;GetFixtureA<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetUserData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
	GameObject <span style="color: #002200;">*</span>o2 <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>GameObject<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>contact<span style="color: #002200;">-</span>&gt;GetFixtureB<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">-</span>&gt;GetUserData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
	<span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>IS_PLATFORM<span style="color: #002200;">&#40;</span>o1, o2<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&amp;&amp;</span> IS_PLAYER<span style="color: #002200;">&#40;</span>o1, o2<span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        CCLOG<span style="color: #002200;">&#40;</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;-----&gt; Player lost contact with platform!&quot;</span><span style="color: #002200;">&#41;</span>;
    <span style="color: #002200;">&#125;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">void</span> ContactListener<span style="color: #002200;">::</span>PreSolve<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact, <span style="color: #a61390;">const</span> b2Manifold <span style="color: #002200;">*</span>oldManifold<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #a61390;">void</span> ContactListener<span style="color: #002200;">::</span>PostSolve<span style="color: #002200;">&#40;</span>b2Contact <span style="color: #002200;">*</span>contact, <span style="color: #a61390;">const</span> b2ContactImpulse <span style="color: #002200;">*</span>impulse<span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
<span style="color: #002200;">&#125;</span></pre></div></div>

<p>You then register the contact listener when you set up the physics world.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"> contactListener <span style="color: #002200;">=</span> new ContactListener<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
 world<span style="color: #002200;">-</span>&gt;SetContactListener<span style="color: #002200;">&#40;</span>contactListener<span style="color: #002200;">&#41;</span>;</pre></div></div>

<h4><span style="color: #ff6600;"><strong>Wrap-up and Loose Ends</strong></span></h4>
<p>Below is the code for the GameScene class. If certain things look unfamiliar to you, please refer to the previous two tutorials that I mentioned in the beginning of the article. If you have read those tutorials, then things should be familiar except for the contact listener registration code and the touch detection code, which I have already explained earlier in the tutorial. </p>
<p>You can find the complete source code for download and the demo video at the end of the tutorial.</p>

<div class="wp_syntax"><div class="code"><pre class="objc" style="font-family:monospace;"><span style="color: #11740a; font-style: italic;">// GameScene.h</span>
&nbsp;
<span style="color: #6e371a;">#import &quot;cocos2d.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Box2D.h&quot;</span>
<span style="color: #6e371a;">#import &quot;GLES-Render.h&quot;</span>
<span style="color: #6e371a;">#import &quot;ContactListener.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@class</span> Player;
&nbsp;
<span style="color: #a61390;">@interface</span> GameScene <span style="color: #002200;">:</span> CCLayer
<span style="color: #002200;">&#123;</span>
    CGSize screenSize;
	b2World<span style="color: #002200;">*</span> world;
	GLESDebugDraw <span style="color: #002200;">*</span>m_debugDraw;
	CCTMXTiledMap <span style="color: #002200;">*</span>tileMapNode;	
    Player <span style="color: #002200;">*</span>player;
    ContactListener <span style="color: #002200;">*</span>contactListener;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">+</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> scene;
<span style="color: #a61390;">@end</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">///////////////////////////////////////////////</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">// GameScene.mm</span>
<span style="color: #6e371a;">#import &quot;GameScene.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Constants.h&quot;</span>
<span style="color: #6e371a;">#import &quot;Player.h&quot;</span>
<span style="color: #6e371a;">#import &quot;GameObject.h&quot;</span>
&nbsp;
<span style="color: #a61390;">@interface</span> GameScene<span style="color: #002200;">&#40;</span>Private<span style="color: #002200;">&#41;</span> 
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> setupPhysicsWorld;
<span style="color: #a61390;">@end</span>
&nbsp;
<span style="color: #a61390;">@implementation</span> GameScene
&nbsp;
<span style="color: #002200;">+</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> scene
<span style="color: #002200;">&#123;</span>
	<span style="color: #11740a; font-style: italic;">// 'scene' is an autorelease object.</span>
	CCScene <span style="color: #002200;">*</span>scene <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>CCScene node<span style="color: #002200;">&#93;</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// 'layer' is an autorelease object.</span>
	GameScene <span style="color: #002200;">*</span>layer <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>GameScene node<span style="color: #002200;">&#93;</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// add layer as a child to scene</span>
	<span style="color: #002200;">&#91;</span>scene addChild<span style="color: #002200;">:</span> layer<span style="color: #002200;">&#93;</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// return the scene</span>
	<span style="color: #a61390;">return</span> scene;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> makeBox2dObjAt<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>CGPoint<span style="color: #002200;">&#41;</span>p 
			   withSize<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>CGPoint<span style="color: #002200;">&#41;</span>size 
				dynamic<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">BOOL</span><span style="color: #002200;">&#41;</span>d 
			   rotation<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">long</span><span style="color: #002200;">&#41;</span>r 
			   friction<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">long</span><span style="color: #002200;">&#41;</span>f 
				density<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">long</span><span style="color: #002200;">&#41;</span>dens 
			restitution<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">long</span><span style="color: #002200;">&#41;</span>rest 
				  boxId<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">int</span><span style="color: #002200;">&#41;</span>boxId <span style="color: #002200;">&#123;</span>
&nbsp;
	<span style="color: #11740a; font-style: italic;">// Define the dynamic body.</span>
	<span style="color: #11740a; font-style: italic;">//Set up a 1m squared box in the physics world</span>
	b2BodyDef bodyDef;
<span style="color: #11740a; font-style: italic;">//	bodyDef.angle = r;</span>
&nbsp;
	<span style="color: #a61390;">if</span><span style="color: #002200;">&#40;</span>d<span style="color: #002200;">&#41;</span>
		bodyDef.type <span style="color: #002200;">=</span> b2_dynamicBody;
&nbsp;
	bodyDef.position.Set<span style="color: #002200;">&#40;</span>p.x<span style="color: #002200;">/</span>PTM_RATIO, p.y<span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
&nbsp;
    GameObject <span style="color: #002200;">*</span>platform <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>GameObject alloc<span style="color: #002200;">&#93;</span> init<span style="color: #002200;">&#93;</span>;
    <span style="color: #002200;">&#91;</span>platform setType<span style="color: #002200;">:</span>kGameObjectPlatform<span style="color: #002200;">&#93;</span>;
	bodyDef.userData <span style="color: #002200;">=</span> platform;
&nbsp;
	b2Body <span style="color: #002200;">*</span>body <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;CreateBody<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>bodyDef<span style="color: #002200;">&#41;</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// Define another box shape for our dynamic body.</span>
	b2PolygonShape dynamicBox;
	dynamicBox.SetAsBox<span style="color: #002200;">&#40;</span>size.x<span style="color: #002200;">/</span><span style="color: #2400d9;">2</span><span style="color: #002200;">/</span>PTM_RATIO, size.y<span style="color: #002200;">/</span><span style="color: #2400d9;">2</span><span style="color: #002200;">/</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// Define the dynamic body fixture.</span>
	b2FixtureDef fixtureDef;
	fixtureDef.shape <span style="color: #002200;">=</span> <span style="color: #002200;">&amp;</span>dynamicBox;	
	fixtureDef.density <span style="color: #002200;">=</span> dens;
	fixtureDef.friction <span style="color: #002200;">=</span> f;
	fixtureDef.restitution <span style="color: #002200;">=</span> rest;
	body<span style="color: #002200;">-</span>&gt;CreateFixture<span style="color: #002200;">&#40;</span><span style="color: #002200;">&amp;</span>fixtureDef<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> drawCollisionTiles <span style="color: #002200;">&#123;</span>
	CCTMXObjectGroup <span style="color: #002200;">*</span>objects <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>tileMapNode objectGroupNamed<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;Collision&quot;</span><span style="color: #002200;">&#93;</span>;
	<span style="color: #400080;">NSMutableDictionary</span> <span style="color: #002200;">*</span> objPoint;
&nbsp;
	<span style="color: #a61390;">int</span> x, y, w, h;	
	<span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span>objPoint <span style="color: #a61390;">in</span> <span style="color: #002200;">&#91;</span>objects objects<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
		x <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>objPoint valueForKey<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;x&quot;</span><span style="color: #002200;">&#93;</span> intValue<span style="color: #002200;">&#93;</span>;
		y <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>objPoint valueForKey<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;y&quot;</span><span style="color: #002200;">&#93;</span> intValue<span style="color: #002200;">&#93;</span>;
		w <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>objPoint valueForKey<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;width&quot;</span><span style="color: #002200;">&#93;</span> intValue<span style="color: #002200;">&#93;</span>;
		h <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>objPoint valueForKey<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;height&quot;</span><span style="color: #002200;">&#93;</span> intValue<span style="color: #002200;">&#93;</span>;	
&nbsp;
		CGPoint _point<span style="color: #002200;">=</span>ccp<span style="color: #002200;">&#40;</span>x<span style="color: #002200;">+</span>w<span style="color: #002200;">/</span><span style="color: #2400d9;">2</span>,y<span style="color: #002200;">+</span>h<span style="color: #002200;">/</span><span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span>;
		CGPoint _size<span style="color: #002200;">=</span>ccp<span style="color: #002200;">&#40;</span>w,h<span style="color: #002200;">&#41;</span>;
&nbsp;
		<span style="color: #002200;">&#91;</span>self makeBox2dObjAt<span style="color: #002200;">:</span>_point 
					withSize<span style="color: #002200;">:</span>_size 
					 dynamic<span style="color: #002200;">:</span><span style="color: #a61390;">false</span> 
					rotation<span style="color: #002200;">:</span><span style="color: #2400d9;">0</span> 
					friction<span style="color: #002200;">:</span>1.5f 
					 density<span style="color: #002200;">:</span>0.0f 
				 restitution<span style="color: #002200;">:</span><span style="color: #2400d9;">0</span> 
					   boxId<span style="color: #002200;">:-</span><span style="color: #2400d9;">1</span><span style="color: #002200;">&#93;</span>;
	<span style="color: #002200;">&#125;</span>
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> addScrollingBackgroundWithTileMap <span style="color: #002200;">&#123;</span>
	tileMapNode <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>CCTMXTiledMap tiledMapWithTMXFile<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;scroller.tmx&quot;</span><span style="color: #002200;">&#93;</span>;
	tileMapNode.anchorPoint <span style="color: #002200;">=</span> ccp<span style="color: #002200;">&#40;</span><span style="color: #2400d9;">0</span>, <span style="color: #2400d9;">0</span><span style="color: #002200;">&#41;</span>;
	<span style="color: #002200;">&#91;</span>self addChild<span style="color: #002200;">:</span>tileMapNode<span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
&nbsp;
<span style="color: #11740a; font-style: italic;">// initialize your instance here</span>
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">id</span><span style="color: #002200;">&#41;</span> init
<span style="color: #002200;">&#123;</span>
	<span style="color: #a61390;">if</span><span style="color: #002200;">&#40;</span> <span style="color: #002200;">&#40;</span>self<span style="color: #002200;">=</span><span style="color: #002200;">&#91;</span>super init<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
&nbsp;
		<span style="color: #11740a; font-style: italic;">// enable touches</span>
		self.isTouchEnabled <span style="color: #002200;">=</span> <span style="color: #a61390;">YES</span>;
&nbsp;
		screenSize <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>CCDirector sharedDirector<span style="color: #002200;">&#93;</span>.winSize;
		<span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCTouchDispatcher sharedDispatcher<span style="color: #002200;">&#93;</span> addTargetedDelegate<span style="color: #002200;">:</span>self priority<span style="color: #002200;">:</span><span style="color: #2400d9;">0</span> swallowsTouches<span style="color: #002200;">:</span><span style="color: #a61390;">YES</span><span style="color: #002200;">&#93;</span>;   
&nbsp;
		<span style="color: #002200;">&#91;</span>self setupPhysicsWorld<span style="color: #002200;">&#93;</span>;
&nbsp;
		<span style="color: #002200;">&#91;</span>self addScrollingBackgroundWithTileMap<span style="color: #002200;">&#93;</span>;
		<span style="color: #002200;">&#91;</span>self drawCollisionTiles<span style="color: #002200;">&#93;</span>;
&nbsp;
		player <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>Player spriteWithFile<span style="color: #002200;">:</span><span style="color: #bf1d1a;">@</span><span style="color: #bf1d1a;">&quot;Icon-Small.png&quot;</span><span style="color: #002200;">&#93;</span>;        
		player.position <span style="color: #002200;">=</span> ccp<span style="color: #002200;">&#40;</span>100.0f, 180.0f<span style="color: #002200;">&#41;</span>;
		<span style="color: #002200;">&#91;</span>player createBox2dObject<span style="color: #002200;">:</span>world<span style="color: #002200;">&#93;</span>;
&nbsp;
		<span style="color: #002200;">&#91;</span>self addChild<span style="color: #002200;">:</span>player<span style="color: #002200;">&#93;</span>;
&nbsp;
        <span style="color: #11740a; font-style: italic;">// Start main game loop</span>
		<span style="color: #002200;">&#91;</span>self scheduleUpdate<span style="color: #002200;">&#93;</span>;
	<span style="color: #002200;">&#125;</span>
	<span style="color: #a61390;">return</span> self;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> setupPhysicsWorld <span style="color: #002200;">&#123;</span>
    b2Vec2 gravity <span style="color: #002200;">=</span> b2Vec2<span style="color: #002200;">&#40;</span>0.0f, <span style="color: #002200;">-</span>9.8f<span style="color: #002200;">&#41;</span>;
    bool doSleep <span style="color: #002200;">=</span> <span style="color: #a61390;">true</span>;
    world <span style="color: #002200;">=</span> new b2World<span style="color: #002200;">&#40;</span>gravity, doSleep<span style="color: #002200;">&#41;</span>;
&nbsp;
    m_debugDraw <span style="color: #002200;">=</span> new GLESDebugDraw<span style="color: #002200;">&#40;</span>PTM_RATIO<span style="color: #002200;">&#41;</span>;
    world<span style="color: #002200;">-</span>&gt;SetDebugDraw<span style="color: #002200;">&#40;</span>m_debugDraw<span style="color: #002200;">&#41;</span>;
    uint32 flags <span style="color: #002200;">=</span> <span style="color: #2400d9;">0</span>;
    flags <span style="color: #002200;">+=</span> b2DebugDraw<span style="color: #002200;">::</span>e_shapeBit;
    m_debugDraw<span style="color: #002200;">-</span>&gt;SetFlags<span style="color: #002200;">&#40;</span>flags<span style="color: #002200;">&#41;</span>;
&nbsp;
    contactListener <span style="color: #002200;">=</span> new ContactListener<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
    world<span style="color: #002200;">-</span>&gt;SetContactListener<span style="color: #002200;">&#40;</span>contactListener<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> draw <span style="color: #002200;">&#123;</span>
	glDisable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
	glDisableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
	glDisableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
&nbsp;
	world<span style="color: #002200;">-</span>&gt;DrawDebugData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// restore default GL states</span>
	glEnable<span style="color: #002200;">&#40;</span>GL_TEXTURE_2D<span style="color: #002200;">&#41;</span>;
	glEnableClientState<span style="color: #002200;">&#40;</span>GL_COLOR_ARRAY<span style="color: #002200;">&#41;</span>;
	glEnableClientState<span style="color: #002200;">&#40;</span>GL_TEXTURE_COORD_ARRAY<span style="color: #002200;">&#41;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> update<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>ccTime<span style="color: #002200;">&#41;</span>dt <span style="color: #002200;">&#123;</span>
	<span style="color: #11740a; font-style: italic;">//It is recommended that a fixed time step is used with Box2D for stability</span>
	<span style="color: #11740a; font-style: italic;">//of the simulation, however, we are using a variable time step here.</span>
	<span style="color: #11740a; font-style: italic;">//You need to make an informed choice, the following URL is useful</span>
	<span style="color: #11740a; font-style: italic;">//http://gafferongames.com/game-physics/fix-your-timestep/</span>
&nbsp;
	int32 velocityIterations <span style="color: #002200;">=</span> <span style="color: #2400d9;">8</span>;
	int32 positionIterations <span style="color: #002200;">=</span> <span style="color: #2400d9;">1</span>;
&nbsp;
	<span style="color: #11740a; font-style: italic;">// Instruct the world to perform a single step of simulation. It is</span>
	<span style="color: #11740a; font-style: italic;">// generally best to keep the time step and iterations fixed.</span>
	world<span style="color: #002200;">-</span>&gt;Step<span style="color: #002200;">&#40;</span>dt, velocityIterations, positionIterations<span style="color: #002200;">&#41;</span>;
&nbsp;
&nbsp;
	<span style="color: #11740a; font-style: italic;">//Iterate over the bodies in the physics world</span>
	<span style="color: #a61390;">for</span> <span style="color: #002200;">&#40;</span>b2Body<span style="color: #002200;">*</span> b <span style="color: #002200;">=</span> world<span style="color: #002200;">-</span>&gt;GetBodyList<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>; b; b <span style="color: #002200;">=</span> b<span style="color: #002200;">-</span>&gt;GetNext<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
		<span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>b<span style="color: #002200;">-</span>&gt;GetUserData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">!=</span> <span style="color: #a61390;">NULL</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
			<span style="color: #11740a; font-style: italic;">//Synchronize the AtlasSprites position and rotation with the corresponding body</span>
			CCSprite <span style="color: #002200;">*</span>myActor <span style="color: #002200;">=</span> <span style="color: #002200;">&#40;</span>CCSprite<span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>b<span style="color: #002200;">-</span>&gt;GetUserData<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
			myActor.position <span style="color: #002200;">=</span> CGPointMake<span style="color: #002200;">&#40;</span> b<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.x <span style="color: #002200;">*</span> PTM_RATIO, 
							b<span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>.y <span style="color: #002200;">*</span> PTM_RATIO<span style="color: #002200;">&#41;</span>;
			myActor.rotation <span style="color: #002200;">=</span> <span style="color: #002200;">-</span><span style="color: #2400d9;">1</span> <span style="color: #002200;">*</span> CC_RADIANS_TO_DEGREES<span style="color: #002200;">&#40;</span>b<span style="color: #002200;">-</span>&gt;GetAngle<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span><span style="color: #002200;">&#41;</span>;
		<span style="color: #002200;">&#125;</span>	
	<span style="color: #002200;">&#125;</span>	
&nbsp;
	b2Vec2 pos <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>player body<span style="color: #002200;">&#93;</span><span style="color: #002200;">-</span>&gt;GetPosition<span style="color: #002200;">&#40;</span><span style="color: #002200;">&#41;</span>;
	CGPoint newPos <span style="color: #002200;">=</span> ccp<span style="color: #002200;">&#40;</span><span style="color: #002200;">-</span><span style="color: #2400d9;">1</span> <span style="color: #002200;">*</span> pos.x <span style="color: #002200;">*</span> PTM_RATIO <span style="color: #002200;">+</span> <span style="color: #2400d9;">50</span>, self.position.y <span style="color: #002200;">*</span> PTM_RATIO<span style="color: #002200;">&#41;</span>;	
	<span style="color: #002200;">&#91;</span>self setPosition<span style="color: #002200;">:</span>newPos<span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #002200;">-</span><span style="color: #002200;">&#40;</span><span style="color: #a61390;">BOOL</span><span style="color: #002200;">&#41;</span> ccTouchBegan<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>UITouch <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>touch withEvent<span style="color: #002200;">:</span><span style="color: #002200;">&#40;</span>UIEvent <span style="color: #002200;">*</span><span style="color: #002200;">&#41;</span>event <span style="color: #002200;">&#123;</span>    
    CGPoint location <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span>touch locationInView<span style="color: #002200;">:</span><span style="color: #002200;">&#91;</span>touch view<span style="color: #002200;">&#93;</span><span style="color: #002200;">&#93;</span>;
    location <span style="color: #002200;">=</span> <span style="color: #002200;">&#91;</span><span style="color: #002200;">&#91;</span>CCDirector sharedDirector<span style="color: #002200;">&#93;</span> convertToGL<span style="color: #002200;">:</span>location<span style="color: #002200;">&#93;</span>;
    <span style="color: #a61390;">if</span> <span style="color: #002200;">&#40;</span>location.x &lt;<span style="color: #002200;">=</span> screenSize.width <span style="color: #002200;">/</span> <span style="color: #2400d9;">2</span><span style="color: #002200;">&#41;</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #002200;">&#91;</span>player moveRight<span style="color: #002200;">&#93;</span>;        
    <span style="color: #002200;">&#125;</span> <span style="color: #a61390;">else</span> <span style="color: #002200;">&#123;</span>
        <span style="color: #002200;">&#91;</span>player jump<span style="color: #002200;">&#93;</span>;
    <span style="color: #002200;">&#125;</span>
	<span style="color: #a61390;">return</span> TRUE;
<span style="color: #002200;">&#125;</span>
&nbsp;
<span style="color: #11740a; font-style: italic;">// on &quot;dealloc&quot; you need to release all your retained objects</span>
<span style="color: #002200;">-</span> <span style="color: #002200;">&#40;</span><span style="color: #a61390;">void</span><span style="color: #002200;">&#41;</span> dealloc <span style="color: #002200;">&#123;</span>
    <span style="color: #11740a; font-style: italic;">// in case you have something to dealloc, do it in this method</span>
&nbsp;
    delete contactListener;
    delete world;
    world <span style="color: #002200;">=</span> <span style="color: #a61390;">NULL</span>;
&nbsp;
    delete m_debugDraw;
&nbsp;
    <span style="color: #11740a; font-style: italic;">// don't forget to call &quot;super dealloc&quot;</span>
    <span style="color: #002200;">&#91;</span>super dealloc<span style="color: #002200;">&#93;</span>;
<span style="color: #002200;">&#125;</span>
<span style="color: #a61390;">@end</span></pre></div></div>

<p>Demo video of the Simple Platformer in action<br />
<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/aBufs7MifMI?hl=en&#038;fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/aBufs7MifMI?hl=en&#038;fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object></p>
<p>Download source: <a href="http://www.uchidacoonga.com/SimplePlatformer.zip">SimplePlatformer.zip</a></p>
<p>Happy Saint Patrick&#8217;s Day! I wrote this tutorial while knocking back some Guinness, so I must blame alcohol if you see any glaring mistakes <img src='http://www.uchidacoonga.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>

<p><a href="http://feedads.g.doubleclick.net/~a/kFp9b-rhC3_jUQwPH5tpg7kYWHQ/0/da"><img src="http://feedads.g.doubleclick.net/~a/kFp9b-rhC3_jUQwPH5tpg7kYWHQ/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/kFp9b-rhC3_jUQwPH5tpg7kYWHQ/1/da"><img src="http://feedads.g.doubleclick.net/~a/kFp9b-rhC3_jUQwPH5tpg7kYWHQ/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uchidacoonga.com/2011/03/simple-platformer-using-cocos2d-and-box2d-with-collision-detection/feed/</wfw:commentRss>
		<slash:comments>60</slash:comments>
		</item>
	</channel>
</rss><!-- Dynamic page generated in 7.457 seconds. --><!-- Cached page generated by WP-Super-Cache on 2012-05-16 23:04:54 -->

