Określanie stylów natywnych

Wybierz platformę: Android Nowy Android iOS Flutter

Ustawienia stylu natywnego umożliwiają usłudze Google Ad Manager renderowanie reklam natywnych na podstawie stylów natywnych określonych w danej usłudze. Najpierw określ rozmiar i kierowanie. Następnie dodaj kod HTML, CSS i JavaScript, aby zdefiniować reklamy elastyczne, które będą się wyświetlać w wysokiej jakości na wszystkich ekranach. Nie musisz niczego renderować. Ad Manager automatycznie zastosuje odpowiedni styl natywny w miejscu docelowym. Style natywne są implementowane tak samo jak banery reklamowe, przy użyciu elementu AdManagerAdView. Można ich używać ze stałym rozmiarem reklamy określonym z wyprzedzeniem lub z elastycznym rozmiarem reklamy określonym w czasie działania.

Wymagania wstępne

  • Google Mobile Ads Flutter Plugin w wersji 0.13.6 lub nowszej

W tym przewodniku przyjęto założenie, że masz podstawową wiedzę na temat Google Mobile Ads Flutter Plugin. Jeśli jeszcze tego nie zrobisz, zapoznaj się z naszym przewodnikiem dla początkujących.

Stały rozmiar

Style natywne o stałym rozmiarze umożliwiają kontrolowanie szerokości i wysokości reklamy natywnej. Aby ustawić stały rozmiar:

  1. Utwórz element zamówienia w interfejsie Ad Managera i wybierz jeden z predefiniowanych rozmiarów w menu pola Size.

  2. Wczytaj element AdManagerBannerAd o tym samym rozmiarze, który został ustawiony w kroku 1. Informacje o tym, jak utworzyć instancję reklamy i ją wczytać, znajdziesz w dokumentacji banerów reklamowych. Listę rozmiarów i odpowiadających im AdSize stałych znajdziesz w sekcji Rozmiar banera.

Oto przykład określania stałego rozmiaru, np. rozmiaru reklamy MEDIUM_RECTANGLE (300 x 250):

AdManagerBannerAd ad = AdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  sizes: <AdSize>[AdSize.mediumRectangle],
  request: AdManagerAdRequest(),
);

Rozmiar elastyczny

W niektórych przypadkach stały rozmiar może nie być odpowiedni. Może na przykład chcesz, aby szerokość reklamy była dopasowana do treści aplikacji, ale jej wysokość powinna być dynamicznie dostosowywana do treści reklamy. Aby to zrobić, możesz określić Fluid jako rozmiar reklamy w interfejsie Ad Managera. Oznacza to, że rozmiar reklamy jest określany w czasie działania w aplikacji. Pakiet SDK udostępnia specjalną stałą AdSize – FLUID – która obsługuje takie zastosowania. Wysokość reklamy o rozmiarze elastycznym jest określana dynamicznie na podstawie szerokości zdefiniowanej przez wydawcę, co pozwala dostosować wysokość widoku reklamy na platformie do wysokości kreacji.

Żądanie elastyczne

Aby poprosić o reklamę elastyczną, użyj elementu FluidAdManagerBannerAd:

final fluidAd = FluidAdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  request: AdManagerAdRequest(),
  listener: AdManagerBannerAdListener(
    onAdLoaded: (Ad ad) {
      print('$_fluidAd loaded.');
    },
    onAdFailedToLoad: (Ad ad, LoadAdError error) {
      print('$_fluidAd failedToLoad: $error');
      ad.dispose();
    },
  ),

Wyświetlanie reklamy elastycznej

Po wczytaniu reklamy użyj elementu FluidAdWidget, aby wyświetlać reklamy elastyczne. Dopasuje on swoją wysokość do wysokości wyświetlenia reklamy na platformie:

FluidAdWidget(
  width: <your-width>,
  ad: fluidAd,
);

Przykład implementacji elastycznego rozmiaru reklamy w Ad Managerze znajdziesz w przykładowej aplikacji w GitHubie.