Quảng cáo khi mở ứng dụng là một định dạng quảng cáo đặc biệt dành cho những nhà xuất bản muốn kiếm tiền từ màn hình tải ứng dụng của họ. Quảng cáo khi mở ứng dụng được thiết kế để xuất hiện khi người dùng chạy ứng dụng của bạn trên nền trước và họ có thể đóng quảng cáo này bất cứ lúc nào.
Quảng cáo khi mở ứng dụng tự động hiển thị một vùng nhỏ chứa thông tin thương hiệu để người dùng biết họ đang mở ứng dụng của bạn. Dưới đây là một ví dụ về cách hiển thị của quảng cáo khi mở ứng dụng:

Điều kiện tiên quyết
Trước khi tiếp tục, hãy làm như sau:
- Cài đặt trình bổ trợ Flutter phiên bản 0.13.6 trở lên.
- Thiết lập Google Mobile Ads Flutter Plugin. Ứng dụng Flutter của bạn phải nhập Google Mobile Ads Flutter Plugin
Luôn thử nghiệm bằng quảng cáo thử nghiệm
Khi bạn tạo và thử nghiệm ứng dụng, hãy nhớ sử dụng quảng cáo thử nghiệm thay vì quảng cáo đang chạy trong thực tế. Chúng tôi có thể tạm ngưng tài khoản của bạn nếu bạn không làm như vậy.
Cách dễ nhất để tải quảng cáo thử nghiệm là sử dụng ID đơn vị quảng cáo thử nghiệm dành riêng cho quảng cáo có tặng thưởng trên Android và iOS:
/21775744923/example/app-open
Các mã này được định cấu hình đặc biệt để trả về quảng cáo thử nghiệm cho mọi yêu cầu và bạn có thể sử dụng các mã này trong ứng dụng của mình khi lập trình, chạy thử nghiệm và gỡ lỗi. Bạn chỉ cần nhớ thay thế mã này bằng mã đơn vị quảng cáo của mình trước khi xuất bản ứng dụng.
Triển khai
Các bước chính để tích hợp quảng cáo khi mở ứng dụng là:
- Tạo một lớp tiện ích sẽ tải quảng cáo trước khi bạn cần hiển thị quảng cáo đó.
- Tải quảng cáo.
- Đăng ký các lệnh gọi lại và hiển thị quảng cáo.
- Đăng ký
AppStateEventNotifier.appStateStreamđể hiển thị quảng cáo trong các sự kiện đưa ứng dụng lên nền trước.
Tạo một lớp tiện ích
Tạo một lớp mới có tên là AppOpenAdManager để tải quảng cáo. Lớp này sẽ quản lý một biến thực thể để theo dõi một quảng cáo đã tải và mã đơn vị quảng cáo cho từng nền tảng.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'dart:io' show Platform;
class AppOpenAdManager {
String adUnitId = '/21775744923/example/app-open';
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;
}
}
Tải quảng cáo
Bạn phải chuẩn bị sẵn quảng cáo khi mở ứng dụng trước khi người dùng mở ứng dụng của bạn. Hãy triển khai một lớp tiện ích để thực hiện các yêu cầu quảng cáo trước khi bạn cần hiển thị quảng cáo.
Bạn có thể tải quảng cáo bằng phương thức loadWithAdManagerAdRequest trên lớp AppOpenAd. Phương thức tải này yêu cầu một mã đơn vị quảng cáo, một chế độ hướng, một đối tượng AdManagerAdRequest và một trình xử lý hoàn thành để gọi khi tải quảng cáo thành công hoặc không thành công. Đối tượng AppOpenAd đã tải được cung cấp dưới dạng một thông số trong trình xử lý hoàn thành. Ví dụ sau đây cho biết cách tải một AppOpenAd.
public class AppOpenAdManager {
...
/// Load an AppOpenAd.
void loadAd() {
AppOpenAd.loadWithAdManagerAdRequest(
adUnitId: adUnitId,
adManagerAdRequest: AdManagerAdRequest(),
adLoadCallback: AppOpenAdLoadCallback(
onAdLoaded: (ad) {
_appOpenAd = ad;
},
onAdFailedToLoad: (error) {
print('AppOpenAd failed to load: $error');
// Handle the error.
},
),
);
}
}
Hiển thị quảng cáo và xử lý các lệnh gọi lại ở chế độ toàn màn hình
Trước khi hiển thị quảng cáo, hãy đăng ký một FullScreenContentCallback cho mỗi sự kiện quảng cáo mà bạn muốn theo dõi.
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();
},
);
}
}
Nếu người dùng quay lại ứng dụng của bạn sau khi rời khỏi ứng dụng bằng cách nhấp vào một quảng cáo khi mở ứng dụng, hãy đảm bảo rằng họ không thấy một quảng cáo khi mở ứng dụng khác.
Theo dõi các sự kiện đưa ứng dụng lên nền trước
Để được thông báo về các sự kiện đưa ứng dụng lên nền trước, bạn cần đăng ký AppStateEventNotifier.appStateStream và theo dõi các sự kiện 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();
}
}
}
Giờ đây, bạn có thể thêm mã khởi chạy AppLifecycleReactor và bắt đầu theo dõi các thay đổi trong vòng đời của ứng dụng. Ví dụ: trên trang chủ của bạn:
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);
}
Xem xét thời hạn quảng cáo
Để đảm bảo bạn không hiển thị một quảng cáo đã hết hạn, hãy thêm một dấu thời gian vào AppOpenAdManager nhằm kiểm tra thời lượng kể từ khi quảng cáo của bạn được tải.
Tiếp theo, hãy sử dụng dấu thời gian đó để kiểm tra xem liệu quảng cáo có còn hợp lệ hay không.
/// 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.loadWithAdManagerAdRequest(
adUnitId: adUnitId,
orientation: AppOpenAd.orientationPortrait,
adManagerAdRequest: AdManagerAdRequest(),
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();
}
}
Khởi động nguội và màn hình tải
Từ đầu đến giờ, tài liệu này giả định rằng bạn chỉ hiển thị quảng cáo khi mở ứng dụng vào lúc người dùng đưa ứng dụng của bạn lên nền trước khi ứng dụng bị tạm ngưng trong bộ nhớ. Quy trình "Khởi động nguội" xảy ra khi người dùng chạy ứng dụng của bạn nhưng trước đó, ứng dụng không bị tạm ngưng trong bộ nhớ.
Ví dụ về khởi động nguội là khi người dùng mở ứng dụng của bạn lần đầu tiên. Trong trường hợp khởi động nguội, quảng cáo khi mở ứng dụng chưa được tải trước lần nào nên chưa sẵn sàng để hiển thị ngay lập tức. Một tình huống có thể xảy ra trong khoảng thời gian từ khi bạn yêu cầu quảng cáo cho đến khi nhận được quảng cáo (gọi là độ trễ), đó là người dùng vừa mới sử dụng ứng dụng của bạn trong chốc lát thì một quảng cáo không phù hợp đột ngột xuất hiện khiến họ bị bất ngờ. Bạn nên tránh làm như vậy vì điều này sẽ tạo ra trải nghiệm kém cho người dùng.
Để sử dụng quảng cáo khi mở ứng dụng vào lúc khởi động nguội, cách tốt nhất là bạn nên dùng màn hình tải để tải các thành phần trò chơi hoặc ứng dụng và chỉ nên hiển thị quảng cáo trên màn hình tải. Bạn đừng hiển thị quảng cáo nếu ứng dụng đã tải xong và đã đưa người dùng đến nội dung chính của ứng dụng.
Các phương pháp hay nhất
Quảng cáo khi mở ứng dụng giúp bạn kiếm tiền từ màn hình tải của ứng dụng, khi ứng dụng chạy lần đầu và khi chuyển đổi ứng dụng. Tuy nhiên, bạn cần ghi nhớ các phương pháp hay nhất để làm cho người dùng thích sử dụng ứng dụng của bạn. Tốt nhất là bạn nên:
- Hiển thị quảng cáo khi mở ứng dụng sau khi người dùng đã sử dụng ứng dụng của bạn vài lần.
- Hiển thị quảng cáo khi mở ứng dụng trong thời gian người dùng chờ ứng dụng của bạn tải.
- Nếu bạn có màn hình tải trong quảng cáo khi mở ứng dụng và màn hình tải đó đã tải xong trước khi quảng cáo bị đóng, thì bạn có thể đóng màn hình tải trong trình xử lý sự kiện
onAdDismissedFullScreenContent.