Banner 및 MREC ads는 앱 레이아웃의 일부(주로 화면 상단이나 하단, 또는 스크롤 가능한 콘텐츠 내부)를 차지하는 직사각형 광고 포맷입니다. 사용자가 앱과 상호작용하는 동안에도 계속 표시되므로 게임 플레이나 앱 사용을 방해하지 않으며, 설정된 시간 후에 자동으로 새로고침될 수 있습니다.
다음 섹션에서는 Banner 또는 MREC ad를 로드, 표시 및 숨기는 방법을 설명합니다.
AppLovin 블로그의 “Why mobile banners ads persist in a video and playable world”를 참고하세요.
Banner 또는 MREC를 로드하려면 ad unit에 해당하는 MaxAdView 객체를 생성합니다.
그런 다음 해당 객체의 loadAd() 메서드를 호출합니다.
광고를 표시하려면 MaxAdView 객체를 뷰 계층 구조의 서브뷰로 추가합니다.
광고가 준비되었을 때 알림을 받을 수 있도록 MaxAdViewAdListener를 구현합니다 (기타 광고 관련 이벤트에 대해서도 알림을 받게 됩니다).
콘텐츠 피드 내에 MREC ads를 표시해야 하는 연동의 경우, AppLovin은 다음을 권장합니다.
loadAd()를 호출하여 콘텐츠를 수동으로 새로고침합니다 (MaxAdView 인스턴스를 재사용합니다).AppLovin 데모 앱(Java, Kotlin)에서 구현 예시를 확인할 수 있습니다.
public class ExampleActivity extends Activity
implements MaxAdViewAdListener
{
private MaxAdView adView;
void createBannerAd()
{
adView = new MaxAdView( "«ad-unit-ID»", this );
adView.setListener( this );
// Stretch to the width of the screen for banners to be fully functional
int width = ViewGroup.LayoutParams.MATCH_PARENT;
// Banner height on phones and tablets is 50 and 90, respectively
int heightPx = getResources().getDimensionPixelSize( R.dimen.banner_height );
adView.setLayoutParams( new FrameLayout.LayoutParams( width, heightPx ) );
// Set background color for banners to be fully functional
adView.setBackgroundColor( «background-color» );
ViewGroup rootView = findViewById( android.R.id.content );
rootView.addView( adView );
// Load the ad
adView.loadAd();
}
// MAX Ad Listener
@Override
public void onAdLoaded(final MaxAd maxAd) {}
@Override
public void onAdLoadFailed(final String adUnitId, final MaxError error) {}
@Override
public void onAdDisplayFailed(final MaxAd maxAd, final MaxError error) {}
@Override
public void onAdClicked(final MaxAd maxAd) {}
@Override
public void onAdExpanded(final MaxAd maxAd) {}
@Override
public void onAdCollapsed(final MaxAd maxAd) {}
@Override
public void onAdDisplayed(final MaxAd maxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
@Override
public void onAdHidden(final MaxAd maxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
}
class ExampleActivity : Activity(), MaxAdViewAdListener
{
private var adView: MaxAdView? = null
fun createBannerAd()
{
adView = MaxAdView("«ad-unit-ID»", this)
adView?.setListener(this)
// Stretch to the width of the screen for banners to be fully functional
val widthPx = ViewGroup.LayoutParams.MATCH_PARENT
// Banner height on phones and tablets is 50 and 90, respectively
val heightPx = resources.getDimensionPixelSize(R.dimen.banner_height)
adView?.layoutParams = FrameLayout.LayoutParams(widthPx, heightPx)
// Set background color for banners to be fully functional
adView?.setBackgroundColor(«background-color»)
val rootView = findViewById(android.R.id.content)
rootView.addView(adView)
// Load the ad
adView?.loadAd()
}
// MAX Ad Listener
override fun onAdLoaded(maxAd: MaxAd) {}
override fun onAdLoadFailed(adUnitId: String?, error: MaxError?) {}
override fun onAdDisplayFailed(ad: MaxAd?, error: MaxError?) {}
override fun onAdClicked(maxAd: MaxAd) {}
override fun onAdExpanded(maxAd: MaxAd) {}
override fun onAdCollapsed(maxAd: MaxAd) {}
override fun onAdDisplayed(maxAd: MaxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
override fun onAdHidden(maxAd: MaxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
}
public class ExampleActivity extends Activity
implements MaxAdViewAdListener
{
private MaxAdView adView;
void createMRecAd()
{
adView = new MaxAdView( "«ad-unit-ID»", MaxAdFormat.MREC, this );
adView.setListener( this );
// MREC width and height are 300 and 250 respectively, on phones and tablets
int widthPx = AppLovinSdkUtils.dpToPx( this, 300 );
int heightPx = AppLovinSdkUtils.dpToPx( this, 250 );
adView.setLayoutParams( new FrameLayout.LayoutParams( widthPx, heightPx ) );
// Set background color for MRECs to be fully functional
adView.setBackgroundColor( «background-color» );
ViewGroup rootView = findViewById( android.R.id.content );
rootView.addView( adView );
// Load the ad
adView.loadAd();
}
// MAX Ad Listener
@Override
public void onAdLoaded(final MaxAd maxAd) {}
@Override
public void onAdLoadFailed(final String adUnitId, final MaxError error) {}
@Override
public void onAdDisplayFailed(final MaxAd maxAd, final MaxError error) {}
@Override
public void onAdClicked(final MaxAd maxAd) {}
@Override
public void onAdExpanded(final MaxAd maxAd) {}
@Override
public void onAdCollapsed(final MaxAd maxAd) {}
@Override
public void onAdDisplayed(final MaxAd maxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
@Override
public void onAdHidden(final MaxAd maxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
}
class ExampleActivity : Activity(), MaxAdViewAdListener
{
private var adView: MaxAdView? = null
fun createMRecAd()
{
adView = MaxAdView("«ad-unit-ID»", MaxAdFormat.MREC, this)
adView?.setListener(this)
// MREC width and height are 300 and 250 respectively, on phones and tablets
val widthPx = AppLovinSdkUtils.dpToPx(this, 300)
val heightPx = AppLovinSdkUtils.dpToPx(this, 250)
adView?.layoutParams = FrameLayout.LayoutParams(widthPx, heightPx)
// Set background color for MRECs to be fully functional
adView?.setBackgroundColor(«background-color»)
val rootView = findViewById(android.R.id.content)
rootView.addView(adView)
// Load the ad
adView?.loadAd()
}
// MAX Ad Listener
override fun onAdLoaded(maxAd: MaxAd) {}
override fun onAdLoadFailed(adUnitId: String?, error: MaxError?) {}
override fun onAdDisplayFailed(ad: MaxAd?, error: MaxError?) {}
override fun onAdClicked(maxAd: MaxAd) {}
override fun onAdExpanded(maxAd: MaxAd) {}
override fun onAdCollapsed(maxAd: MaxAd) {}
override fun onAdDisplayed(maxAd: MaxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
override fun onAdHidden(maxAd: MaxAd) { /* DO NOT USE - THIS IS RESERVED FOR FULLSCREEN ADS ONLY AND WILL BE REMOVED IN A FUTURE SDK RELEASE */ }
}
뷰 레이아웃 XML에 MAX Banners 또는 MRECs를 추가할 수도 있습니다.
배경 또는 배경색(android:background)을 설정하여 광고가 정상적으로 작동하도록 하십시오.
Banners의 경우, 너비(android:layout_width)를 화면 너비에 맞게 늘립니다.
MRECs의 경우, 다음과 같이 android:adFormat을 설정합니다:
<com.applovin.mediation.ads.MaxAdView
xmlns:maxads="http://schemas.applovin.com/android/1.0"
maxads:adUnitId="«ad-unit-ID»"
android:background="@color/banner_background_color"
android:layout_width="match_parent"
android:layout_height="@dimen/banner_height" />
res/values/attrs.xml에 기본 Banner 높이인 50 dp를 선언합니다:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="banner_height">50dp</dimen>
</resources>
res/values-sw600dp/attrs.xml에 태블릿 Banner 높이인 90 dp를 선언합니다:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="banner_height">90dp</dimen>
</resources>
<com.applovin.mediation.ads.MaxAdView
xmlns:maxads="http://schemas.applovin.com/android/1.0"
maxads:adUnitId="«ad-unit-ID»"
maxads:adFormat="MREC"
android:background="@color/mrec_background_color"
android:layout_width="300dp"
android:layout_height="250dp" />
이러한 방식으로 생성한 MaxAdView에서도 여전히 loadAd()를 호출해야 합니다:
MaxAdView adView = findViewById( R.id.ad_view );
adView.loadAd();
var adView: MaxAdView = findViewById(R.id.id.ad_view)
adView.loadAd()
더 이상 MaxAdView 인스턴스가 필요하지 않은 경우, destroy() 메서드를 호출하여 리소스를 해제합니다.
예를 들어 사용자가 광고 제거 아이템을 구매한 경우가 이에 해당할 수 있습니다.
동일한 Ad Unit ID로 여러 인스턴스를 사용하는 경우에는 destroy() 메서드를 호출하지 마십시오.
adView.destroy();
adView.destroy()
Google bidding 및 Google AdMob, Google Ad Manager, Liftoff Monetize, Pangle, Yandex는 Adaptive banners를 지원합니다. MAX는 다른 네트워크의 Banners 크기를 비적응형(non-adaptive) 방식으로 조정합니다.
Google은 개발자가 Banner 배치 영역과 앱 콘텐츠 사이에 50 px의 패딩을 포함할 것을 권장합니다. 이렇게 하면 사용자가 실수로 Banner를 클릭할 가능성이 줄어듭니다. 자세한 정보 및 권장 사항은 Google의 “확인된 클릭 정보” 정책을 참조하십시오.
Adaptive banners는 기기 유형 및 사용 가능한 너비에 따라 크기를 동적으로 조정하는 반응형 광고입니다. Adaptive banners는 anchored 또는 inline 형태일 수 있으며, 각 유형은 특정 연동 요구 사항을 충족합니다.
MAX SDK 버전 13.2.0부터는 빌드 타임에 adaptive 유형을 설정한 MaxAdViewConfiguration 객체로 MaxAdView를 초기화하여 Adaptive banners를 연동할 수 있습니다.
다음 어댑터들은 특별한 Adaptive banner 기능을 지원합니다:
| 네트워크 | 어댑터 버전 | 특별 기능 |
|---|---|---|
| Google Ad Manager | 23.2.0.1+ | Inline adaptive banners |
| 23.6.0.3+ | Inline adaptive MRECs | |
| 21.5.0.2+ | 사용자 지정 너비 설정 | |
| Google Bidding 및 Google AdMob | 23.2.0.1+ | Inline adaptive banners |
| 23.6.0.3+ | Inline adaptive MRECs | |
| 21.5.0.3+ | 사용자 지정 너비 설정 | |
| Liftoff Monetize | 7.4.3.2+ | |
| Pangle | 7.1.0.4.0+ | |
| Yandex | 7.12.2.1+ |
Anchored adaptive banners는 화면 상단 또는 하단에 고정하는 배너입니다. 기기 유형 및 Banner 너비에 따라 높이를 동적으로 조정합니다.
MaxAdView의 높이를 50 또는 90과 같은 고정 값 대신 MaxAdFormat.BANNER.getAdaptiveSize( Context ).getHeight()가 반환하는 값으로 설정해야 합니다.
void createAnchoredAdaptiveBannerAd()
{
// Stretch to the width of the screen for banners to be fully functional
int widthPx = ViewGroup.LayoutParams.MATCH_PARENT;
// Get the anchored adaptive banner height
int heightDp = MaxAdFormat.BANNER.getAdaptiveSize( this ).getHeight();
int heightPx = AppLovinSdkUtils.dpToPx( this, heightDp );
MaxAdViewConfiguration config = MaxAdViewConfiguration.builder()
.setAdaptiveType( MaxAdViewConfiguration.AdaptiveType.ANCHORED )
.build();
adView = new MaxAdView( "«ad-unit-ID»", config );
adView.setListener( this );
adView.setLayoutParams( new FrameLayout.LayoutParams( widthPx, heightPx ) );
// Set background color for banners to be fully functional
adView.setBackgroundColor( «background-color» );
ViewGroup rootView = findViewById( android.R.id.content );
rootView.addView( adView );
// Load the ad
adView.loadAd();
}
fun createAnchoredAdaptiveBannerAd()
{
// Stretch to the width of the screen for banners to be fully functional
val widthPx = ViewGroup.LayoutParams.MATCH_PARENT
// Get the anchored adaptive banner height
val heightDp = MaxAdFormat.BANNER.getAdaptiveSize(this).height
val heightPx = AppLovinSdkUtils.dpToPx(this, heightDp)
val config = MaxAdViewConfiguration.builder()
.setAdaptiveType( MaxAdViewConfiguration.AdaptiveType.ANCHORED )
.build();
adView = MaxAdView("«ad-unit-ID»", config)
adView?.setListener(this)
adView?.layoutParams = FrameLayout.LayoutParams(widthPx, heightPx)
// Set background color for banners to be fully functional
adView?.setBackgroundColor(«background-color»)
val rootView = findViewById<ViewGroup>(android.R.id.content)
rootView.addView(adView)
// Load the ad
adView?.loadAd()
}
더 구체적인 연동을 위해 MaxAdViewConfiguration 빌더 메서드를 호출하여 dp 단위로 사용자 지정 너비를 구성할 수 있습니다.
사용자 지정 anchored adaptive 광고에 적합한 높이를 가져오려면 adaptive size API를 호출합니다.
int widthDp = 400;
// Get the anchored adaptive banner height
int heightDp = MaxAdFormat.BANNER.getAdaptiveSize( widthDp, context ).getHeight();
MaxAdViewConfiguration config = MaxAdViewConfiguration.builder()
.setAdaptiveType( MaxAdViewConfiguration.AdaptiveType.ANCHORED )
.setAdaptiveWidth( widthDp )
.build();
adView = new MaxAdView( "«ad-unit-ID»", config );
val widthDp = 400
// Get the anchored adaptive banner height
val heightDp = adView.adFormat.getAdaptiveSize(widthDp, context).height
val config = MaxAdViewConfiguration.builder()
.setAdaptiveType(MaxAdViewConfiguration.AdaptiveType.ANCHORED)
.setAdaptiveWidth(widthDp)
.build()
adView = MaxAdView("«ad-unit-ID»", config)
Adaptive banners는 기본적으로 고정(anchored)되어 있습니다. 스크롤 가능한 콘텐츠에 배치할 수 있는 Inline adaptive banners를 활성화할 수도 있습니다. Inline adaptive banners는 일반적으로 anchored adaptive banners보다 큽니다. 기기 화면의 전체 높이까지 확장될 수 있는 가변적인 높이를 가집니다.
Inline adaptive banners를 활성화하려면 아래 코드와 같이 MaxAdViewConfiguration adaptive 유형을 MaxAdViewConfiguration.AdaptiveType.INLINE으로 설정합니다:
MaxAdViewConfiguration config = MaxAdViewConfiguration.builder()
.setAdaptiveType( MaxAdViewConfiguration.AdaptiveType.INLINE )
⋮
.build();
val config = MaxAdViewConfiguration.builder()
.setAdaptiveType(MaxAdViewConfiguration.AdaptiveType.INLINE)
⋮
.build()
Inline adaptive 광고의 기본 최대 높이는 기기 화면의 전체 높이입니다.
광고가 MaxAdView 높이에 맞게 표시되도록 inline adaptive 광고의 최대 높이(dp 단위)를 설정할 수 있습니다.
최대 높이를 100 dp로 설정하는 예시는 다음과 같습니다:
MaxAdViewConfiguration config = MaxAdViewConfiguration.builder()
.setAdaptiveType( MaxAdViewConfiguration.AdaptiveType.INLINE )
.setInlineMaximumHeight( 100 )
⋮
.build();
val config = MaxAdViewConfiguration.builder()
.setAdaptiveType(MaxAdViewConfiguration.AdaptiveType.INLINE)
.setInlineMaximumHeight( 100 )
⋮
.build()
Inline adaptive MRECs는 기본적으로 애플리케이션 창의 전체 너비를 차지하지만, 선택적으로 dp 단위의 사용자 지정 너비를 지정할 수 있습니다. 높이는 가변적이며, 최대 높이를 지정하지 않으면 표준 MREC 크기를 초과하여 기기 화면의 전체 높이까지 확장될 수 있습니다.
다음 예시와 같이 adaptive 유형을 MaxAdViewConfiguration.AdaptiveType.INLINE으로 설정하여 inline adaptive MREC를 구성합니다:
void createInlineAdaptiveMRecAd()
{
// Set a custom width, in dp, for the inline adaptive MREC. Otherwise stretch to screen width by using ViewGroup.LayoutParams.MATCH_PARENT
int widthDp = 400;
int widthPx = AppLovinSdkUtils.dpToPx( this, widthDp );
// Set a maximum height, in dp, for the inline adaptive MREC. Otherwise use standard MREC height of 250 dp
// Google recommends a height greater than 50 dp, with a minimum of 32 dp and a maximum equal to the screen height
// The value must also not exceed the height of the MaxAdView
int heightDp = 300;
int heightPx = AppLovinSdkUtils.dpToPx( this, heightDp );
MaxAdViewConfiguration config = MaxAdViewConfiguration.builder()
.setAdaptiveType( MaxAdViewConfiguration.AdaptiveType.INLINE )
.setAdaptiveWidth( widthDp ) // Optional: The adaptive ad spans the width of the application window if you do not set a value
.setInlineMaximumHeight( heightDp ) // Optional: The maximum height is the screen height if you do not set a value
.build();
adView = new MaxAdView( "«ad-unit-ID»", MaxAdFormat.MREC, config );
adView.setListener( this );
adView.setLayoutParams( new FrameLayout.LayoutParams( widthPx, heightPx ) );
// Set background color for adaptive MRECs to be fully functional
adView.setBackgroundColor( «background-color» );
ViewGroup rootView = findViewById( android.R.id.content );
rootView.addView( adView );
// Load the ad
adView.loadAd();
}
fun createInlineAdaptiveMRecAd()
{
// Set a custom width, in dp, for the inline adaptive MREC. Otherwise stretch to screen width by using ViewGroup.LayoutParams.MATCH_PARENT
val widthDp = 400
val widthPx = AppLovinSdkUtils.dpToPx(this, widthDp)
// Set a maximum height, in dp, for the inline adaptive MREC. Otherwise use standard MREC height of 250 dp
// Google recommends a height greater than 50 dp, with a minimum of 32 dp and a maximum equal to the screen height
// The value must also not exceed the height of the MaxAdView
val heightDp = 300
val heightPx = AppLovinSdkUtils.dpToPx( this, heightDp )
val config = MaxAdViewConfiguration.builder()
.setAdaptiveType(MaxAdViewConfiguration.AdaptiveType.INLINE)
.setAdaptiveWidth(widthDp) // Optional: The adaptive ad spans the width of the application window if a value is not specified
.setInlineMaximumHeight(heightDp) // Optional: The maximum height is the screen height if a value is not specified
.build()
adView = MaxAdView("«ad-unit-ID»", MaxAdFormat.MREC, config)
adView?.setListener(this)
adView?.layoutParams = FrameLayout.LayoutParams(widthPx, heightPx)
// Set background color for adaptive MRECs to be fully functional
adView?.setBackgroundColor(«background-color»)
val rootView = findViewById(android.R.id.content)
rootView.addView(adView)
// Load the ad
adView?.loadAd()
}
로드된 adaptive 광고는 요청한 크기보다 작을 수 있습니다. 제공되는 adaptive 광고의 크기에 맞게 UI를 조정하도록 구성할 수 있습니다. 이 경우, 다음과 같은 코드를 사용하여 로드된 광고의 너비와 높이(dp 단위)를 가져올 수 있습니다:
@Override
public void onAdLoaded(final MaxAd maxAd)
{
AppLovinSdkUtils.Size adViewSize = maxAd.getSize();
int widthDp = adViewSize.getWidth();
int heightDp = adViewSize.getHeight();
⋮
}
override fun onAdLoaded(ad: MaxAd?)
{
val adViewSize = ad?.size!!
val widthDp = adViewSize.width
val heightDp = adViewSize.height
⋮
}
광고의 자동 새로고침을 중지하고 싶을 수 있습니다. 광고를 숨기거나 수동으로 새로고침하려는 경우가 이에 해당합니다. 다음 코드를 사용하여 자동 새로고침을 중지합니다:
// Set this extra parameter to work around SDK bug that ignores calls to stopAutoRefresh()
adView.setExtraParameter( "allow_pause_auto_refresh_immediately", "true" );
adView.stopAutoRefresh();
// Set this extra parameter to work around SDK bug that ignores calls to stopAutoRefresh()
adView.setExtraParameter( "allow_pause_auto_refresh_immediately", "true" )
adView.stopAutoRefresh()
다음 코드를 사용하여 광고의 자동 새로고침을 시작합니다:
adView.startAutoRefresh();
adView.startAutoRefresh()
loadAd()를 호출하여 광고 콘텐츠를 수동으로 새로고침합니다.
이 작업은 먼저 자동 새로고침을 중지한 경우에만 수행할 수 있습니다.
adView.loadAd();
adView.loadAd()