Określanie stylów natywnych

Wybierz platformę: Android iOS Flutter Android (starsza wersja)

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ł skonfigurowany 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 się dynamicznie dostosowywać do treści reklamy. W takim przypadku 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. Dostosuje on swoją wysokość do wysokości widoku 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.