iOS SDK バナー広告 端末幅いっぱいまで拡大表示するには

はじめに

開発環境にXcodeを使用することを前提とします。
本項ではAd Generation SDKにおいて320×50のサイズのバナー広告を端末幅いっぱいに拡大して表示させる方法を示します。

この方法では、バナー広告のアスペクト比を変えず端末幅まで幅と高さを等倍率で拡大させます。
端末サイズにより高さが可変となりますので、それらを考慮した画面実装が必要になります。

(Swiftの例のみ記載しています)

1. バナー広告のサイズを計算する

以下はバナー広告のサイズを計算するUIViewを拡張したクラスの実装例です。

:::: tabs
::: tab Swift

class BannerAdContainerView: UIView {

    private(set) var expandRate: Float = 1.0
    private let MIN_WIDTH: CGFloat = 320
    private let MAX_WIDTH: CGFloat = 414

    override func updateConstraints() {
        super.updateConstraints()
        let widthConstraint = self.constraints.first{ $0.firstAttribute == NSLayoutAttribute.width }
        let heightConstraint = self.constraints.first{ $0.firstAttribute == NSLayoutAttribute.height }
        guard let wConstraint = widthConstraint, let hConstraint = heightConstraint else {
            return
        }
        let screenWidth = UIScreen.main.bounds.size.width
        if (screenWidth < MIN_WIDTH || screenWidth > MAX_WIDTH) {
            return
        }
        let expandRate = screenWidth / wConstraint.constant
        let height = hConstraint.constant * expandRate
        widthConstraint?.constant = screenWidth
        heightConstraint?.constant = height
        self.expandRate = Float(expandRate)
    }
}

:::
::::

2. AutoLayoutを設定する

バナー広告を配置するBannerAdContainerViewを端末幅いっぱいになるようAutoLayoutの設定をしてください。

3. 広告サイズと拡大率を指定する

adType をFreeに設定し、adSizeで渡す幅と高さ、およびadScaleに比率を設定してください。

:::: tabs
::: tab Swift

class ViewController: UIViewController {

    @IBOutlet weak var bannerAdContainerView: BannerAdContainerView! {
        didSet {
            // 広告リクエストより前にframeを更新してください
            self.bannerAdContainerView.layoutIfNeeded()
        }
    }
    private var adgManagerViewController: ADGManagerViewController?

    override func viewDidLoad() {
        super.viewDidLoad()

        adgManagerViewController = ADGManagerViewController(locationID: "48547", adType: .adType_Free, rootViewController: self)
        adgManagerViewController?.addAdContainerView(bannerAdContainerView)
        adgManagerViewController?.adSize = CGSize(width: bannerAdContainerView.frame.width, height: bannerAdContainerView.frame.height)
        adgManagerViewController?.adScale = bannerAdContainerView.expandRate
        adgManagerViewController?.delegate = self
        adgManagerViewController?.loadRequest()
    }
}

:::
::::

注意事項

アドネットワーク事業者の配信する広告クリエイティブによっては、こちらの方法でも正しく拡大が行えなえず、実装上では制御できない可能性がございます。
以下は拡大表示の確認ができているアドネットワークです。

• GunosyAds
• i-mobile
• nend
• Zucks