بنر

تبلیغات بنری یک نقطه را در طرح‌بندی برنامه اشغال می‌کنند، چه در بالا یا پایین صفحه دستگاه. در حالی که کاربران در حال تعامل با برنامه هستند، روی صفحه می مانند و می توانند پس از مدت زمان مشخصی به طور خودکار بازخوانی شوند.

این راهنما شما را با تبلیغات بنری تطبیقی ​​لنگر شروع می کند. بنرهای تطبیقی ​​لنگر، اندازه آگهی را برای هر دستگاه با استفاده از عرض تبلیغی که شما مشخص می‌کنید، بهینه می‌کنند.

تبلیغات بنری تطبیقی ​​لنگر، تبلیغات با نسبت ابعاد ثابت هستند تا تبلیغات با اندازه ثابت . نسبت تصویر مشابه 320x50 است. هنگامی که عرض کامل موجود را مشخص کردید، Google Mobile Ads SDK تبلیغی را با ارتفاع بهینه برای آن عرض برمی‌گرداند. ارتفاع بهینه برای تبلیغ در درخواست‌های مختلف آگهی ثابت می‌ماند و محتوای اطراف آگهی در زمان تازه‌سازی آگهی در جای خود باقی می‌ماند.

همیشه با تبلیغات آزمایشی تست کنید

هنگام ساخت و آزمایش برنامه های خود، مطمئن شوید که از تبلیغات آزمایشی به جای تبلیغات زنده و تولیدی استفاده می کنید. عدم انجام این کار می تواند منجر به تعلیق حساب شما شود.

ساده ترین راه برای بارگیری تبلیغات آزمایشی استفاده از شناسه واحد آگهی آزمایشی اختصاصی ما برای بنرها است:

اندروید 

ca-app-pub-3940256099942544/9214589741

iOS

ca-app-pub-3940256099942544/2435281174

واحدهای آگهی آزمایشی به گونه‌ای پیکربندی شده‌اند که برای هر درخواستی، آگهی‌های آزمایشی را برگردانند، و شما می‌توانید هنگام کدنویسی، آزمایش و اشکال‌زدایی از آنها در برنامه‌های خود استفاده کنید. فقط مطمئن شوید که قبل از انتشار برنامه خود، آنها را با شناسه واحد تبلیغاتی خود جایگزین کنید.

اندازه آگهی را دریافت کنید

برای درخواست بنر تبلیغاتی با اندازه تبلیغات صحیح مراحل زیر را دنبال کنید:

  1. با استفاده از MediaQuery.of(context) عرض صفحه‌نمایش دستگاه را بر حسب پیکسل‌های مستقل از چگالی (dp) دریافت کنید. اگر نمی خواهید از عرض تمام صفحه استفاده کنید، می توانید عرض خود را تنظیم کنید.

  2. از روش استاتیک مناسب در کلاس AdSize برای بدست آوردن یک شی AdSize استفاده کنید. برای مثال، از AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(int width) برای دریافت اندازه تبلیغ برای جهت فعلی استفاده کنید. 

// Get an AnchoredAdaptiveBannerAdSize before loading the ad.
final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
    MediaQuery.sizeOf(context).width.truncate());

یک تبلیغ را بارگیری کنید

مثال زیر یک بنر تبلیغاتی را نشان می دهد: 

class BannerExampleState extends State<BannerExample>{
  BannerAd? _bannerAd;
  bool _isLoaded = false;

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/9214589741'
    : 'ca-app-pub-3940256099942544/2435281174';

  /// Loads a banner ad.
  void loadAd() async {
    // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
    final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
        MediaQuery.sizeOf(context).width.truncate());

    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: size,
      listener: BannerAdListener(
        // Called when an ad is successfully received.
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        // Called when an ad request failed.
        onAdFailedToLoad: (ad, err) {
          debugPrint('BannerAd failed to load: $error');
          // Dispose the ad here to free resources.
          ad.dispose();
        },
      ),
    )..load();
  }
}

از طریق استفاده از BannerAdListener ، می‌توانید به رویدادهای چرخه حیات گوش دهید، مانند زمانی که یک تبلیغ بارگیری می‌شود. این مثال هر روش را پیاده سازی می کند و یک پیام را به کنسول ثبت می کند: 

class BannerExampleState extends State<BannerExample> {
  BannerAd? _bannerAd;
  bool _isLoaded = false;

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/9214589741'
    : 'ca-app-pub-3940256099942544/2435281174';


