PhoneGap (Cordova) users, you are no doubt used to dealing with PhoneGap plugins to interact with frameworks, to keep your distance from having to dive into Objective-C. Well, in the case of iAd integration, you might actually find that the native approach is easier.
What's one of the biggest headaches as the layers of abstraction get higher and higher – dependencies. Finding the right plugin to match your version of PhoneGap, and integrating it requires another layer that just isn't necessary.
I'm going to describe the step to integrate iAd into your PhoneGap application, leaving you amazed at how simple it is. Note that I'm walking through this using XCode 4.3.2. The steps may be different for earlier/later releases.
- Click on the top-most item in your hierarchy, the target. In the Build Phases tab, expand Link Binary with Libraries.
- Click the + icon to add the iAd.framework to your project.
- In your app -> Classes folder, open up MainViewController.h, and drop in the following code:
#import <iAd/iAd.h>@interface MainViewController : CDVViewController {
ADBannerView *adView;
} -
Open up MainViewController.m
-
In your viewDidUnload method, add:
[adView release]; -
In your webViewDidFinishLoad method, add:
adView = [[ADBannerView alloc] initWithFrame:CGRectZero];if([UIApplication sharedApplication].statusBarOrientation ==
UIInterfaceOrientationPortrait ||
[UIApplication sharedApplication].statusBarOrientation ==
UIInterfaceOrientationPortraitUpsideDown) {
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
}
else {
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierLandscape;
}
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
CGRect adFrame = adView.frame;
adFrame.origin.y = self.view.frame.size.height-adView.frame.size.height;
adView.frame = adFrame;
[self.view addSubview:adView]; -
If you don't already have a willAnimateRotationToInterfaceOrientation method, add it, and drop in the following code:
- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)newInterfaceOrientation duration:(NSTimeInterval)duration {
BOOL hide = (newInterfaceOrientation == UIInterfaceOrientationLandscapeLeft || newInterfaceOrientation == UIInterfaceOrientationLandscapeRight);
[[UIApplication sharedApplication] setStatusBarHidden:hide withAnimation:UIStatusBarAnimationNone];
CGRect mainFrame = [[UIScreen mainScreen] applicationFrame];
[self.view setFrame:mainFrame];if (newInterfaceOrientation != UIInterfaceOrientationLandscapeLeft && newInterfaceOrientation != UIInterfaceOrientationLandscapeRight) {
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
[self.view bringSubviewToFront:adView];
adView.frame = CGRectMake(0.0, self.view.frame.size.height - adView.frame.size.height, adView.frame.size.width, adView.frame.size.height);}else {adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierLandscape;
[self.view bringSubviewToFront:adView];
adView.frame = CGRectMake(0.0, self.view.frame.size.width - adView.frame.size.height, adView.frame.size.width, adView.frame.size.height);}}
Steps 1-6 should be somewhat straightforward, but let's talk about step #7 a bit. Essentially what we're doing here is handling the change in orientation of the phone from portrait to landscape mode, and vice-versa. iAd advertisements have different sizes which are better suited to a given orientation. But, this is not handled automatically.
You need to adjust not only the size of the ad displayed, but also it's position in the view, whenever the orientation is changed. One of the most confusing aspects, is that although the orientation has changed, the dimensions stick.
For example, in portrait mode, self.view.frame.size.width will read 320. However, it reads the same dimension even in landscape mode. So, to properly place the ad in landscape (if you wish to place it at the bottom of the view), we need to subtract the ad height from the frame width.