React Native 팝업 광고
팝업 지면은 전면광고와 유사하게 앱을 완전히 덮으면서 노출됩니다. 팝업 지면은 위치에 따라 하단, 중앙 두가지 타입의 UI를 제공하고 있어 원하는 기획에 맞게 선택하여 연동할 수 있습니다.

콘솔에서 광고 유닛 등록하기
Adrop 콘솔에서 팝업 광고 유닛을 생성합니다.
광고 유닛 리스트에서 생성된 유닛 아이디를 복사합니다.
1단계: 팝업 광고 노출하기
Ad type
Ad unit ID
Popup (bottom)
PUBLIC_TEST_UNIT_ID_POPUP_BOTTOM
Popup (center)
PUBLIC_TEST_UNIT_ID_POPUP_CENTER
Pass AdropPopupAdColors parameter to customize colors
// (Optional) Construct event listener
const listener: AdropListener = {
onAdReceived: (ad: AdropPopupAd) =>
console.log(`Adrop popup Ad load with unitId ${ad.unitId}!`),
onAdFailedToReceive: (ad: AdropPopupAd, errorCode: string) =>
console.log(`error in ${ad.unitId} while load: ${errorCode}`),
onAdFailedToShowFullScreen: (ad: AdropPopupAd, errorCode: string) =>
console.log(`error in ${ad.unitId} while showing: ${errorCode}`),
...
}
const YourComponent: React.FC = () => {
const [popupAd, setPopupAd] = useState<AdropPopupAd>(null)
useEffect(() => {
let closeTextColor = your_color // option hex or rgba
let hideForTodayTextColor = '#123' // option hex or rgba
let backgroundColor: string = 'rgba(1,2,3,1)' // option hex or rgba
let colors: AdropPopupAdColors = {
closeTextColor, hideForTodayTextColor, backgroundColor
}
let adropPopupAd = new AdropPopupAd('YOUR_UNIT_ID', colors)
adropPopupAd.listener = listener
adropPopupAd.load()
setPopupAd(adropPopupAd)
}, []);
const show = () => {
if (popupAd?.isLoaded) {
popupAd?.show()
} else {
console.log('popupAd ad is loading...')
}
}
return (
<View>
<Button title="display ad" onPress={show}/>
</View>
)
}
팝업 광고 Destroy
AdropRewardedView에 더 이상 액세스할 필요가 없으면 다음과 같이 Dispose해야 합니다.
popupAd.destroy()
console에서 발급받은 unitId가 한 번이라도 request 가 들어가면 성공적으로 연결됩니다.

Last updated