  /// Loads a banner ad.
  void loadAd() async {
    // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
    final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
        MediaQuery.sizeOf(context).width.truncate());

    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: size,
      listener: BannerAdListener(
        // Called when an ad is successfully received.
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        // Called when an ad request failed.
        onAdFailedToLoad: (ad, err) {
          debugPrint('BannerAd failed to load: $error');
          // Dispose the ad here to free resources.
          ad.dispose();
        },
        // Called when an ad opens an overlay that covers the screen.
        onAdOpened: (Ad ad) {},
        // Called when an ad removes an overlay that covers the screen.
        onAdClosed: (Ad ad) {},
        // Called when an impression occurs on the ad.
        onAdImpression: (Ad ad) {},
      ),
    )..load();
  }
}

یک آگهی را تازه کنید

اگر واحد تبلیغات خود را برای بازخوانی پیکربندی کرده‌اید، نیازی به درخواست آگهی دیگری در صورت عدم بارگیری آگهی ندارید. Google Mobile Ads SDK به نرخ تازه‌سازی که در رابط کاربری AdMob مشخص کرده‌اید احترام می‌گذارد. اگر بازخوانی را فعال نکرده‌اید، درخواست جدیدی صادر کنید. برای جزئیات بیشتر در مورد بازخوانی واحد تبلیغات، مانند تنظیم نرخ تجدید، به استفاده از بازخوانی خودکار برای تبلیغات بنر مراجعه کنید.

نمایش یک بنر تبلیغاتی

برای نمایش BannerAd به عنوان ویجت، باید یک AdWidget را با یک تبلیغ پشتیبانی شده پس از فراخوانی load() نمونه سازی کنید. شما می توانید قبل از فراخوانی load() ویجت را ایجاد کنید، اما load() باید قبل از افزودن آن به درخت ویجت فراخوانی شود.

AdWidget از کلاس Flutter's Widget به ارث می رسد و می تواند مانند هر ویجت دیگری استفاده شود. در iOS، مطمئن شوید که ویجت را در یک ویجت با عرض و ارتفاع مشخص قرار داده اید. در غیر این صورت ممکن است تبلیغ شما نمایش داده نشود. یک BannerAd می توان در ظرفی با اندازه ای قرار داد که با آگهی مطابقت دارد:

if (_bannerAd != null) {
  Align(
    alignment: Alignment.bottomCenter,
    child: SafeArea(
      child: SizedBox(
        width: _bannerAd!.size.width.toDouble(),
        height: _bannerAd!.size.height.toDouble(),
        child: AdWidget(ad: _bannerAd!),
      ),
    ),
  )
}

یک آگهی زمانی که دیگر نیازی به دسترسی به آن نیست باید حذف شود. بهترین روش برای زمان فراخوانی dispose() پس از حذف AdWidget از درخت ویجت یا در BannerAdListener.onAdFailedToLoad() است.

همین! اکنون برنامه شما برای نمایش تبلیغات بنری آماده است.

محدودیت پیمایش در اندروید 9 و پایین تر

می‌دانیم که برخی از دستگاه‌های قدیمی‌تر یا کم‌توان‌تر دارای Android 9 یا جدیدتر ممکن است هنگام نمایش تبلیغات بنر درون‌خط در نماهای پیمایشی، عملکردی کمتر از حد مطلوب داشته باشند. توصیه می کنیم فقط از این نوع بنرها در اندروید 10 یا جدیدتر استفاده کنید. بنرهای موقعیت ثابت مانند بنرهای لنگردار تحت تأثیر قرار نمی گیرند و می توانند با عملکرد مطلوب در تمام سطوح API Android استفاده شوند.

مثال کامل در GitHub

نمونه کاملی از ادغام بنر پوشش داده شده در این صفحه را در banner_example ببینید.

با سایر انواع بنر آشنا شوید

با انواع دیگر بنرهای تعریف شده در این قسمت برای اپلیکیشن فلاتر خود آشنا شوید.

بنرهای تطبیقی ​​درون خطی

بنرهای تطبیقی ​​درون خطی دارای ارتفاع متغیر هستند و در مقایسه با بنرهای تطبیقی ​​لنگردار، بنرهای بزرگتر و بلندتری هستند. بنرهای تطبیقی ​​درون خطی برای برنامه‌هایی که آگهی‌های بنر را در محتوای قابل پیمایش قرار می‌دهند، بیش از بنرهای تطبیقی ​​لنگردار توصیه می‌شوند. برای جزئیات بیشتر، بنرهای تطبیقی ​​درون خطی را ببینید.

بنرهای جمع شونده

بنرهای جمع‌شونده، بنری‌هایی هستند که در ابتدا به صورت یک پوشش بزرگ‌تر ارائه می‌شوند و دکمه‌ای برای جمع کردن آگهی به اندازه کوچک‌تر وجود دارد. از این بنر برای بهینه سازی بیشتر عملکرد خود استفاده کنید. برای جزئیات بیشتر، بنرهای تاشو را ببینید.

