Реклама с вознаграждением
Реклама с вознаграждением (Rewarded) — это полноэкранный рекламный формат, за просмотр которого пользователь получает бонус или награду (например: внутриигровые монеты, доступ к премиум-функциям, повтор попытки и т. д.).
Примечание
Пользователь принимает решение самостоятельно — смотреть рекламу или нет, а награду получает только в случае полного просмотра.
|
Сущность |
Описание |
|
|
При получении ошибки в |
|
|
Используйте:
|
Пример создания рекламы с вознаграждением
import React, { useState } from 'react';
import { Alert, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import { AdRequestConfiguration, RewardedAd, RewardedAdLoader } from 'yandex-mobile-ads';
const REWARDED_AD_UNIT_ID = 'demo-rewarded-yandex'; // Замените на ваш ID
const REWARD = {
amount: 50,
type: 'coins',
}
export default function RewardedView() {
const [isLoaded, setIsLoaded] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [rewardedAd, setRewardedAd] = useState<RewardedAd | null>(null);
const loadAd = async () => {
try {
setIsLoading(true);
// 1. Создаем loader
const loader = await RewardedAdLoader.create();
// 2. Создаем конфигурацию запроса
const adRequestConfiguration = new AdRequestConfiguration({
adUnitId: REWARDED_AD_UNIT_ID,
});
// 3. Загружаем рекламу
const ad = await loader.loadAd(adRequestConfiguration);
console.log('Rewarded ad loaded');
// 4. Настраиваем обработчики событий
ad.onAdShown = () => {
console.log('Rewarded ad shown');
};
ad.onAdDismissed = () => {
console.log('Rewarded ad dismissed');
setIsLoaded(false);
setRewardedAd(null);
};
ad.onAdClicked = () => {
console.log('Rewarded ad clicked');
};
ad.onAdImpression = (impressionData) => {
console.log('Rewarded impression:', impressionData);
};
ad.onAdFailedToShow = (error) => {
console.error('Rewarded failed to show:', error);
Alert.alert('Ad Failed to Show', JSON.stringify(error));
setIsLoaded(false);
};
ad.onRewarded = () => {
Alert.alert('🎉 Reward!', `You earned ${REWARD.amount} ${REWARD.type}`);
console.log('User rewarded:', REWARD);
};
setRewardedAd(ad);
setIsLoaded(true);
setIsLoading(false);
} catch (error) {
console.error('Failed to load rewarded ad:', error);
Alert.alert('Ad Failed to Load', JSON.stringify(error));
setIsLoading(false);
setIsLoaded(false);
}
};
const showAd = () => {
if (rewardedAd && isLoaded) {
rewardedAd.show();
} else {
Alert.alert('Ad not ready', 'Please load the ad first');
}
};
return (
<View style={styles.container}>
<Text style={styles.title}>Rewarded Ad</Text>
<TouchableOpacity
style={[styles.button, isLoading && styles.buttonDisabled]}
onPress={loadAd}
disabled={isLoading}
>
<Text style={styles.buttonText}>
{isLoading ? 'Loading...' : 'Load Ad'}
</Text>
</TouchableOpacity>
<TouchableOpacity
style={[styles.button, styles.showButton, !isLoaded && styles.buttonDisabled]}
onPress={showAd}
disabled={!isLoaded}
>
<Text style={styles.buttonText}>Show Ad & Get Reward</Text>
</TouchableOpacity>
<Text style={styles.status}>
{isLoaded ? '✅ Ad Ready' : '❌ Ad Not Loaded'}
</Text>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#f5f5f5',
padding: 20,
},
title: {
fontSize: 24,
fontWeight: 'bold',
marginBottom: 40,
},
button: {
backgroundColor: '#007AFF',
paddingVertical: 15,
paddingHorizontal: 40,
borderRadius: 10,
marginVertical: 10,
width: '80%',
alignItems: 'center',
},
showButton: {
backgroundColor: '#34C759',
},
buttonDisabled: {
backgroundColor: '#ccc',
},
buttonText: {
color: '#fff',
fontSize: 18,
fontWeight: '600',
},
status: {
marginTop: 30,
fontSize: 16,
color: '#666',
},
});
Проверка интеграции
Проверить работу рекламных форматов можно на нашем демо-проекте.