In April 2010 during iOS 4 presentation Steve Jobs announced new advertisement platform – iAd. This platform is intended to allow developers of free apps to earn on their apps showing advertisement. The main idea of iAd is to connect interactivity (using smartphone or tablet) and emotionality of advertisement (JavaScript, HTML5, CSS3, multi-touch). It allows to create absolutely awesome advertisement which looks like apps with video and audio. In addition, iAd ads is opened inside the app and user do not exit his app and can get back anytime he wants. Below is the guide on how to add iAd banner into iPhone app. Guide is based on iAd Programming Guide and WWDC 2010 video.
Add iAd Banner to iPhone App
The first thing you need to do is to add iAd.framework in your Xcode project which is contained in iOS 4 SDK. Also do not forget to add #importApple recommends to put banner at the bottom or at the top of the window and do not place it on any moving elements like ScrollView or TableView as far as that will decrease shows of banner (and your revenue respectively) and will make it more difficult for user to tap on the ads.
Let’s create a new project in Xcode using View-based Application template and add a banner into it. Name of the app – iAdEx. We are going to edit iAdExViewController.h
#import
#import
@interface iAdExViewController : UIViewController
{
ADBannerView *adView;
BOOL bannerIsVisible;
}
@property (nonatomic,assign) BOOL bannerIsVisible;
@end
and modify viewDidLoad method in iAdExViewController.m
- (void)viewDidLoad {
adView = [[ADBannerView alloc] initWithFrame:CGRectZero];
adView.frame = CGRectOffset(adView.frame, 0, -50);
adView.requiredContentSizeIdentifiers = [NSSet setWithObject:ADBannerContentSizeIdentifier320x50];
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifier320x50;
[self.view addSubview:adView];
adView.delegate=self;
self.bannerIsVisible=NO;
[super viewDidLoad];
}
Let’s talk about requiredContentSizeIdentifiers and currentContentSizeIdentifier properties. In the first one you define all types of banners you are going to use. And the second property defines which type of banner you are going to use at the present moment.
Connection issues
Banners are downloaded from the network. What if we have no network connection right now? Or Apple has any issues with ads server? Our ADBannerView will be empty is these cases. It doesn’t look very nice and wastes space on the screen. Apple recommends to do it in this way: when there is no banner for any reason remove it from the screen; when banner is received – show it again.We have the ADBannerViewDelegate in our class and it can receive messages from banner – bannerViewDidLoadAd (when banner is loaded successfully) and didFailToReceiveAdWithError (when any problems occured). Let’s implement these messages:
- (void)bannerViewDidLoadAd:(ADBannerView *)banner
{
if (!self.bannerIsVisible)
{
[UIView beginAnimations:@"animateAdBannerOn" context:NULL];
// banner is invisible now and moved out of the screen on 50 px
banner.frame = CGRectOffset(banner.frame, 0, 50);
[UIView commitAnimations];
self.bannerIsVisible = YES;
}
}
- (void)bannerView:(ADBannerView *)banner didFailToReceiveAdWithError:(NSError *)error
{
if (self.bannerIsVisible)
{
[UIView beginAnimations:@"animateAdBannerOff" context:NULL];
// banner is visible and we move it out of the screen, due to connection issue
banner.frame = CGRectOffset(banner.frame, 0, -50);
[UIView commitAnimations];
self.bannerIsVisible = NO;
}
}
It’s time to launch the app and see what we have now:
Tap the banner
And that’s it – we’ve done it in accordance with Apple’s recommendations. When we launch the app we see the banner. If we tap it, then full view of advertisement is shown. But we still have one issue…
Stop & Resume your app
In real app we should stop any application’s activity such as video, audio playback or pause game. In order to solve this task we will create two methods bannerViewActionShouldBegin (when full screen ad is shown) and bannerViewActionDidFinish (when we close ads).- (
BOOL
)bannerViewActionShouldBegin:(ADBannerView *)banner willLeaveApplication:(
BOOL
)willLeave
{
NSLog
(
@"Banner view is beginning an ad action"
);
BOOL
shouldExecuteAction =
YES
;
if
(!willLeave && shouldExecuteAction)
{
// stop all interactive processes in the app
// [video pause];
// [audio pause];
}
return
shouldExecuteAction;
}
- (
void
)bannerViewActionDidFinish:(ADBannerView *)banner
{
// resume everything you've stopped
// [video resume];
// [audio resume];
}
Change Orientation of iAd
What else should we do? We need to make banner change it’s orientation in accordance with iPhone position. First of all we need to change the line where we define types of banners which we will use:- (
void
)viewDidLoad {
...
adView.requiredContentSizeIdentifiers = [
NSSet
setWithObjects:ADBannerContentSizeIdentifier320x50,ADBannerContentSizeIdentifier480x32,
nil
];
...
}
and here are methods for changing orientation:
- (
BOOL
)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
// Return YES for supported orientations
return
(interfaceOrientation == UIInterfaceOrientationPortrait|UIInterfaceOrientationPortrait);
}
- (
void
)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(
NSTimeInterval
)duration
{
if
(UIInterfaceOrientationIsLandscape(toInterfaceOrientation))
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifier480x32;
else
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifier320x50;
}
And here is how it look in a landscape
When device changes orientation we change currentContentSizeIdentifier property of ADBannerView. Now we can see banners in landscape mode too. There is still 50 px offset, but it’s easy to fix.
Apple developers also recommend to write object.delegate=nil; line before deallocating ADBannerView object. In our example it will look like:
When device changes orientation we change currentContentSizeIdentifier property of ADBannerView. Now we can see banners in landscape mode too. There is still 50 px offset, but it’s easy to fix.
Apple developers also recommend to write object.delegate=nil; line before deallocating ADBannerView object. In our example it will look like:
- (
void
)dealloc {
adView.delegate=
nil
;
[adView release];
[
super
dealloc];
}
Now we have finished with programming part. Good luck with Apple iAd!
What would I set the origin to in order to make it scroll in from the bottom?
ReplyDeleteTo make this happen make the origin of scroll view same as of the view which is added on the scroll view
ReplyDeletehow to display different iAds in iphone
ReplyDeletehow to display different iAds in iphone
ReplyDeleteWhat would I set the origin to in order to make it scroll in from the bottom?
ReplyDeleteRefer iAD Programming guide. You are not responsible to show different ads in iphone
ReplyDeletehttp://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/iAd_Guide/BannerAdvertisements/BannerAdvertisements.html
Hi All,
ReplyDeleteI am new about iOS App Development. I am trying to implement iAD in my App. Your Article is good. I have one Question regarding iAD implementation.
is it not necessary to know iOS version before integration iAD with Application because the old iOS can support iAD ?
How can we test , iAD framework is not available from older version iOS ?
Hi,
ReplyDeletei want to know if i can run addvertisemnt video before running the actual streaming video
thnx in advance:)
Thanks! But your #import statements are missing their header files...
ReplyDeleteDo you have alternate site named web designing company in
ReplyDeleteToronto .??