メインコンテンツへスキップ

概要

バナー広告は、画面の一部領域に表示される長方形の広告です。UIKitとSwiftUIの両方で使用できます。

主な特徴

  • 画面の上部、下部、または中央に固定配置可能
  • 画像および動画広告に対応
  • UIKitおよびSwiftUIの両方をサポート
  • デリゲートによる広告イベント処理
開発環境ではテストユニットIDを使用してください: PUBLIC_TEST_UNIT_ID_320_100

UIKit実装

UIKit環境ではAdropBannerクラスを使用してバナー広告を実装します。

基本実装

import UIKit
import AdropAds

class ViewController: UIViewController {
    private var banner: AdropBanner?

    override func viewDidLoad() {
        super.viewDidLoad()

        // 1. バナーインスタンスの生成
        banner = AdropBanner(unitId: "YOUR_UNIT_ID")

        // 2. デリゲートの設定
        banner?.delegate = self

        // 3. ビュー階層に追加
        if let bannerView = banner {
            view.addSubview(bannerView)

            // 4. Auto Layoutの設定
            bannerView.translatesAutoresizingMaskIntoConstraints = false
            NSLayoutConstraint.activate([
                bannerView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
                bannerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
                bannerView.widthAnchor.constraint(equalToConstant: 320),
                bannerView.heightAnchor.constraint(equalToConstant: 100)
            ])
        }

        // 5. 広告の読み込み
        banner?.load()
    }

    deinit {
        // 6. メモリ解放前にバナーを削除
        banner?.removeFromSuperview()
        banner = nil
    }
}

// MARK: - AdropBannerDelegate
extension ViewController: AdropBannerDelegate {
    func onAdReceived(_ banner: AdropBanner) {
        print("バナー広告受信成功")
    }

    func onAdFailedToReceive(_ banner: AdropBanner, _ errorCode: AdropErrorCode) {
        print("バナー広告受信失敗: \(errorCode)")
    }

    func onAdImpression(_ banner: AdropBanner) {
        print("バナー広告表示")
    }

    func onAdClicked(_ banner: AdropBanner) {
        print("バナー広告クリック")
    }
}

AdropBannerの初期化

unitId
String
required
Adropコンソールで作成したユニットID
let banner = AdropBanner(unitId: "YOUR_UNIT_ID")

広告の読み込み

バナーを画面に追加した後、load()メソッドを呼び出して広告をリクエストします。
banner?.load()
バナーが画面に表示されているタイミングでload()を呼び出してください。画面に表示されていない状態で読み込むと、インプレッションが正確に測定されない可能性があります。

Context IDの設定

コンテキストターゲティングのためにContext IDを設定できます。
banner?.contextId = "article_123"

SwiftUI実装

SwiftUI環境ではAdropBannerRepresentedを使用してバナー広告を実装します。

基本実装

import SwiftUI
import AdropAds

struct ContentView: View {
    var body: some View {
        VStack {
            Spacer()

            Text("メインコンテンツ")

            Spacer()

            // バナー広告
            AdropBannerRepresented(unitId: "YOUR_UNIT_ID")
                .frame(width: 320, height: 100)
        }
    }
}

デリゲート処理

デリゲートを通じて広告イベントを処理できます。
import SwiftUI
import AdropAds

struct ContentView: View {
    @StateObject private var bannerDelegate = BannerDelegate()

    var body: some View {
        VStack {
            Spacer()

            if bannerDelegate.isLoaded {
                Text("広告読み込み完了")
            }

            AdropBannerRepresented(
                unitId: "YOUR_UNIT_ID",
                delegate: bannerDelegate
            )
            .frame(width: 320, height: 100)
        }
    }
}

// デリゲートの実装
class BannerDelegate: NSObject, ObservableObject, AdropBannerDelegate {
    @Published var isLoaded = false

    func onAdReceived(_ banner: AdropBanner) {
        print("バナー広告受信成功")
        isLoaded = true
    }

    func onAdFailedToReceive(_ banner: AdropBanner, _ errorCode: AdropErrorCode) {
        print("バナー広告受信失敗: \(errorCode)")
        isLoaded = false
    }

    func onAdImpression(_ banner: AdropBanner) {
        print("バナー広告表示")
    }

    func onAdClicked(_ banner: AdropBanner) {
        print("バナー広告クリック")
    }
}

Context IDの設定

AdropBannerRepresented(
    unitId: "YOUR_UNIT_ID",
    contextId: "article_123"
)
.frame(width: 320, height: 100)

Objective-C実装

Objective-C環境でバナー広告を実装する方法です。

基本実装

@import AdropAds;

