iOS এর জন্য IMA SDK সহ কাস্টম UI

এই নির্দেশিকাটি দেখায় কিভাবে iOS এর জন্য IMA SDK ব্যবহার করে আপনার নিজস্ব কাস্টম বিজ্ঞাপন UI বাস্তবায়ন করবেন। এটি করার জন্য, আপনাকে ডিফল্ট UI অক্ষম করতে হবে, একটি নতুন কাস্টম UI সেট আপ করতে হবে এবং তারপর SDK থেকে প্রাপ্ত বিজ্ঞাপনের তথ্য দিয়ে নতুন UI তৈরি করতে হবে৷ এই নির্দেশিকাটি iOS-এর জন্য মৌলিক উদ্দেশ্য-সি উদাহরণের উপর তৈরি করে। আপনি সম্পূর্ণ কাস্টম UI উদাহরণ ডাউনলোড করতে পারেন।

দ্রষ্টব্য: এই বৈশিষ্ট্যটি সক্ষম করতে আপনার Google Ad Manager অ্যাকাউন্ট অবশ্যই সক্ষম হতে হবে৷ আরও তথ্যের জন্য, আপনার অ্যাকাউন্ট পরিচালকের সাথে যোগাযোগ করুন।

নতুন UI উপাদান সংজ্ঞায়িত করুন

আপনি কোনো কোড লেখার আগে, আরও জানুন বোতাম, বিজ্ঞাপন এড়িয়ে যান এবং কাউন্টডাউন টাইমারের জন্য উপাদান যোগ করতে স্টোরিবোর্ড পরিবর্তন করুন। নিশ্চিত করুন যে আপনার বিজ্ঞাপন এড়িয়ে যাওয়ার বোতামটি একটি "কাস্টম" বোতাম (নিচে দেখানো হয়েছে) কাউন্টডাউন টাইমার আপডেটগুলি এড়িয়ে যাওয়ার সময় এটিকে ঝাপসা থেকে আটকাতে।

আরও জানুন বোতাম

বিজ্ঞাপন বোতাম এড়িয়ে যান

বিজ্ঞাপন কাউন্টডাউন লেবেল

নিশ্চিত করুন যে এই নতুন উপাদানগুলি আপনার ViewController ভেরিয়েবলের সাথে সংযুক্ত রয়েছে। বর্তমান বিজ্ঞাপন এবং সময় ট্র্যাক করতে ভেরিয়েবল যোগ করুন যতক্ষণ না বিজ্ঞাপনটি এড়িয়ে যাওয়া যায়, যা পরে ব্যবহার করা হয়।

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;

অন্তর্নির্মিত UI অক্ষম করুন

SDK কে বলে শুরু করুন যে আপনি এর অন্তর্নির্মিত UI অক্ষম করতে চান৷

ViewController.m

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

আপনার কাস্টম UI লুকান এবং অনুমতি দিলেই দেখান

কিছু Google বিজ্ঞাপন, যেমন AdSense বিজ্ঞাপন, কাস্টম UI-এর জন্য অনুমতি দেয় না। তারা সবসময় পরিবর্তে তাদের নিজস্ব UI রেন্ডার করে। ডিফল্টরূপে আপনার কাস্টম UI লুকান:

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;
}

কাস্টম UI দেখান শুধুমাত্র যখন বর্তমানে চালানো বিজ্ঞাপনটি তার UI লুকিয়ে রাখে। প্রতিটি বিজ্ঞাপনের পরে কাস্টম UI লুকিয়ে রাখুন যদি অনুসরণ করা বিজ্ঞাপনটি কাস্টম UI অনুমোদন না করে:

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];
}

আরও জানুন বোতামের জন্য যুক্তি যোগ করুন

ওয়্যার আপ করার জন্য প্রথম UI উপাদান হল আরও জানুন বোতাম। একটি "টাচ আপ ইনসাইড" শ্রোতা তৈরি করুন যাতে SDK-কে জানানো হয় যে আরও জানুন বোতামটি ক্লিক করা হয়েছে৷

ViewController.m

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

কাউন্টডাউন টাইমারের জন্য যুক্তি যোগ করুন

এর পরে, কাউন্টডাউন টাইমারটি ওয়্যার আপ করুন, যা বিজ্ঞাপনের অবশিষ্ট সময় গণনা করতে adsManager:adDidProgressToTime:totalTime: ব্যবহার করে।

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;
}

Skip Ad বোতামের জন্য যুক্তি যোগ করুন

সবশেষে, Skip Ad বোতামটি ওয়্যার আপ করুন। এই বোতামটি শুধুমাত্র এড়িয়ে যাওয়া বিজ্ঞাপনের জন্য প্রদর্শিত হয়; কাউন্টডাউন টাইমার 0 এ পৌঁছালে এটি একটি বিজ্ঞাপন এড়িয়ে যায়। এই কোডটি উপরের কাউন্টডাউন টাইমারের জন্য ব্যবহৃত একই পদ্ধতিতে যোগ করা হয়।

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];
  }
}

একবার বাস্তবায়িত হলে, আমাদের কাস্টম UI উদাহরণে UI দেখতে এইরকম দেখায়:

সমস্যা সমাধান

আপনার কি এমন একটি নমুনা ট্যাগ আছে যা বিজ্ঞাপন UI নিষ্ক্রিয় করার জন্য সক্ষম করা হয়েছে?

আপনি এই নমুনা ট্যাগের URL টি কপি করে আপনার IMA বাস্তবায়নে পেস্ট করতে পারেন।

আমি ডিফল্ট UI নিষ্ক্রিয় করতে পারি না।

আপনি adsRenderingSettings.disableUi কে true সেট করেছেন এবং getAdsManager এ পাস করেছেন তা নিশ্চিত করতে পরীক্ষা করুন। ad.isUiDisabled() true দেখায় তা দেখতে পরীক্ষা করুন। উপরন্তু, বিজ্ঞাপন UI নিষ্ক্রিয় করতে আপনার নেটওয়ার্ক অবশ্যই Ad Manager-এ সক্রিয় থাকতে হবে। আপনি সক্ষম হলে, আপনার VAST-এ একটি Extension রয়েছে যা দেখতে এইরকম:

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

আপনার যদি এখনও সমস্যা হয়, আপনি সক্ষম কিনা তা নির্ধারণ করতে আপনার অ্যাকাউন্ট পরিচালকের সাথে যোগাযোগ করুন৷ কিছু বিজ্ঞাপন প্রকারের জন্য একটি নির্দিষ্ট UI প্রয়োজন; এই বিজ্ঞাপনগুলি 0-এর <UiHideable> মান দিয়ে ফিরে আসে। আপনি যদি এটির সম্মুখীন হন, তাহলে আপনার পাচারকারী দলকে পরিবর্তন করতে হবে যাতে এই ধরনের বিজ্ঞাপন পরিবেশন না হয়।