iOS için IMA SDK ile özel kullanıcı arayüzü

Bu kılavuzda, iOS için IMA SDK'yı kullanarak kendi özel reklam kullanıcı arayüzünüzü nasıl uygulayacağınız gösterilmektedir. Bunu yapmak için varsayılan kullanıcı arayüzünü devre dışı bırakmanız, yeni bir özel kullanıcı arayüzü ayarlamanız ve ardından yeni kullanıcı arayüzünü SDK'dan elde edilen reklam bilgileriyle doldurmalıdır. Bu kılavuz, temel Objective-C örneği . Belgenin tamamını Özel kullanıcı arayüzü örneği.

Not: Bu özelliği etkinleştirmek için Google Ad Manager hesabınız etkinleştirilmelidir. Daha fazla bilgi için hesap yöneticinizle iletişime geçin.

Yeni kullanıcı arayüzü öğeleri tanımlayın

Herhangi bir kod yazmadan önce, film şeridinde değişiklik yaparak Daha Fazla Bilgi düğmesi, Reklamı Atla düğmesi ve geri sayım zamanlayıcı. Lütfen Reklamı Atla düğmeniz "Özel" düğmesini (aşağıda gösterildiği gibi) kullanın. yanıp sönmesini engelleyebilir.

Daha Fazla Bilgi düğmesi

Reklamı Atla düğmesi

Reklam Geri Sayımı etiketi

Bu yeni öğelerin ViewController etiketinizdeki değişkenlere bağlandığından emin olun. Ayrıca, geçerli reklamı ve reklamın atlanışına kadar geçen süreyi izlemek için değişkenler ekleyin. daha sonra gerekli olacak.

ViewController.m

@property(nonatomic, weak) IBOutlet UIButton *learnMore;
@property(nonatomic, weak) IBOutlet UIButton *skipAd;
@property(nonatomic, weak) IBOutlet UILabel *adCountdown;
@property(nonatomic) NSTimeInterval timeTillSkip;
@property(nonatomic, strong) IMAAd *currentAd;

Yerleşik kullanıcı arayüzünü devre dışı bırakma

SDK'ya, yerleşik kullanıcı arayüzünü devre dışı bırakmak istediğinizi söyleyerek başlayın.

ViewController.m

- (void)setUpContentPlayer {
  ...
  IMAAdsRenderingSettings *adsRenderingSettings = [[IMAAdsRenderingSettings alloc] init];
  adsRenderingSettings.disableUi = YES;
  [self.adsManager initializeWithAdsRenderingSettings:adsRenderingSettings];
}

Özel kullanıcı arayüzünüzü gizleme ve yalnızca izin verildiğinde gösterme

AdSense reklamları gibi bazı Google reklamlarında özel kullanıcı arayüzüne izin verilmez. Bunun yerine her zaman kendi kullanıcı arayüzünü oluştururlar. Özel kullanıcı arayüzünü varsayılan olarak gizleyin:

ViewController.m

- (void)viewDidLoad {
  ...
  [self hideCustomUi];
  self.timeTillSkip = INFINITY;
  self.learnMore.layer.zPosition = MAXFLOAT;
  self.skipAd.layer.zPosition = MAXFLOAT;
  self.adCountdown.layer.zPosition = MAXFLOAT;
  ...
}

- (void)hideCustomUi {
  self.learnMore.hidden = YES;
  self.adCountdown.hidden = YES;
  self.skipAd.hidden = YES;
}

Özel kullanıcı arayüzünü, yalnızca oynatılan reklam kullanıcı arayüzünü gizlerken göster. Takip eden reklamın gitmemesi ihtimaline karşı her reklamdan sonra özel kullanıcı arayüzünü gizle özel kullanıcı arayüzüne izin ver:

ViewController.m

- (void)adsManager:(IMAAdsManager *)adsManager didReceiveAdEvent:(IMAAdEvent *)event {
  // When the SDK notified you that ads have been loaded, play them.
  if (event.type == kIMAAdEvent_LOADED) {
    [adsManager start];
  } else if (event.type == kIMAAdEvent_STARTED) {
    self.currentAd = event.ad;
    if (self.currentAd.isUiDisabled) {
      [self showCustomUi];
    }
  } else if (event.type == kIMAAdEvent_SKIPPED || event.type == kIMAAdEvent_COMPLETE) {
    [self hideCustomUi];
  } else if (event.type == kIMAAdEvent_TAPPED) {
    // Since you're disabling IMA's built-in UI, you're also losing the
    // UI element that resumes paused ads with a tap. Add this code
    // to resume paused ads when a user taps on them.
    [self.adsManager resume];
  }
}

