When your app shows a video ad while playing music or video with sound, it is not an optimal user experience to mix with different sound sources. This can happen in the following scenario. A user chooses a music file to play from his album in the app. While the music is playing, a video ad in native or interstitial format is presented full screen to the app. The sound of the video ad and the music file will play at the same time. This will result an unpleasant and unexpected experience. To avoid this, you should implement the app following the Audience Network ad audio guide.
Ensure you have completed the Native Ad (iOS) and Rewarded Video Ad (iOS) examples for iOS apps. Ensure you have completed Native Ad (Android) or Rewarded Video Ad (Android) examples for Android apps
@property (strong, nonatomic) AVAudioPlayer *audioPlayer; - (void)viewDidLoad { [super viewDidLoad]; NSString *backgroundMusicPath = [[NSBundle mainBundle] pathForResource:@"BackgroundTheme" ofType:@"mp3"]; NSURL *backgroundMusicURL = [NSURL fileURLWithPath:backgroundMusicPath]; self.audioPlayer = [[AVAudioPlayer alloc] initWithContentsOfURL:backgroundMusicURL error:nil]; [self.audioPlayer play]; }
loadNativeAd
is called. For testing purposes, we can fetch a video test ad by initializing the placement ID with VID_HD_9_16_39S_APP_INSTALL#YOUR_PLACEMENT_ID
. You should fill YOUR_PLACEMENT_ID with the one created from your app dashboard. @property (strong, nonatomic) FBNativeAd *_nativeAd; - (void)loadNativeAd { FBNativeAd *nativeAd = [[FBNativeAd alloc] initWithPlacementID:@"VID_HD_9_16_39S_APP_INSTALL#YOUR_PLACEMENT_ID"]; // Set a delegate to get notified when the ad was loaded. nativeAd.delegate = self; // Configure native ad to wait to call nativeAdDidLoad: until all ad assets are loaded nativeAd.mediaCachePolicy = FBNativeAdsCachePolicyAll; // Initiate a request to load an ad. [nativeAd loadAd]; }
FBNativeAdDelegate
and FBMediaViewDelegate
. adCoverMediaView
property with FBMediaView
type in order to show video ad. nativeAdDidLoad
is called to FBNativeAdDelegate
, set nativeAd
property to adCoverMediaView
property in order to render the video ad. Please refer to Native Ad Integration for more details about showing the native ad in your app. videoVolumeDidChange
method defined in FBMediaViewDelegate
delegate. When a video ad plays with sound, the volume will be greater than 0. The music file playing in your app can be paused. When the video ad has stopped, the volume will be 0 and your app can resume music file playing.
@interface ViewController : UIViewController <FBNativeAdDelegate, FBMediaViewDelegate> @property (weak, nonatomic) IBOutlet FBMediaView *adCoverMediaView; @end #pragma mark - FBNativeAdDelegate - (void)nativeAdDidLoad:(FBNativeAd *)nativeAd { NSLog(@"Native ad was loaded, constructing native UI..."); if (self._nativeAd) { [self._nativeAd unregisterView]; } self._nativeAd = nativeAd; // Create native UI using the ad metadata. [self.adCoverMediaView setNativeAd:nativeAd]; self.adCoverMediaView.delegate = self; // Follow Audience Network Native Ad implementation for creating and rendering other ad assets including ad icon, ad title, ad CTA button and more. } #pragma mark - FBMediaViewDelegate - (void)mediaView:(FBMediaView *)mediaView videoVolumeDidChange:(float)volume { if (volume > 0) { // Pause music playing if video ad plays with sound [self.audioPlayer pause]; } else { // Resume music playing [self.audioPlayer play]; } }
FBRewardedVideoAdDelegate
in your View Controller. You should pause the music file playing before presenting the rewarded video ad in full screen. After the rewarded video ad is closed, you should resume the music file playing. Please refer to Rewarded Video Ad Integration for more details about showing the native ad in your app. @interface ViewController : UIViewController <FBRewardedVideoAdDelegate> @property (nonatomic, strong) FBRewardedVideoAd *rewardedVideoAd; @end - (IBAction)showAd { [self.audioPlayer pause]; // Ad is ready, present it! [self.rewardedVideoAd showAdFromRootViewController:self animated:NO]; } } - (void)rewardedVideoAdDidClose:(FBRewardedVideoAd *)rewardedVideoAd { [self.audioPlayer play]; }
class AudioDemoActivity extends AppCompatActivity { protected MediaPlayer mMediaPlayer; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); this.setContentView(R.layout.activity_native_ad); // Create MediaPlayer Instance by Audio File in the res/raw Folder this.mMediaPlayer = MediaPlayer.create(this, R.raw.background_theme); this.mMediaPlayer.start(); } }
loadNativeAd
is called. For testing purpose, we can fetch for a video test ad by initializing the placement ID with VID_HD_9_16_39S_APP_INSTALL#YOUR_PLACEMENT_ID
. You should fill YOUR_PLACEMENT_ID with the one created from your app dashboard. private NativeAd mNativeAd; protected void loadNativeAd() { NativeAd nativeAd = new NativeAd(this, "VID_HD_9_16_39S_APP_INSTALL#YOUR_PLACEMENT_ID"); // Set AdListener to get notified when the ad was loaded. nativeAd.setAdListener(this); // Initiate a request to load an ad with cache all media. nativeAd.loadAd(NativeAd.MediaCacheFlag.ALL); }
AdListener
and MediaViewListener
. mAdCoverMediaView
property with MediaView
type in order to show video ad. onAdLoaded
is called to AdListener
, set mNativeAd
property to mAdCoverMediaView
property in order to render the video ad. Please refer to Native Ad Integration for more details about showing the native ad in your app. onVolumeChange
method defined in AdListener
. When a video ad plays with sound, the volume will be greater than 0. The music file playing in your app can be paused. when the video ad is stopped, the volume will be 0 and your app can resume music file playing.
class AudioDemoActivity extends AppCompatActivity implements AdListener, MediaViewListener { protected MediaView mAdCoverMediaView; /** * Ad Listener Implementation */ @Override public void onAdLoaded(Ad ad) { if (this.mNativeAd != null) { this.mNativeAd.unregisterView(); } this.mNativeAd = (NativeAd) ad; // Create native UI using the ad metadata. this.mAdCoverMediaView.setNativeAd(this.mNativeAd); this.mAdCoverMediaView.setListener(this); // Follow Audience Network Native Ad implementation for creating and rendering other ad assets including ad icon, ad title, ad CTA button and more. } /** * MediaViewListener Implementation */ @Override public void onVolumeChange(MediaView mediaView, float volume) { if (volume > 0) { // Pause music playing if video ad plays with sound this.mMediaPlayer.pause(); } else { // Resume music playing this.mMediaPlayer.start(); } } }
RewardedVideoAdListener
in your activity. You should pause the music file playing before presenting the rewarded video ad in full screen. After the rewarded video ad is closed, you should resume the music file playing. Please refer to Rewarded Video Ad Integration for more details about showing the native ad in your app.
class AudioDemoActivity extends AppCompatActivity implements RewardedVideoAdListener { protected MediaPlayer mMediaPlayer; protected RewardedVideoAd mRewardedVideoAd; /** * RewardedVideoAdListener Implementation */ @Override public void onRewardedVideoClosed() { this.mMediaPlayer.start(); } @Override public void onAdLoaded(Ad ad) { this.mMediaPlayer.pause(); // Ad is ready, present it! this.mRewardedVideoAd.show(); } }
Test ads integration with your app
Submit your app for review.
As soon as we receive a request for an ad from your app or website, we'll review it to make sure it complies with Audience Network policies and the Facebook community standards. Learn more about our review process.
More Resources |
Getting Started GuideTechnical guide to get started with Audience Network | API ReferenceFacebook SDK for iOS Reference |