โฆษณาคั่นระหว่างหน้า
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
โฆษณาคั่นระหว่างหน้าเป็นโฆษณาแบบเต็มหน้าจอที่ครอบคลุมอินเทอร์เฟซของแอปโฮสต์
โดยปกติแล้วโฆษณาประเภทนี้จะแสดงที่จุดเปลี่ยนหน้าปกติในขณะที่ใช้งานแอป
เช่น ระหว่างดำเนินกิจกรรมต่างๆ หรือในช่วงหยุดชั่วคราวระหว่างเปลี่ยนด่านในเกม เมื่อ
แอปแสดงโฆษณาคั่นระหว่างหน้า ผู้ใช้สามารถเลือกที่จะแตะโฆษณา
และไปยังปลายทางของโฆษณา หรือปิดโฆษณาและกลับไปที่แอป
คู่มือนี้อธิบายวิธีผสานรวมโฆษณาคั่นระหว่างหน้าในแอป Flutter
ทดสอบด้วยโฆษณาทดสอบเสมอ
เมื่อสร้างและทดสอบแอป โปรดใช้โฆษณาทดสอบแทน
โฆษณาจริงที่ใช้งานจริง หากไม่ดำเนินการดังกล่าวอาจส่งผลให้บัญชีถูกระงับ
วิธีที่ง่ายที่สุดในการโหลดโฆษณาทดสอบคือการใช้รหัสหน่วยโฆษณาทดสอบเฉพาะสำหรับ
โฆษณาคั่นระหว่างหน้า
Android
ca-app-pub-3940256099942544/1033173712
iOS
ca-app-pub-3940256099942544/4411468910
หน่วยโฆษณาทดสอบได้รับการกำหนดค่าให้แสดงโฆษณาทดสอบสำหรับทุกคำขอ และ
คุณสามารถใช้หน่วยโฆษณาทดสอบในแอปของคุณเองได้อย่างอิสระขณะเขียนโค้ด ทดสอบ และแก้ไขข้อบกพร่อง
เพียงอย่าลืมแทนที่ด้วยรหัสหน่วยโฆษณาของคุณเองก่อนเผยแพร่แอป
โหลดโฆษณา
ตัวอย่างต่อไปนี้จะโหลดโฆษณาคั่นระหว่างหน้า
แทนที่ _adUnitId ด้วยรหัสหน่วยโฆษณาของคุณเอง
เหตุการณ์โฆษณาคั่นระหว่างหน้า
การใช้ FullScreenContentCallback
ช่วยให้คุณฟังเหตุการณ์วงจร
ได้ เช่น เมื่อโฆษณาแสดงหรือถูกปิด ตั้งค่า
InterstitialAd.fullScreenContentCallback
ก่อนแสดงโฆษณาเพื่อรับ
การแจ้งเตือนสำหรับเหตุการณ์เหล่านี้ ตัวอย่างนี้จะใช้แต่ละวิธี
ad.fullScreenContentCallback = FullScreenContentCallback(
onAdShowedFullScreenContent: (ad) {
// Called when the ad showed the full screen content.
debugPrint('Ad showed full screen content.');
},
onAdFailedToShowFullScreenContent: (ad, err) {
// Called when the ad failed to show full screen content.
debugPrint('Ad failed to show full screen content with error: $err');
// Dispose the ad here to free resources.
ad.dispose();
},
onAdDismissedFullScreenContent: (ad) {
// Called when the ad dismissed full screen content.
debugPrint('Ad was dismissed.');
// Dispose the ad here to free resources.
ad.dispose();
},
onAdImpression: (ad) {
// Called when an impression occurs on the ad.
debugPrint('Ad recorded an impression.');
},
onAdClicked: (ad) {
// Called when a click is recorded for an ad.
debugPrint('Ad was clicked.');
},
);
แสดงโฆษณาคั่นระหว่างหน้า
InterstitialAd
จะแสดงเป็น Overlay
ที่ด้านบนของเนื้อหาแอปทั้งหมดและวางไว้แบบคงที่ จึงไม่สามารถเพิ่มลงใน
แผนผังวิดเจ็ต Flutter ได้ คุณเลือกเวลาที่จะแสดงโฆษณาได้โดยเรียกใช้ show()
_interstitialAd?.show();
เมื่อเรียกใช้ show()
แล้ว Ad
ที่แสดงในลักษณะนี้จะปิดโดยโปรแกรมไม่ได้
และต้องใช้ข้อมูลจากผู้ใช้ InterstitialAd
จะแสดงได้เพียงครั้งเดียว
เท่านั้น การเรียกใช้ฟังก์ชันแสดงในภายหลังจะทริกเกอร์ onAdFailedToShowFullScreenContent
ต้องทิ้งโฆษณาเมื่อไม่จำเป็นต้องเข้าถึงอีกต่อไป แนวทางปฏิบัติแนะนำ
สำหรับเวลาที่ควรเรียกใช้ dispose()
คือใน
FullScreenContentCallback.onAdDismissedFullScreenContent
และ
FullScreenContentCallback.onAdFailedToShowFullScreenContent
การเรียกกลับ
เท่านี้ก็เรียบร้อย ตอนนี้แอปของคุณพร้อมแสดงโฆษณาคั่นระหว่างหน้าแล้ว
ขั้นตอนถัดไป
ตัวอย่างที่สมบูรณ์ใน GitHub
โฆษณาคั่นระหว่างหน้า
เนื้อหาของหน้าเว็บนี้ได้รับอนุญาตภายใต้ใบอนุญาตที่ต้องระบุที่มาของครีเอทีฟคอมมอนส์ 4.0 และตัวอย่างโค้ดได้รับอนุญาตภายใต้ใบอนุญาต Apache 2.0 เว้นแต่จะระบุไว้เป็นอย่างอื่น โปรดดูรายละเอียดที่นโยบายเว็บไซต์ Google Developers Java เป็นเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-09-02 UTC
[[["เข้าใจง่าย","easyToUnderstand","thumb-up"],["แก้ปัญหาของฉันได้","solvedMyProblem","thumb-up"],["อื่นๆ","otherUp","thumb-up"]],[["ไม่มีข้อมูลที่ฉันต้องการ","missingTheInformationINeed","thumb-down"],["ซับซ้อนเกินไป/มีหลายขั้นตอนมากเกินไป","tooComplicatedTooManySteps","thumb-down"],["ล้าสมัย","outOfDate","thumb-down"],["ปัญหาเกี่ยวกับการแปล","translationIssue","thumb-down"],["ตัวอย่าง/ปัญหาเกี่ยวกับโค้ด","samplesCodeIssue","thumb-down"],["อื่นๆ","otherDown","thumb-down"]],["อัปเดตล่าสุด 2025-09-02 UTC"],[[["\u003cp\u003eInterstitial ads are full-screen ads displayed at natural transition points in an app, giving users the choice to interact or close them.\u003c/p\u003e\n"],["\u003cp\u003eThis guide provides instructions on integrating interstitial ads into Flutter apps using the google_mobile_ads package.\u003c/p\u003e\n"],["\u003cp\u003eAlways test with dedicated test ad unit IDs provided to avoid account suspension before publishing your app with your own ad unit IDs.\u003c/p\u003e\n"],["\u003cp\u003eUtilize \u003ccode\u003eFullScreenContentCallback\u003c/code\u003e to manage ad lifecycle events like display, dismissal, and errors and to properly dispose of the ad.\u003c/p\u003e\n"],["\u003cp\u003eDisplay the loaded interstitial ad by calling \u003ccode\u003eshow()\u003c/code\u003e, keeping in mind that it can only be shown once and dismissed by user interaction.\u003c/p\u003e\n"]]],["Interstitial ads are full-screen ads shown at natural app transitions. To integrate them into a Flutter app, use test ad unit IDs (Android: `ca-app-pub-3940256099942544/1033173712`, iOS: `ca-app-pub-3940256099942544/4411468910`) during development. Load an ad using `InterstitialAd.load`, handling success or failure. Utilize `FullScreenContentCallback` to manage ad lifecycle events like showing or dismissal. Display the ad with `show()`, noting it's a one-time action. Finally, dispose of the ad in `onAdDismissedFullScreenContent` and `onAdFailedToShowFullScreenContent`.\n"],null,["Select platform: [Android](/admob/android/interstitial \"View this page for the Android platform docs.\") [iOS](/admob/ios/interstitial \"View this page for the iOS platform docs.\") [Unity](/admob/unity/interstitial \"View this page for the Unity platform docs.\") [Flutter](/admob/flutter/interstitial \"View this page for the Flutter platform docs.\")\n\n\u003cbr /\u003e\n\nInterstitial ads are full-screen ads that cover the interface of their host app.\nThey're typically displayed at natural transition points in the flow of an app,\nsuch as between activities or during the pause between levels in a game. When an\napp shows an interstitial ad, the user has the choice to either tap on the ad\nand continue to its destination or close it and return to the app.\n\nThis guide explains how to integrate interstitial ads into a Flutter app.\n\nAlways test with test ads\n\nWhen building and testing your apps, make sure you use test ads rather than\nlive, production ads. Failure to do so can lead to suspension of your account.\n\nThe easiest way to load test ads is to use our dedicated test ad unit ID for\ninterstitials: \n\nAndroid \n\n ca-app-pub-3940256099942544/1033173712\n\niOS \n\n ca-app-pub-3940256099942544/4411468910\n\nThe test ad units are configured to return test ads for every request, and\nyou're free to use them in your own apps while coding, testing, and debugging.\nJust make sure you replace them with your own ad unit IDs before publishing your\napp.\n\nLoad an ad\n\nThe following example loads an interstitial ad: \n\n InterstitialAd.load(\n adUnitId: \"\u003cvar translate=\"no\"\u003e_adUnitId\u003c/var\u003e\",\n request: const AdRequest(),\n adLoadCallback: InterstitialAdLoadCallback(\n onAdLoaded: (InterstitialAd ad) {\n // Called when an ad is successfully received.\n debugPrint('Ad was loaded.');\n // Keep a reference to the ad so you can show it later.\n _interstitialAd = ad;\n },\n onAdFailedToLoad: (LoadAdError error) {\n // Called when an ad request failed.\n debugPrint('Ad failed to load with error: $error');\n },\n ),\n ); \n https://github.com/googleads/googleads-mobile-flutter/blob/9e63c9ad1459a7bbeeb9465ab3c6e25309f54683/packages/google_mobile_ads/example/lib/snippets/interstitial_ad_snippets.dart#L32-L50\n\nReplace \u003cvar translate=\"no\"\u003e_adUnitId\u003c/var\u003e with your own ad unit ID.\n\nInterstitial ad events\n\nThrough the use of `FullScreenContentCallback`, you can listen for lifecycle\nevents, such as when the ad is shown or dismissed. Set\n`InterstitialAd.fullScreenContentCallback` before showing the ad to receive\nnotifications for these events. This example implements each method: \n\n ad.fullScreenContentCallback = FullScreenContentCallback(\n onAdShowedFullScreenContent: (ad) {\n // Called when the ad showed the full screen content.\n debugPrint('Ad showed full screen content.');\n },\n onAdFailedToShowFullScreenContent: (ad, err) {\n // Called when the ad failed to show full screen content.\n debugPrint('Ad failed to show full screen content with error: $err');\n // Dispose the ad here to free resources.\n ad.dispose();\n },\n onAdDismissedFullScreenContent: (ad) {\n // Called when the ad dismissed full screen content.\n debugPrint('Ad was dismissed.');\n // Dispose the ad here to free resources.\n ad.dispose();\n },\n onAdImpression: (ad) {\n // Called when an impression occurs on the ad.\n debugPrint('Ad recorded an impression.');\n },\n onAdClicked: (ad) {\n // Called when a click is recorded for an ad.\n debugPrint('Ad was clicked.');\n },\n ); \n https://github.com/googleads/googleads-mobile-flutter/blob/9e63c9ad1459a7bbeeb9465ab3c6e25309f54683/packages/google_mobile_ads/example/lib/snippets/interstitial_ad_snippets.dart#L56-L81\n\nDisplay an interstitial ad\n\nAn `InterstitialAd` is displayed as an [`Overlay`](//api.flutter.dev/flutter/widgets/Overlay-class.html)\non top of all app content and is statically placed; thus, it can't be added to\nthe Flutter widget tree. You can choose when to show the ad by calling `show()`. \n\n _interstitialAd?.show(); \n https://github.com/googleads/googleads-mobile-flutter/blob/9e63c9ad1459a7bbeeb9465ab3c6e25309f54683/samples/admob/interstitial_example/lib/main.dart#L238-L238\n\nOnce `show()` is called, an `Ad` displayed this way can't be dismissed\nprogrammatically and requires user input. An `InterstitialAd` can only be shown\nonce. Subsequent calls to show will trigger `onAdFailedToShowFullScreenContent`.\n\nAn ad must be disposed when access to it is no longer needed. The best practice\nfor when to call `dispose()` is in the\n`FullScreenContentCallback.onAdDismissedFullScreenContent` and\n`FullScreenContentCallback.onAdFailedToShowFullScreenContent` callbacks.\n\nThat's it! Your app is now ready to display interstitial ads.\n\nNext steps\n\n- See [Interstitial best\n practices](//www.youtube.com/watch?v=r2RgFD3Apyo&index=5&list=PLOU2XLYxmsIKX0pUJV3uqp6N3NeHwHh0c) and [interstitial ad guidance](//support.google.com/admob/answer/6066980).\n- Check out an [Interstitial ads case\n study](//admob.google.com/home/resources/freaking-math-powers-revenue-increase-with-google-admob-support/).\n- If you haven't already, create your own interstitial ad unit in the [AdMob\n UI](//apps.admob.com/).\n\nComplete example on GitHub\n\n[Interstitial](//github.com/googleads/googleads-mobile-flutter/tree/main/samples/admob/interstitial_example)"]]