應用程式開啟頁面廣告是一種特殊廣告格式,適合希望藉由應用程式載入畫面賺取收益的發布商。應用程式開啟頁面廣告會在使用者將應用程式切換至前景時出現,而且使用者隨時可以關閉。
應用程式開啟頁面廣告會自動保留一小塊畫面,向使用者顯示應用程式的品牌資訊。以下是應用程式開啟頁面廣告的示例:
必要條件
請務必使用測試廣告進行測試
建構及測試應用程式時,請務必使用測試廣告,而非實際的正式版廣告。否則可能導致帳戶停權。
如要載入測試廣告,最簡單的方法是使用 Android 和 iOS 獎勵廣告專用的測試廣告單元 ID:
Android
ca-app-pub-3940256099942544/9257395921
iOS
ca-app-pub-3940256099942544/5575463023
這些廣告已特別設定為針對每項要求傳回測試廣告,您可以在編寫程式碼、測試及偵錯時,在自己的應用程式中自由使用這些廣告。請務必在發布應用程式前,將這些 ID 替換為您自己的廣告單元 ID。
實作
整合應用程式開啟頁面廣告的主要步驟如下:
- 建立實用工具類別,在需要顯示廣告前先載入廣告。
- 載入廣告。
- 註冊回呼並顯示廣告。
- 訂閱
AppStateEventNotifier.appStateStream
,即可在前景事件期間顯示廣告。
建立公用程式類別
建立名為 AppOpenAdManager
的新類別來載入廣告。這個類別會管理例項變數,以便追蹤已載入的廣告,以及每個平台的廣告單元 ID。
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'dart:io' show Platform;
class AppOpenAdManager {
String adUnitId = Platform.isAndroid
? 'ca-app-pub-3940256099942544/9257395921'
: 'ca-app-pub-3940256099942544/5575463023';
AppOpenAd? _appOpenAd;
bool _isShowingAd = false;
/// Load an AppOpenAd.
void loadAd() {
// We will implement this below.
}
/// Whether an ad is available to be shown.
bool get isAdAvailable {
return _appOpenAd != null;
}
}
載入廣告
應用程式開啟廣告必須在使用者進入應用程式前就準備就緒。請實作公用程式類別,在需要顯示廣告時提前發出廣告請求。
載入廣告的方式是使用 AppOpenAd
類別的 load
方法。載入方法需要廣告單元 ID、方向模式、AdRequest
物件,以及在廣告載入成功或失敗時呼叫的完成處理常式。完成處理常式會將已載入的 AppOpenAd
物件做為參數提供。以下範例說明如何載入 AppOpenAd
。
public class AppOpenAdManager {
...
/// Load an AppOpenAd.
void loadAd() {
AppOpenAd.load(
adUnitId: adUnitId,
adRequest: AdRequest(),
adLoadCallback: AppOpenAdLoadCallback(
onAdLoaded: (ad) {
_appOpenAd = ad;
},
onAdFailedToLoad: (error) {
print('AppOpenAd failed to load: $error');
// Handle the error.
},
),
);
}
}
顯示廣告並處理全螢幕回呼
在放送廣告前,請為每個要監聽的廣告事件註冊 FullScreenContentCallback
。
public class AppOpenAdManager {
...
public void showAdIfAvailable() {
if (!isAdAvailable) {
print('Tried to show ad before available.');
loadAd();
return;
}
if (_isShowingAd) {
print('Tried to show ad while already showing an ad.');
return;
}
// Set the fullScreenContentCallback and show the ad.
_appOpenAd!.fullScreenContentCallback = FullScreenContentCallback(
onAdShowedFullScreenContent: (ad) {
_isShowingAd = true;
print('$ad onAdShowedFullScreenContent');
},
onAdFailedToShowFullScreenContent: (ad, error) {
print('$ad onAdFailedToShowFullScreenContent: $error');
_isShowingAd = false;
ad.dispose();
_appOpenAd = null;
},
onAdDismissedFullScreenContent: (ad) {
print('$ad onAdDismissedFullScreenContent');
_isShowingAd = false;
ad.dispose();
_appOpenAd = null;
loadAd();
},
);
}
}
如果使用者在點選應用程式開啟廣告離開應用程式後返回應用程式,請確認系統不會向他們顯示其他應用程式開啟廣告。
監聽應用程式前景事件
如要接收應用程式前景事件的通知,您必須訂閱 AppStateEventNotifier.appStateStream
並監聽 foreground
事件。
import 'package:app_open_example/app_open_ad_manager.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
/// Listens for app foreground events and shows app open ads.
class AppLifecycleReactor {
final AppOpenAdManager appOpenAdManager;
AppLifecycleReactor({required this.appOpenAdManager});
void listenToAppStateChanges() {
AppStateEventNotifier.startListening();
AppStateEventNotifier.appStateStream
.forEach((state) => _onAppStateChanged(state));
}
void _onAppStateChanged(AppState appState) {
// Try to show an app open ad if the app is being resumed and
// we're not already showing an app open ad.
if (appState == AppState.foreground) {
appOpenAdManager.showAdIfAvailable();
}
}
}
您現在可以新增 AppLifecycleReactor
的初始化作業,並開始監聽應用程式生命週期變更。舉例來說,您可以透過首頁:
import 'package:app_open_example/app_open_ad_manager.dart';
import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'app_lifecycle_reactor.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
MobileAds.instance.initialize();
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'App Open Example',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'App Open Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
/// Example home page for an app open ad.
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
late AppLifecycleReactor _appLifecycleReactor;
@override
void initState() {
super.initState();
AppOpenAdManager appOpenAdManager = AppOpenAdManager()..loadAd();
_appLifecycleReactor = AppLifecycleReactor(
appOpenAdManager: appOpenAdManager);
}
考慮廣告效期
為避免顯示已失效的廣告,請在 AppOpenAdManager
中加入時間戳記,以便檢查廣告載入多久。然後使用該時間戳記檢查廣告是否仍有效。
/// Utility class that manages loading and showing app open ads.
class AppOpenAdManager {
...
/// Maximum duration allowed between loading and showing the ad.
final Duration maxCacheDuration = Duration(hours: 4);
/// Keep track of load time so we don't show an expired ad.
DateTime? _appOpenLoadTime;
...
/// Load an AppOpenAd.
void loadAd() {
AppOpenAd.load(
adUnitId: adUnitId,
orientation: AppOpenAd.orientationPortrait,
adRequest: AdRequest(),
adLoadCallback: AppOpenAdLoadCallback(
onAdLoaded: (ad) {
print('$ad loaded');
_appOpenLoadTime = DateTime.now();
_appOpenAd = ad;
},
onAdFailedToLoad: (error) {
print('AppOpenAd failed to load: $error');
},
),
);
}
/// Shows the ad, if one exists and is not already being shown.
///
/// If the previously cached ad has expired, this just loads and caches a
/// new ad.
void showAdIfAvailable() {
if (!isAdAvailable) {
print('Tried to show ad before available.');
loadAd();
return;
}
if (_isShowingAd) {
print('Tried to show ad while already showing an ad.');
return;
}
if (DateTime.now().subtract(maxCacheDuration).isAfter(_appOpenLoadTime!)) {
print('Maximum cache duration exceeded. Loading another ad.');
_appOpenAd!.dispose();
_appOpenAd = null;
loadAd();
return;
}
// Set the fullScreenContentCallback and show the ad.
_appOpenAd!.fullScreenContentCallback = FullScreenContentCallback(...);
_appOpenAd!.show();
}
}
冷啟動和載入畫面
目前的說明文件假設您只會在使用者將應用程式從記憶體中暫停後,在前景顯示應用程式開啟頁面廣告。當應用程式啟動,但先前未在記憶體中暫停時,就會發生「冷啟動」。
舉例來說,使用者初次開啟應用程式就是冷啟動。在冷啟動期間,您不會有先前載入的應用程式開啟頁面廣告,因此無法立即顯示廣告。在您提出廣告請求和收到廣告回應之間,可能會出現延遲的情況,導致使用者在應用程式運作一段時間後,才會看到不相關的廣告。這會造成使用者體驗不佳,因此應避免採用。
在冷啟動時使用應用程式開啟頁面廣告的首選方式,是使用載入畫面載入遊戲或應用程式素材資源,並只在載入畫面中顯示廣告。如果應用程式已完成載入,並將使用者導向應用程式的主內容,請勿顯示廣告。
最佳做法
應用程式開啟頁面廣告可在應用程式首次啟動和切換應用程式期間,協助您透過應用程式的載入畫面營利,但請務必遵循最佳做法,讓使用者能盡情享受應用程式。建議做法如下:
- 等使用者用過應用程式幾次之後,再放送第一則應用程式開啟頁面廣告。
- 在使用者等待應用程式載入的期間,顯示應用程式開啟頁面廣告。
- 如果載入畫面顯示在應用程式開啟頁面廣告的背景中,且載入畫面在廣告關閉前就完成載入,建議您利用
onAdDismissedFullScreenContent
事件處理常式關閉載入畫面。