cocos2d for iPhone is a popular framework for building 2D games for iOS. Integrating AdMob ads into cocos2d apps has gotten significantly easier with the latest version of the framework; This blog post will show you three things to keep in mind using v0.99.5b3 or higher of the cocos2d framework. It is assumed that you already have some familiarity with cocos2d.

Initialization

Create and initialize a GADBannerView in the RootViewController class. You can put this code into a new method knowing that it will be called from the AppDelegate after the view hierarchy has been set up. This code adds to the standard banner view example in the docs.

Notice the addSubview: in initGADBanner:. Why did we add the GADBannerView directly to the RootViewController’s hierarchy instead of the cocos2d scene’s hierarchy? cocos2d scenes are OpenGL views, whereas our GADBannerView is a UIWebView wrapped in a native UIView. OpenGL views will usually be refreshed often, whereas our GADBannerView will be mostly static. Placing our GADBannerView on top of the OpenGL view therefore can lead to a performance decrease as the device will have more drawing to do.

You can test if this performance decrease is significant for your specific project by logging the frame rate when you place the ad within the OpenGL view and outside of it. The performance cost is usually only significant when you are dealing with very complex hierarchies.

View Layout

Since we’ve decided to place our GADBannerView into the RootViewController’s view hierarchy, we also need to now make sure to resize our cocos2d view to make space for our GADBannerView. The resizeViews: in initGADBanner: is called for this purpose. The implementation for resizeViews: is below. The main OpenGL view which encompasses all of the cocos2d scenes can be grabbed using the +sharedDirector object. The code below assumes you’re going to display the ad at the top of your screen, and have a device that’s in landscape.

- (void)resizeViews: {
// If the banner hasn't been created yet, no need for resizing views.
if (!bannerView_) {
return;
}
// If ad is not showing, no need to resize views.
BOOL adIsShowing = [self.view.subviews containsObject:bannerView_];
if (!adIsShowing) {
return;
}
// Frame of the main RootViewController which we call the root view.
CGRect rootViewFrame = self.view.frame;
// Frame of the main RootViewController view that holds the cocos2d view.
CGRect glViewFrame = [[CCDirector sharedDirector] openGLView].frame;
CGRect bannerViewFrame = bannerView_.frame;
CGRect frame = bannerViewFrame;
// The updated x and y coordinates for the origin of the banner.
CGFloat yLocation = 0.0;
CGFloat xLocation = 0.0;
// Move the root view underneath the ad banner.
glViewFrame.origin.y = bannerViewFrame.size.height;
// The superView has not had its width and height updated yet so use those
// values for the x and y of the new origin respectively. The game is in
// landscape.
xLocation = (rootViewFrame.size.height -
bannerViewFrame.size.width) / 2.0;
frame.origin = CGPointMake(xLocation, yLocation);
bannerView_.frame = frame;
// The super view's frame hasn't been updated so use its width
// as the height. Assume device is in landscape.
glViewFrame.size.height = rootViewFrame.size.width -
bannerViewFrame.size.height;
glViewFrame.size.width = rootViewFrame.size.height;
[[CCDirector sharedDirector] openGLView].frame = glViewFrame;
}

With that, you should now see AdMob ads show up in your cocos2d application. Look out for a follow-up to this blog post where we will discuss how to handle autorotation. As always, feel free to direct any questions you have to our forum or join us for our upcoming hangout.

Last week, we released AdMob SDK v6.1 for both Android and iOS. This SDK contains a number of important bug fixes and exciting new features including:

Additional DoubleClick support

DoubleClick publishers will be happy to know that AdMob now provides support for app events, giving them the ability to execute custom code in their application when a creative dispatches an app event. Additionally, the new SDK provides support for multiple ad sizes using the same banner.

Easy access to Google Analytics

You’ll notice we’ve included the latest Google Analytics package in the “Add-Ons” directory. The new mobile app analytics provides the same best-in-class Google Analytics reporting, but for mobile apps.

If you have any questions about the AdMob SDK, please let us know on the forum or hang out during our upcoming AdMob/DFP office hours. For more information about this new SDK, take a look at our release notes.