،

تبلیغات بنری یک نقطه را در طرح‌بندی برنامه اشغال می‌کنند، چه در بالا یا پایین صفحه دستگاه. در حالی که کاربران در حال تعامل با برنامه هستند، روی صفحه می مانند و می توانند پس از مدت زمان مشخصی به طور خودکار بازخوانی شوند.

این راهنما شما را با تبلیغات بنری تطبیقی ​​لنگر شروع می کند. بنرهای تطبیقی ​​لنگر، اندازه آگهی را برای هر دستگاه با استفاده از عرض تبلیغی که شما مشخص می‌کنید، بهینه می‌کنند.

تبلیغات بنری تطبیقی ​​لنگر، تبلیغات با نسبت ابعاد ثابت هستند تا تبلیغات با اندازه ثابت . نسبت تصویر مشابه 320x50 است. هنگامی که عرض کامل موجود را مشخص کردید، Google Mobile Ads SDK تبلیغی را با ارتفاع بهینه برای آن عرض برمی‌گرداند. ارتفاع بهینه برای تبلیغ در درخواست‌های مختلف آگهی ثابت می‌ماند و محتوای اطراف آگهی در زمان تازه‌سازی آگهی در جای خود باقی می‌ماند.

همیشه با تبلیغات آزمایشی تست کنید

هنگام ساخت و آزمایش برنامه های خود، مطمئن شوید که از تبلیغات آزمایشی به جای تبلیغات زنده و تولیدی استفاده می کنید. عدم انجام این کار می تواند منجر به تعلیق حساب شما شود.

ساده ترین راه برای بارگیری تبلیغات آزمایشی استفاده از شناسه واحد آگهی آزمایشی اختصاصی ما برای بنرها است:

اندروید 

ca-app-pub-3940256099942544/9214589741

iOS

ca-app-pub-3940256099942544/2435281174

واحدهای آگهی آزمایشی به گونه‌ای پیکربندی شده‌اند که برای هر درخواستی، آگهی‌های آزمایشی را برگردانند، و شما می‌توانید هنگام کدنویسی، آزمایش و اشکال‌زدایی از آنها در برنامه‌های خود استفاده کنید. فقط مطمئن شوید که قبل از انتشار برنامه خود، آنها را با شناسه واحد تبلیغاتی خود جایگزین کنید.

اندازه آگهی را دریافت کنید

برای درخواست بنر تبلیغاتی با اندازه تبلیغات صحیح مراحل زیر را دنبال کنید:

  1. با استفاده از MediaQuery.of(context) عرض صفحه‌نمایش دستگاه را بر حسب پیکسل‌های مستقل از چگالی (dp) دریافت کنید. اگر نمی خواهید از عرض تمام صفحه استفاده کنید، می توانید عرض خود را تنظیم کنید.

  2. از روش استاتیک مناسب در کلاس AdSize برای بدست آوردن یک شی AdSize استفاده کنید. برای مثال، از AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(int width) برای دریافت اندازه تبلیغ برای جهت فعلی استفاده کنید. 

// Get an AnchoredAdaptiveBannerAdSize before loading the ad.
final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
    MediaQuery.sizeOf(context).width.truncate());

یک تبلیغ را بارگیری کنید

مثال زیر یک بنر تبلیغاتی را نشان می دهد: 

class BannerExampleState extends State<BannerExample>{
  BannerAd? _bannerAd;
  bool _isLoaded = false;

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/9214589741'
    : 'ca-app-pub-3940256099942544/2435281174';

  /// Loads a banner ad.
  void loadAd() async {
    // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
    final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
        MediaQuery.sizeOf(context).width.truncate());

    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: size,
      listener: BannerAdListener(
        // Called when an ad is successfully received.
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        // Called when an ad request failed.
        onAdFailedToLoad: (ad, err) {
          debugPrint('BannerAd failed to load: $error');
          // Dispose the ad here to free resources.
          ad.dispose();
        },
      ),
    )..load();
  }
}

از طریق استفاده از BannerAdListener ، می‌توانید به رویدادهای چرخه حیات گوش دهید، مانند زمانی که یک تبلیغ بارگیری می‌شود. این مثال هر روش را پیاده سازی می کند و یک پیام را به کنسول ثبت می کند: 

class BannerExampleState extends State<BannerExample> {
  BannerAd? _bannerAd;
  bool _isLoaded = false;

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/9214589741'
    : 'ca-app-pub-3940256099942544/2435281174';