- (void)showCustomUi {
  self.learnMore.hidden = NO;
  [self.videoView bringSubviewToFront:self.learnMore];
  self.adCountdown.hidden = NO;
  if (self.currentAd.isSkippable) {
    self.skipAd.hidden = NO;
    [self.videoView bringSubviewToFront:self.skipAd];
  } else {
    self.skipAd.hidden = YES;
  }
  self.adCountdown.text = @"";
  [self.skipAd setTitle:@"" forState:UIControlStateNormal];
}

Daha Fazla Bilgi düğmesi için mantık ekleyin

Kablolanacak ilk kullanıcı arayüzü bileşeni Daha Fazla Bilgi düğmesidir. "İçinde Rötuş" yapın dinleyiciye, Daha Fazla Bilgi Edinin düğmesi tıklandı.

ViewController.m

- (IBAction)onLearnMoreTouch:(id)sender {
  [self.adsManager clicked];
}

Geri sayım zamanlayıcı için mantık ekleyin

Sonra, video çekmecesini açan geri sayım zamanlayıcıyı Hesaplamak için adsManager:adDidProgressToTime:totalTime: reklamın kalan süresi.

ViewController.m

- (void)adsManager:(IMAAdsManager *)adsManager
adDidProgressToTime:(NSTimeInterval)mediaTime
         totalTime:(NSTimeInterval)totalTime {
  // Update countdown timer.
  NSMutableString *countdownText = [NSMutableString stringWithString:@"Ad "];
  NSInteger totalAds = self.currentAd.adPodInfo.totalAds;
  if (totalAds > 1) {
    NSInteger position = self.currentAd.adPodInfo.adPosition;
    [countdownText appendString:
        [NSString stringWithFormat:@"%ld of %ld", (long)position, (long)totalAds]];
  }
  NSTimeInterval remainingTime = totalTime - mediaTime;
  [countdownText appendString:[NSString stringWithFormat:@" (%.fs)", remainingTime]];
  self.adCountdown.text = countdownText;
}

Reklamı Atla düğmesi için mantık ekleyin

Son olarak Reklamı Atla düğmesini bağlayın. Bu düğme yalnızca atlanabilir reklamlar için gösterilir reklamlar; Geri sayım zamanlayıcı 0'a ulaştığında reklamı atlar. Bu kod eklendi yukarıdaki geri sayım zamanlayıcı için kullanılan yöntemle aynı yöntemi kullanın.

ViewController.m

- (void)adsManager:(IMAAdsManager *)adsManager
adDidProgressToTime:(NSTimeInterval)mediaTime
         totalTime:(NSTimeInterval)totalTime {
  ...
  // Update skip button
  if (self.currentAd.isSkippable) {
    self.timeTillSkip = self.currentAd.skipTimeOffset - mediaTime;
    NSString *skipString = @"Skip ad";
    if (self.timeTillSkip > 0) {
      skipString =
          [NSString stringWithFormat:@"Skip this ad in %.f...", self.timeTillSkip];
    }
    // Disable animations while you change the button text to prevent it from blinking. The button
    // type must be "Custom" instead of "System" for this to work. This can be set in the attributes
    // inspector for the button in the storyboard file.
    [UIView setAnimationsEnabled:NO];
    [self.skipAd setTitle:skipString forState:UIControlStateNormal];
    [self.skipAd layoutIfNeeded];
    [UIView setAnimationsEnabled:YES];
  }
}

Uygulandıktan sonra, Özel Kullanıcı Arayüzü Örneği şöyle görünür:

Sorun giderme

Reklam kullanıcı arayüzünü devre dışı bırakmak için etkinleştirilmiş bir örnek etiketiniz var mı?

Bunun URL'sini kopyalayabilirsiniz örnek etiket ve IMA uygulamanıza yapıştırabilirsiniz.

Varsayılan kullanıcı arayüzünü devre dışı bırakamıyorum.

adsRenderingSettings.disableUi ayarını true olarak ayarladığınızdan emin olun getAdsManager'a iletebiliriz. ad.isUiDisabled() olup olmadığını kontrol edin true değerini döndürür. Ayrıca reklam kullanıcı arayüzü. Etkinleştirildiğinde, VAST'niz şu özelliklere sahip bir Extension içerir: şöyle görünür:

<Extension type="uiSettings">
<UiHideable>1</UiHideable>
</Extension>

Hâlâ sorun yaşıyorsanız, hesap yöneticinizle görüşerek etkin olup olmadığınızdan emin olun. Bazı reklam türleri belirli bir kullanıcı arayüzü gerektirir. bu reklamlar <UiHideable> değerini 0 olarak döndürün. Bu durumla karşılaşırsanız trafik işlemleri ekibinin, bu reklam türlerinin yayınlanmaması için değişiklikler yapması gerekir.