nend（ネンド）のバナー広告をiPhoneアプリの画面下に実装する方法（Swift）

僕はアプリにnend（ネンド）の広告を載せてるんですけど、そのバナー広告の実装方法について、ちょっと書いてみようと思います。

実は広告の表示って結構ハマりがちなんですよね。１回出来ちゃえばなんてことはないんですけど、初めてのときは、なんだか分かりにくいです。まあこれ僕だけかもしれないですけど。

SDKを追加する

まずはnendからSDKをダウンロードして、それを追加しましょう。マニュアルを見ながらやれば、だいたい大丈夫だと思います。

SDKを手動で追加する · fan-ADN/nendSDK-iOS Wiki · GitHub

注意するべきポイントは、NendAd-Bridging-Header.h へのパスを設定するところですね。

Build SettingsのObjective-C Bridging Headerってところに、$(SRCROOT)/$(PRODUCT_NAME)/NendAd-Bridging-Header.hって書けばいいんですけど、PROJECTとTARGETの両方にこれを記入してください。どちらか片方だけだとエラーになります。

f:id:gevvoihorry:20160711054953j:plain

パスが通ったら、あとはフレームワークを３つほど追加すればOKです。この辺はマニュアルを見れば問題ないでしょう。ちなみに、僕は上記のパスが片方にしか通っていなかったため、丸一日を費やしましたｗ

バナー広告実装手順

これもマニュアルに書いてあることそのままにやれば、基本的には問題ないです。

バナー型広告_実装手順 · fan-ADN/nendSDK-iOS Wiki · GitHub

まんまコピペになるんですが、こうやって書けば、とりあえず表示はされるかと。

import UIKit

class :YourAppViewController: UIViewController, NADViewDelegate {

private var nadView: NADView!

override func viewDidLoad() {

super.viewDidLoad()

// NADViewクラスを生成

nadView = NADView(frame: CGRect(x: 0, y: 0, width: 320, height: 50))

// 広告枠のapikey/spotidを設定(必須)

nadView.setNendID("管理画面より発行された apiKey", spotID: "管理画面より発行された spotID")

// nendSDKログ出力の設定(任意)

nadView.isOutputLog = false

// delegateを受けるオブジェクトを指定(必須)

nadView.delegate = self

// 読み込み開始(必須)

nadView.load()

// 通知有無にかかわらずViewに乗せる場合

self.view.addSubview(nadView)

}

}

「管理画面より発行された apiKey」と「管理画面より発行された spotID」ってところにだけ、自分のそれを入れましょう。これはネンドの管理画面にありますね。

バナー広告を画面下に表示する方法

上記のコードを書いてもらうと、とりあえず表示はされると思うんです。多分画面上に。んで、これを画面下に表示する方法について書いてみます。まずはこのコードを追記しましょう。

func nadViewDidFinishLoad(adView: NADView!) {

// 広告のロードが完了してからViewを乗せる場合はnadViewDidFinishLoadを利用します。

// 画面下部に広告を表示させる場合

nadView.frame = CGRect(x: (self.view.frame.size.width - nadView.frame.size.width)/2, y: self.view.frame.size.height - nadView.frame.size.height, width: nadView.frame.size.width, height: nadView.frame.size.height)

self.view.addSubview(nadView)

}

これもマニュアルに書いてあることなんですけど、このコードを適当なところに差し込めば、画面下に表示されるようになりますよ。ちなみに僕は一番最後に差し込んでいます。

広告サイズの自動調整 · fan-ADN/nendSDK-iOS Wiki · GitHub

広告の横幅を画面一杯に伸ばす方法

ここまでやっていただいたら、とりあえずバナー広告が画面下に表示されてると思うんですけど、そのサイズが小さいかと思います。

f:id:gevvoihorry:20160711060034j:plain

これはiPhone６でビルドした状態なんですが、同じようにちょっと短く表示されてないでしょうか？画面の幅を仮に１００といたら、広告が８０っていうか。

んで、ここで上記のコードに追記をすれば、画面一杯の横幅で出るようになります。そのコードはこれです。

import UIKit

class :YourAppViewController: UIViewController, NADViewDelegate {

private var nadView: NADView!

override func viewDidLoad() {

super.viewDidLoad()

// NADViewクラスを生成

nadView = NADView(frame: CGRect(x: 0, y: 0, width: 320, height: 50)

, isAdjustAdSize: true)

// 広告枠のapikey/spotidを設定(必須)

nadView.setNendID("管理画面より発行された apiKey", spotID: "管理画面より発行された spotID")

// nendSDKログ出力の設定(任意)

nadView.isOutputLog = false

// delegateを受けるオブジェクトを指定(必須)

nadView.delegate = self

// 読み込み開始(必須)

nadView.load()

// 通知有無にかかわらずViewに乗せる場合

self.view.addSubview(nadView)

}

}