插頁式廣告會全螢幕顯示,覆蓋整個應用程式的介面。 這類廣告通常顯示在應用程式流程中的自然轉換點, 例如操作後的空檔或遊戲關卡之間的暫停時間。應用程式顯示中插廣告時,使用者可選擇輕觸廣告前往到達網頁,或是關閉廣告返回應用程式。
本指南說明如何在 Flutter 應用程式中整合中繼插頁廣告。
一律使用測試廣告進行測試
建構及測試應用程式時,請務必使用測試廣告,而非實際的正式廣告。否則帳戶可能會遭到停權。
如要載入測試廣告,最簡單的方法是使用插頁式廣告專用的測試廣告單元 ID:
Android
ca-app-pub-3940256099942544/1033173712
iOS
ca-app-pub-3940256099942544/4411468910
測試廣告單元已設定為針對每個請求傳回測試廣告,您可以在編寫、測試及偵錯程式碼時,自由地在自己的應用程式中使用這些廣告單元。發布應用程式前,請務必將這些 ID 換成您自己的廣告單元 ID。
載入廣告
以下範例會載入插頁式廣告:
class InterstitialExampleState extends State<InterstitialExample> { InterstitialAd? _interstitialAd; // TODO: replace this test ad unit with your own ad unit. final adUnitId = Platform.isAndroid ? 'ca-app-pub-3940256099942544/1033173712' : 'ca-app-pub-3940256099942544/4411468910'; /// Loads an interstitial ad. void loadAd() { InterstitialAd.load( adUnitId: adUnitId, request: const AdRequest(), adLoadCallback: InterstitialAdLoadCallback( // Called when an ad is successfully received. onAdLoaded: (ad) { debugPrint('$ad loaded.'); // Keep a reference to the ad so you can show it later. _interstitialAd = ad; }, // Called when an ad request failed. onAdFailedToLoad: (LoadAdError error) { debugPrint('InterstitialAd failed to load: $error'); }, )); } }
插頁式廣告事件
您可以使用 FullScreenContentCallback
監聽生命週期事件,例如廣告顯示或關閉時。在顯示廣告前設定 InterstitialAd.fullScreenContentCallback
,即可接收這些事件的通知。這個範例會實作每個方法:
class InterstitialExampleState extends State<InterstitialExample> { InterstitialAd? _interstitialAd; // TODO: replace this test ad unit with your own ad unit. final adUnitId = Platform.isAndroid ? 'ca-app-pub-3940256099942544/1033173712' : 'ca-app-pub-3940256099942544/4411468910'; /// Loads an interstitial ad. void loadAd() { InterstitialAd.load( adUnitId: adUnitId, request: const AdRequest(), adLoadCallback: InterstitialAdLoadCallback( // Called when an ad is successfully received. onAdLoaded: (ad) { ad.fullScreenContentCallback = FullScreenContentCallback( // Called when the ad showed the full screen content. onAdShowedFullScreenContent: (ad) {}, // Called when an impression occurs on the ad. onAdImpression: (ad) {}, // Called when the ad failed to show full screen content. onAdFailedToShowFullScreenContent: (ad, err) { // Dispose the ad here to free resources. ad.dispose(); }, // Called when the ad dismissed full screen content. onAdDismissedFullScreenContent: (ad) { // Dispose the ad here to free resources. ad.dispose(); }, // Called when a click is recorded for an ad. onAdClicked: (ad) {}); debugPrint('$ad loaded.'); // Keep a reference to the ad so you can show it later. _interstitialAd = ad; }, // Called when an ad request failed. onAdFailedToLoad: (LoadAdError error) { debugPrint('InterstitialAd failed to load: $error'); }, )); } }
顯示插頁式廣告
InterstitialAd
會顯示為 Overlay
,位於所有應用程式內容的頂端,且位置固定,因此無法新增至 Flutter 小工具樹狀結構。您可以呼叫 show()
,選擇廣告顯示時間。
_interstitiaAd.show();
呼叫 show()
後,以這種方式顯示的 Ad
無法以程式輔助方式關閉,必須由使用者輸入內容。InterstitialAd
只能顯示一次。後續呼叫顯示畫面時,系統會觸發 onAdFailedToShowFullScreenContent
。
不再需要存取廣告時,必須將廣告物件捨棄。呼叫 dispose()
的最佳做法位於 FullScreenContentCallback.onAdDismissedFullScreenContent
和 FullScreenContentCallback.onAdFailedToShowFullScreenContent
回呼中。
大功告成!您的應用程式現在可以顯示插頁式廣告。
後續步驟
- 請參閱插頁式廣告最佳做法和插頁式廣告指南。
- 請參閱插頁式廣告個案研究。
- 如果尚未建立,請在 AdMob 使用者介面中建立自己的插頁式廣告單元。