Game Development Reference
the same dimension: 320x480 points. A point equals 1 pixel on standard displays and 2
pixels on Retina displays. The size of the table in the Box2D physics world is unaffec-
ted by the actual screen resolution. If you work only with standard-resolution images
and have Retina support disabled in your app, the PTM-Ratio setting in PhysicsEditor
will equal that in Cocos2D.
Defining the Plunger Shape
Let's start with the plunger, the spring that kicks the ball into play. Select the plunger
image on the leftmost pane and click the Add polygon button on the center view's tool-
bar. This creates a new triangle shape on the center working area and highlights it. Be-
cause you need a rectangular shape, double-click one of the sides to add a fourth ver-
tex. If you add too many vertices, you can right-click or Option-click a vertex and
choose Delete point to remove it.
Move the four vertices to the four corners of the plunger by clicking and dragging
them. Create a rectangular shape that encompasses the entire plunger, including the
spring. Doing so will avoid problems when the ball by accident falls below the plun-
You may have noticed the little bluish circle with the + inside. This is the anchor point
of the shape, which coincides with the anchor point of the shape's sprite. Later, when
you position the shape in cocos2d, the shape's anchor point will be centered on the co-
ordinates you provide.
Move the anchor point to the bottom center of the plunger image to make it easier to
position the plunger. You can drag the blue circle, but in many cases you'll want to
place it very accurately. In those cases, you can modify the anchor point's absolute
pixel position or the relative position in the Parameters pane under Image Parameters.
Figure 13-4 shows the plunger shape being edited.