 |
| Photo by Ketut Subiyanto |
我在整合 Google AdMob 時卡了超久，Google 了也沒找到很直接能解決的方法，想說在此做個記錄，讓以後的我能照著做，也讓遇到類似問題的人能夠有個解法，以下是參考 官方說明 做的
第一動，Import the Mobile Ads SDK
先在 xocde project 的根目錄下（.xcodeproj 檔案的路徑）執行 pod init，這樣就能產生一個 Podfile 檔案，若沒安裝 cocopods 可以 follow 這裡 安裝，然後再按照 這裡 的做法，加
pod 'Google-Mobile-Ads-SDK'
在 Podfile 檔案，然後執行下面，記得此時要將 xcode 關閉
pod install --repo-update
這邊我遇到一個問題
[!] Unable to determine the platform for the `your project name` target.
解決方法是將 Podfile 檔案裡的第二行 uncomment 就可以了，完成後如下
platform :ios, '9.0'
第二動，Update your Info.plist
遇到的第一個問題是，我找不到 Info.plist 檔案
參考 這邊，原來 info.plist 變成了 project 設定裡的 tab
然後將 GADApplicationIdentifier (1個) 和 SKAdNetworkItems (49個) 輸入（如下圖紅框）
第三動，建立 banner structure 來呼叫顯示廣告
import GoogleMobileAds
struct BannerVC: UIViewControllerRepresentable {
var bannerID: String
var width: CGFloat
func makeUIViewController(context: Context) -> UIViewController {
let view = GADBannerView(adSize: GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(width))
let viewController = UIViewController()
view.adUnitID = bannerID
view.rootViewController = viewController
viewController.view.addSubview(view)
#if false
/* Simulator */
let request = GADRequest()
let extras = GADExtras()
extras.additionalParameters = ["suppress_test_label": "1"]
request.register(extras)
view.load(request)
#else
/* Real device */
view.load(GADRequest())
#endif
return viewController
}
func updateUIViewController(_ uiViewController: UIViewController, context: Context) {}
}
struct Banner: View {
var bannerID: String
var width: CGFloat
var size: CGSize {
return GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(width).size
}
var body: some View {
BannerVC(bannerID: bannerID, width: width)
.frame(width: size.width, height: size.height)
}
}struct ContentView: View {
var body: some View {
VStack {
Image(systemName: "globe")
.imageScale(.large)
.foregroundColor(.accentColor)
Text("Hello, world!")
}
.padding()
Banner(bannerID: "ca-app-pub-3940256099942544/2934735716", width: UIScreen.main.bounds.width)
}
} 實作方式如上，這邊用的 bannerID 是測試使用的，請參考這邊，順利的話就可以看到下面的畫面
Simulator
若不想在 Simulator 上看到 "Test mode" 的字樣，將上面程式的 /* Simulator */ 上的 if false 改成 if true，就可將之移除如下圖，這功能在你上架 app 提供截圖時會用到
