[SwiftUI] Google AdMob 적용하기 (배너광고, 보상형광고)

SwiftUI

애드몹 광고를 적용하기에 앞서 애드몹에 가입하고, 앱을 생성하고, 광고단위를 생성하는 작업이 필요하겠지만,

그거까지는 다 했는데 swiftui에서 어떻게 적용해야할 지 몰라 헤매는 사람들을 위해 포스팅을 한다.

따라서 애드몹 파트는 준비 안했다면 다른 글들을 보고 준비한 다음 다시 오면 되겠다.

 

가장 먼저 패키지를 등록해준다. 

코코아팟으로 등록하는게 일반적이긴 하지만, 코코아팟을 별로 안좋아하는 관계로 spm을 통해 설정해주자.

repository ->https://github.com/googleads/swift-package-manager-google-mobile-ads.git

GitHub - googleads/swift-package-manager-google-mobile-ads

이후 info.plist에서 해줘야 할 작업이 있다.

아래의 사진과 같이 설정해주자(대소문자와 띄어쓰기를 철저하게 구분해서 완전히 똑같이 적어야한다.)

GADApplicationIdentifier -> 자신의 admob 앱 id 를 적어주면 된다.

GADIsAdManagerApp -> true 로 설정해준다. true로 설정하면 1이 표시될 것이다.

 

이제 준비는 끝났다. 적용만 하면된다!

Common

먼저 GoogleAdmobManager를 초기화해줘야한다. 대부분 swift 혹은 swiftui에 AppDelegate를 추가해서 사용하는데, 

간단하게 ContentView에서 onAppear과 isInitiated 변수로 앱 실행시 한 번만 초기화 하도록 구성해보았다.

start() 함수의 콜백으로 GADInitializationStatus를 가진 함수가 있는데, 문서를 봐도 구글링을 해봐도 해당 status를 어떻게 쓰는지 모르겠다. (혹시 아시는 분이 있다면 참고 링크 부탁드립니다.) 

이렇게 start()까지 진행해줬다면 준비는 모두 끝났다. 광고를 띄우기만 하면 된다.

Banner

배너광고를 만들기 위해서는 viewController로 존재하는 광고 UI를 Representable로 만들어줘야 한다.

struct GADBanner: UIViewControllerRepresentable {
    
    func makeUIViewController(context: Context) -> some UIViewController {
        let view = GADBannerView(adSize: GADAdSizeBanner)
        let viewController = UIViewController()
        // test Key
        view.adUnitID = "ca-app-pub-3940256099942544/2934735716"
        view.rootViewController = viewController
        viewController.view.addSubview(view)
        viewController.view.frame = CGRect(origin: .zero, size: GADAdSizeBanner.size)
        view.load(GADRequest())
        return viewController
    }
    func updateUIViewController(_ uiViewController: UIViewControllerType, context: Context) {
    
    }
}

그냥 간단하게 복사해서 쓰면 된다. 저기 testKey라고 적힌 부분아래 adUnitID는 실제 배포할 때, 여러분의 광고단위의 ID를 넣어주면 된다. 그렇지 않으면 test mode의 광고만 계속 나오게 되니 주의하자.

 

이렇게 ViewController도 UI로 만들어줬다면 바로 적용하면 끝이다.

원하는 위치에 다음코드 한줄만 적어주면 된다.

GADBanner().frame(width: GADAdSizeBanner.size.width, height: GADAdSizeBanner.size.height)

내 경우에는 다음과 같이 사용했다.

ZStack {
	VStack {
    	내 UI들
		...
	}
    VStack {
    	Spacer()
        GADBanner().frame(width: GADAdSizeBanner.size.width, height: GADAdSizeBanner.size.height)
    }
}

이정도로 사용해도 큰 문제는 없지만, 만약 본인의 앱이 스크롤이 안되며, 광고가 하단에 있는 View를 가리게 된다면

하나의 VStack 안에서 해결해야할 것이다.

Reward

보상형광고는 배너광고와는 다르게 클래스를 하나 생성해주어야한다.

정확히는 매 광고 present 때마다 작성해도 되지만 인스턴스를 하나만들어놓고 관리하고자 만들어 놓는것이다.

class RewardedAd {
    private let rewardId = "ca-app-pub-3940256099942544/1712485313" // Test Key
    
    var rewardedAd: GADRewardedAd?
    
    init() {
        load()
    }
    
    func load(){
        guard rewardedAd != nil else {
            return
        }
        let request = GADRequest()
        GADRewardedAd.load(withAdUnitID: rewardId, request: request, completionHandler: {rewardedAd, error in
            if error != nil {
                // load Ad failed need handle
                return
            }
            self.rewardedAd = rewardedAd
        })
    }
    
    func showAd(rewardFunction: @escaping () -> Void) -> Bool {
        guard let rewardedAd = rewardedAd else {
            return false
        }
        
        guard let root = UIApplication.shared.keyWindowPresentedController else {
            return false
        }
        rewardedAd.present(fromRootViewController: root, userDidEarnRewardHandler: rewardFunction)
        return true
    }
}

여기서도 마찬가지로 Test Key 부분에 여러분의 광고 단위 id를 적어넣어주면 된다.

마지막으로 보상형 광고를 띄우기 위해 extension으로 하나 만들어줘야 하는 게 있는데, 자세한 내용은 나도 모른다.

일단 추가하고 보자.

extension UIApplication {
    
    var keyWindow: UIWindow? {
        return UIApplication.shared.connectedScenes
            .filter { $0.activationState == .foregroundActive }
            .first(where: { $0 is UIWindowScene })
            .flatMap({ $0 as? UIWindowScene })?.windows
            .first(where: \.isKeyWindow)
    }
    
    var keyWindowPresentedController: UIViewController? {
        var viewController = self.keyWindow?.rootViewController
        
        if let presentedController = viewController as? UITabBarController {
            viewController = presentedController.selectedViewController
        }
        
        while let presentedController = viewController?.presentedViewController {
            if let presentedController = presentedController as? UITabBarController {
                viewController = presentedController.selectedViewController
            } else {
                viewController = presentedController
            }
        }
        return viewController
    }
}

자 여기까지 추가해줬다면 보상형 광고도 설정은 끝났다.

이제 원하는 부분에 event로 보상형 광고를 넣어주면 된다.

예시로 다음 코드를 참고하면 되겠다.

struct TestView: View {
    let rewardAd = RewardAd()
    var body: some View {    
        VStack {
            Button(action: {
                let _ = rewardAd.showAd(rewardFunction: {
                    보상관련 코드 작성
                })
            }, label: {
                Text("보상받기")
            })
        }
    }
}