@interface ViewController () <AdropBannerDelegate>
@property (nonatomic, strong) AdropBanner *banner;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    // 1. バナーインスタンスの生成
    self.banner = [[AdropBanner alloc] initWithUnitId:@"YOUR_UNIT_ID"];

    // 2. デリゲートの設定
    self.banner.delegate = self;

    // 3. ビュー階層に追加
    [self.view addSubview:self.banner];

    // 4. Auto Layoutの設定
    self.banner.translatesAutoresizingMaskIntoConstraints = NO;
    [NSLayoutConstraint activateConstraints:@[
        [self.banner.centerXAnchor constraintEqualToAnchor:self.view.centerXAnchor],
        [self.banner.bottomAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.bottomAnchor],
        [self.banner.widthAnchor constraintEqualToConstant:320],
        [self.banner.heightAnchor constraintEqualToConstant:100]
    ]];

    // 5. 広告の読み込み
    [self.banner load];
}

- (void)dealloc {
    [self.banner removeFromSuperview];
    self.banner = nil;
}

#pragma mark - AdropBannerDelegate

- (void)onAdReceived:(AdropBanner *)banner {
    NSLog(@"バナー広告受信成功");
}

- (void)onAdFailedToReceive:(AdropBanner *)banner :(AdropErrorCode)errorCode {
    NSLog(@"バナー広告受信失敗: %ld", (long)errorCode);
}

- (void)onAdImpression:(AdropBanner *)banner {
    NSLog(@"バナー広告表示");
}

- (void)onAdClicked:(AdropBanner *)banner {
    NSLog(@"バナー広告クリック");
}

@end

Context IDの設定

self.banner.contextId = @"article_123";

デリゲートメソッド

AdropBannerDelegateプロトコルは広告のライフサイクルイベントを処理します。

onAdReceived (必須)

広告受信が成功したときに呼び出されます。
func onAdReceived(_ banner: AdropBanner) {
    print("バナー広告受信成功")
    // 広告ローディングインジケータを非表示にするなどの処理
}

onAdFailedToReceive (必須)

広告受信が失敗したときに呼び出されます。
func onAdFailedToReceive(_ banner: AdropBanner, _ errorCode: AdropErrorCode) {
    print("バナー広告受信失敗: \(errorCode)")
    // エラー処理および代替コンテンツの表示
}
errorCode
AdropErrorCode
エラータイプを示すコード。詳細はリファレンスを参照してください。

onAdImpression (オプション)

広告が画面に表示されたときに呼び出されます。
func onAdImpression(_ banner: AdropBanner) {
    print("バナー広告表示")
    // インプレッション分析ロギングなどの処理
}

onAdClicked (オプション)

ユーザーが広告をクリックしたときに呼び出されます。
func onAdClicked(_ banner: AdropBanner) {
    print("バナー広告クリック")
    // クリック分析ロギングなどの処理
}

広告サイズ

バナー広告は、ユニットに設定したサイズに合わせてビューのサイズを指定する必要があります。

一般的なバナーサイズ

サイズ用途
320 x 50小型バナー
16:9比率動画バナー

UIKit

bannerView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
    bannerView.widthAnchor.constraint(equalToConstant: 320),
    bannerView.heightAnchor.constraint(equalToConstant: 100)
])

SwiftUI

AdropBannerRepresented(unitId: "YOUR_UNIT_ID")
    .frame(width: 320, height: 100)

ベストプラクティス

1. メモリ管理

ビューコントローラが解放されるときにバナーも一緒に削除してください。
deinit {
    banner?.removeFromSuperview()
    banner = nil
}

2. 画面の可視性

バナーが画面に表示されるときに広告を読み込んでください。
override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)
    banner?.load()
}

3. 再利用

同じバナーインスタンスを再利用するには、load()を再度呼び出してください。
func refreshAd() {
    banner?.load()
}

4. エラー処理

広告読み込み失敗時に適切なエラー処理を実装してください。
func onAdFailedToReceive(_ banner: AdropBanner, _ errorCode: AdropErrorCode) {
    switch errorCode {
    case .networkError:
        print("ネットワークエラー: 接続を確認してください")
    case .noFill:
        print("表示可能な広告がありません")
    default:
        print("広告読み込み失敗: \(errorCode)")
    }
}

テストユニットID

開発およびテスト時には以下のテストユニットIDを使用してください。
広告タイプテストユニットIDサイズ
バナー (320x50)PUBLIC_TEST_UNIT_ID_320_50320 x 50
バナー (320x100)PUBLIC_TEST_UNIT_ID_320_100320 x 100
カルーセルバナーPUBLIC_TEST_UNIT_ID_CAROUSEL可変
バナービデオ (16:9)PUBLIC_TEST_UNIT_ID_BANNER_VIDEO_16_916:9比率
バナービデオ (9:16)PUBLIC_TEST_UNIT_ID_BANNER_VIDEO_9_169:16比率

使用例

let banner = AdropBanner(unitId: AdropUnitId.PUBLIC_TEST_UNIT_ID_320_100)

次のステップ