  /// Loads a banner ad.
  void loadAd() async {
    // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
    final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
        MediaQuery.sizeOf(context).width.truncate());

    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: size,
      listener: BannerAdListener(
        // Called when an ad is successfully received.
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        // Called when an ad request failed.
        onAdFailedToLoad: (ad, err) {
          debugPrint('BannerAd failed to load: $error');
          // Dispose the ad here to free resources.
          ad.dispose();
        },
        // Called when an ad opens an overlay that covers the screen.
        onAdOpened: (Ad ad) {},
        // Called when an ad removes an overlay that covers the screen.
        onAdClosed: (Ad ad) {},
        // Called when an impression occurs on the ad.
        onAdImpression: (Ad ad) {},
      ),
    )..load();
  }
}

یک آگهی را تازه کنید

اگر واحد تبلیغات خود را برای بازخوانی پیکربندی کرده‌اید، نیازی به درخواست آگهی دیگری در صورت عدم بارگیری آگهی ندارید. Google Mobile Ads SDK به نرخ تازه‌سازی که در رابط کاربری AdMob مشخص کرده‌اید احترام می‌گذارد. اگر بازخوانی را فعال نکرده‌اید، درخواست جدیدی صادر کنید. برای جزئیات بیشتر در مورد بازخوانی واحد تبلیغات، مانند تنظیم نرخ تجدید، به استفاده از بازخوانی خودکار برای تبلیغات بنر مراجعه کنید.

نمایش یک بنر تبلیغاتی

برای نمایش BannerAd به عنوان ویجت، باید یک AdWidget را با یک تبلیغ پشتیبانی شده پس از فراخوانی load() نمونه سازی کنید. شما می توانید قبل از فراخوانی load() ویجت را ایجاد کنید، اما load() باید قبل از افزودن آن به درخت ویجت فراخوانی شود.

AdWidget از کلاس Flutter's Widget به ارث می رسد و می تواند مانند هر ویجت دیگری استفاده شود. در iOS، مطمئن شوید که ویجت را در یک ویجت با عرض و ارتفاع مشخص قرار داده اید. در غیر این صورت ممکن است تبلیغ شما نمایش داده نشود. یک BannerAd می توان در ظرفی با اندازه ای قرار داد که با آگهی مطابقت دارد:

if (_bannerAd != null) {
  Align(
    alignment: Alignment.bottomCenter,
    child: SafeArea(
      child: SizedBox(
        width: _bannerAd!.size.width.toDouble(),
        height: _bannerAd!.size.height.toDouble(),
        child: AdWidget(ad: _bannerAd!),
      ),
    ),
  )
}

یک آگهی زمانی که دیگر نیازی به دسترسی به آن نیست باید حذف شود. بهترین روش برای زمان فراخوانی dispose() پس از حذف AdWidget از درخت ویجت یا در BannerAdListener.onAdFailedToLoad() است.

همین! اکنون برنامه شما برای نمایش تبلیغات بنری آماده است.

محدودیت پیمایش در اندروید 9 و پایین تر

می‌دانیم که برخی از دستگاه‌های قدیمی‌تر یا کم‌توان‌تر دارای Android 9 یا جدیدتر ممکن است هنگام نمایش تبلیغات بنر درون‌خط در نماهای پیمایشی، عملکردی کمتر از حد مطلوب داشته باشند. توصیه می کنیم فقط از این نوع بنرها در اندروید 10 یا جدیدتر استفاده کنید. بنرهای موقعیت ثابت مانند بنرهای لنگردار تحت تأثیر قرار نمی گیرند و می توانند با عملکرد مطلوب در تمام سطوح API Android استفاده شوند.

مثال کامل در GitHub

نمونه کاملی از ادغام بنر پوشش داده شده در این صفحه را در banner_example ببینید.

با سایر انواع بنر آشنا شوید

با انواع دیگر بنرهای تعریف شده در این قسمت برای اپلیکیشن فلاتر خود آشنا شوید.

بنرهای تطبیقی ​​درون خطی

بنرهای تطبیقی ​​درون خطی دارای ارتفاع متغیر هستند و در مقایسه با بنرهای تطبیقی ​​لنگردار، بنرهای بزرگتر و بلندتری هستند. بنرهای تطبیقی ​​درون خطی برای برنامه‌هایی که آگهی‌های بنر را در محتوای قابل پیمایش قرار می‌دهند، بیش از بنرهای تطبیقی ​​لنگردار توصیه می‌شوند. برای جزئیات بیشتر، بنرهای تطبیقی ​​درون خطی را ببینید.

بنرهای جمع شونده

بنرهای جمع‌شونده، بنری‌هایی هستند که در ابتدا به صورت یک پوشش بزرگ‌تر ارائه می‌شوند و دکمه‌ای برای جمع کردن آگهی به اندازه کوچک‌تر وجود دارد. از این بنر برای بهینه سازی بیشتر عملکرد خود استفاده کنید. برای جزئیات بیشتر، بنرهای تاشو را ببینید.