Customize Consent Preferences

We use cookies to help you navigate efficiently and perform certain functions. You will find detailed information about all cookies under each consent category below.

The cookies that are categorized as "Necessary" are stored on your browser as they are essential for enabling the basic functionalities of the site. ... 

Always Active

Necessary cookies are required to enable the basic features of this site, such as providing secure log-in or adjusting your consent preferences. These cookies do not store any personally identifiable data.

No cookies to display.

Functional cookies help perform certain functionalities like sharing the content of the website on social media platforms, collecting feedback, and other third-party features.

No cookies to display.

Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics such as the number of visitors, bounce rate, traffic source, etc.

No cookies to display.

Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.

No cookies to display.

Advertisement cookies are used to provide visitors with customized advertisements based on the pages you visited previously and to analyze the effectiveness of the ad campaigns.

No cookies to display.

Añadir Google Admob ads a React Native y expo 47

Tiempo de lectura: 7 minutos

Hoy os voy a enseñar cómo añadir Google Admob Ads a la última versión de Expo y React Native disponible en febrero de 2023.

Utilizaremos esta librería (https://docs.page/invertase/react-native-google-mobile-ads):

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
expo install react-native-google-mobile-ads
expo install react-native-google-mobile-ads
expo install react-native-google-mobile-ads

Opcional: Si usas ios y quieres implementar Static Frameworks añade esto a app.json e instala el plugin:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
expo install expo-build-properties
expo install expo-dev-client
expo install expo-build-properties expo install expo-dev-client
expo install expo-build-properties

expo install expo-dev-client

Añadimos dentro de plugins de nuestro archivo app.json:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
"plugins": [
...
[
"expo-build-properties",
{
"ios": {
"useFrameworks": "static"
}
}
]
...
]
"plugins": [ ... [ "expo-build-properties", { "ios": { "useFrameworks": "static" } } ] ... ]
  "plugins": [
... 
[
        "expo-build-properties",
        {
          "ios": {
            "useFrameworks": "static"
          }
        }
      ]

...

]

Añadimos en app.json (al final del fichero) fuera de expo:{}

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
"expo": {
....
},
"react-native-google-mobile-ads": {
"android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx"
}
}
}
"expo": { .... }, "react-native-google-mobile-ads": { "android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx", "ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx" } } }
"expo": {
....
},
    "react-native-google-mobile-ads": {
      "android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
      "ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx"
    }
  }
}

Indicaremos nuestro android_app_id y nuestro ios_app_id, obtenidos de Admob.

Una vez añadido todos estos datos, hay que ir a la carpeta de ios y ejecutar pod install:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npx pod-install
expo run:ios
npx pod-install expo run:ios
npx pod-install

expo run:ios

Para generar el proyecto en Android o actualizar las dependencias usando Expo:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
expo run:android
expo run:android
expo run:android

Generamos prebuild:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
expo prebuild
expo prebuild
 expo prebuild

Una vez generado el proyecto nativo, podemos crear un build dev (Como crear un build development usando Expo EAS con React Native)

Instalamos el build dev nativo y continuamos.

Una vez listo el proyecto, lo arrancamos a partir de ahora con:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npx expo start --dev-client
npx expo start --dev-client
npx expo start --dev-client

Para que funcione correctamente con las últimas versiónes de iOS, tenemos que añadir user_tracking_usage_description dentro de react-native-google-mobile-ads:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
"user_tracking_usage_description": "This identifier will be used to deliver personalized ads to you."
"user_tracking_usage_description": "This identifier will be used to deliver personalized ads to you."
 "user_tracking_usage_description": "This identifier will be used to deliver personalized ads to you."

Quedando de la siguiente forma:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
{
"react-native-google-mobile-ads": {
"android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"user_tracking_usage_description": "This identifier will be used to deliver personalized ads to you."
}
}
{ "react-native-google-mobile-ads": { "android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx", "ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx", "user_tracking_usage_description": "This identifier will be used to deliver personalized ads to you." } }
{
  "react-native-google-mobile-ads": {
    "android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
    "ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
    "user_tracking_usage_description": "This identifier will be used to deliver personalized ads to you."
  }
}

Para solicitar el permiso al usuario usaremos la libreria react-native-permissions

  • Primero la instalamos:
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npm install --save react-native-permissions
npm install --save react-native-permissions
npm install --save react-native-permissions

Y luego creamos un componente de requestAdsPermissions:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import { check, request, PERMISSIONS, RESULTS } from 'react-native-permissions';
const result = await check(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY);
if (result === RESULTS.DENIED) {
// The permission has not been requested, so request it.
await request(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY);
}
const adapterStatuses = await mobileAds().initialize();
import { check, request, PERMISSIONS, RESULTS } from 'react-native-permissions'; const result = await check(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY); if (result === RESULTS.DENIED) { // The permission has not been requested, so request it. await request(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY); } const adapterStatuses = await mobileAds().initialize();
import { check, request, PERMISSIONS, RESULTS } from 'react-native-permissions';

const result = await check(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY);
if (result === RESULTS.DENIED) {
  // The permission has not been requested, so request it.
  await request(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY);
}

const adapterStatuses = await mobileAds().initialize();

En caso de Expo podemos usar expo-tracking-transparency:

Primero tenemos que instalar expo-tracking-transparency:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npx expo install expo-tracking-transparency
npx expo install expo-tracking-transparency
npx expo install expo-tracking-transparency

En este ejemplo además tenemos que instalar react-native-async-storage:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npx expo install @react-native-async-storage/async-storage
npx expo install @react-native-async-storage/async-storage
npx expo install @react-native-async-storage/async-storage

Y ahora creamos el componente TrackingPermissions.js

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Platform, View } from "react-native";
import { requestTrackingPermissionsAsync } from 'expo-tracking-transparency'
import AsyncStorage from '@react-native-async-storage/async-storage';
//Componente boton
const Request = () => {
function guardarPermisoAnuncios(status) {
AsyncStorage.setItem('cargarPermisoAnunciosLoad', status);
}
async function cargarPermisoAnuncios(funcionRetorno) {
try {
const value = await AsyncStorage.getItem('cargarPermisoAnunciosLoad');
funcionRetorno(value);
} catch (error) {
funcionRetorno(error);
}
}
useEffect(() => {
//request permissons only one canAskAgain = false
cargarPermisoAnuncios(functionRetorno);
function functionRetorno(permiso) {
//alert(permiso);
if (permiso != "1") {
requestTrackingPermissionsAsync().then((e) => { guardarPermisoAnuncios("1"), console.log(e) });
}
}
//getPermissionsAsync().then((e) => console.log(e));
}, []);
return (
null
)
};
export default Request;
import React, { useState, useEffect } from "react"; import { StyleSheet, Platform, View } from "react-native"; import { requestTrackingPermissionsAsync } from 'expo-tracking-transparency' import AsyncStorage from '@react-native-async-storage/async-storage'; //Componente boton const Request = () => { function guardarPermisoAnuncios(status) { AsyncStorage.setItem('cargarPermisoAnunciosLoad', status); } async function cargarPermisoAnuncios(funcionRetorno) { try { const value = await AsyncStorage.getItem('cargarPermisoAnunciosLoad'); funcionRetorno(value); } catch (error) { funcionRetorno(error); } } useEffect(() => { //request permissons only one canAskAgain = false cargarPermisoAnuncios(functionRetorno); function functionRetorno(permiso) { //alert(permiso); if (permiso != "1") { requestTrackingPermissionsAsync().then((e) => { guardarPermisoAnuncios("1"), console.log(e) }); } } //getPermissionsAsync().then((e) => console.log(e)); }, []); return ( null ) }; export default Request;
import React, { useState, useEffect } from "react";
import { StyleSheet, Platform, View } from "react-native";
import { requestTrackingPermissionsAsync } from 'expo-tracking-transparency'

import AsyncStorage from '@react-native-async-storage/async-storage';


//Componente boton
const Request = () => {

function guardarPermisoAnuncios(status) {

    AsyncStorage.setItem('cargarPermisoAnunciosLoad', status);
}

async function cargarPermisoAnuncios(funcionRetorno) {
    try {
        const value = await AsyncStorage.getItem('cargarPermisoAnunciosLoad');

        funcionRetorno(value);

    } catch (error) {
        funcionRetorno(error);
    }
}
    useEffect(() => {
        //request permissons only one canAskAgain = false
        cargarPermisoAnuncios(functionRetorno);
        function functionRetorno(permiso) {
            //alert(permiso);
            if (permiso != "1") {
                requestTrackingPermissionsAsync().then((e) => { guardarPermisoAnuncios("1"), console.log(e) });
            }
        }
        //getPermissionsAsync().then((e) => console.log(e));
    }, []);

    return (
        null
    )
};

export default Request;

Para usarlo lo importamos:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import RequestTrackingAds from '../componentes/Anuncios/TrackingPermissions';
import RequestTrackingAds from '../componentes/Anuncios/TrackingPermissions';
import RequestTrackingAds from '../componentes/Anuncios/TrackingPermissions';

Y lo añadimos al tender del screen donde queremos que aparezca:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<RequestTrackingAds />
<RequestTrackingAds />
 <RequestTrackingAds />

Ahora vamos a crear un Banner:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { BannerAd, TestIds, BannerAdSize } from 'react-native-google-mobile-ads';
//Componente boton
const Banner = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
return (
<BannerAd unitId={TestIds.BANNER} size={BannerAdSize.ANCHORED_ADAPTIVE_BANNER} />
)
};
export default Banner;
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { BannerAd, TestIds, BannerAdSize } from 'react-native-google-mobile-ads'; //Componente boton const Banner = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); return ( <BannerAd unitId={TestIds.BANNER} size={BannerAdSize.ANCHORED_ADAPTIVE_BANNER} /> ) }; export default Banner; const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { BannerAd, TestIds, BannerAdSize } from 'react-native-google-mobile-ads';

//Componente boton
const Banner = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");
            });
    }, []);

    return (
        <BannerAd unitId={TestIds.BANNER} size={BannerAdSize.ANCHORED_ADAPTIVE_BANNER} />
    )
};

export default Banner;

const styles = StyleSheet.create({

});

Para usarlo lo importamos:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import Banner from '../componentes/Anuncios/Banner'
import Banner from '../componentes/Anuncios/Banner'
import Banner from '../componentes/Anuncios/Banner'

Y lo añadimos al render:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<Banner />
<Banner />
<Banner />

Interstitial:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { InterstitialAd, TestIds, AdEventType } from 'react-native-google-mobile-ads';
const interstitial = InterstitialAd.createForAdRequest(TestIds.INTERSTITIAL, {
});
//Componente boton
const Interstitial = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
const [loaded, setLoaded] = useState(false);
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
useEffect(() => {
if (!loaded) {
const unsubscribe = interstitial.addAdEventListener(AdEventType.LOADED, () => {
setLoaded(true);
});
// Start loading the interstitial straight away
interstitial.load();
// Unsubscribe from events on unmount
return unsubscribe;
}
}, [loaded]);
useEffect(() => {
if (loaded) {
interstitial.show();
setLoaded(false);
}
}, [loaded]);
};
export default Interstitial;
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { InterstitialAd, TestIds, AdEventType } from 'react-native-google-mobile-ads'; const interstitial = InterstitialAd.createForAdRequest(TestIds.INTERSTITIAL, { }); //Componente boton const Interstitial = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; const [loaded, setLoaded] = useState(false); useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); useEffect(() => { if (!loaded) { const unsubscribe = interstitial.addAdEventListener(AdEventType.LOADED, () => { setLoaded(true); }); // Start loading the interstitial straight away interstitial.load(); // Unsubscribe from events on unmount return unsubscribe; } }, [loaded]); useEffect(() => { if (loaded) { interstitial.show(); setLoaded(false); } }, [loaded]); }; export default Interstitial; const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { InterstitialAd, TestIds, AdEventType } from 'react-native-google-mobile-ads';

const interstitial = InterstitialAd.createForAdRequest(TestIds.INTERSTITIAL, {

});

//Componente boton
const Interstitial = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    const [loaded, setLoaded] = useState(false);

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");

            });
    }, []);


    useEffect(() => {
        if (!loaded) {
            const unsubscribe = interstitial.addAdEventListener(AdEventType.LOADED, () => {
                setLoaded(true);
            });

            // Start loading the interstitial straight away
            interstitial.load();

            // Unsubscribe from events on unmount
            return unsubscribe;
        }
    }, [loaded]);


    useEffect(() => {
        if (loaded) {
            interstitial.show();
            setLoaded(false);
        }
    }, [loaded]);

};

export default Interstitial;

const styles = StyleSheet.create({

});

Para usarlo lo importamos:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import Interstitial from '../componentes/Anuncios/Interstitial'
import Interstitial from '../componentes/Anuncios/Interstitial'
import Interstitial from '../componentes/Anuncios/Interstitial'

Y lo añadimos al render:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<Interstitial />
<Interstitial />
<Interstitial />

Rewarded

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { RewardedAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';
const rewarded = RewardedAd.createForAdRequest(TestIds.REWARDED, {
});
//Componente boton
const Rewarded = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
const [loaded, setLoaded] = useState(false);
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
useEffect(() => {
if (!loaded) {
const unsubscribeLoaded = rewarded.addAdEventListener(RewardedAdEventType.LOADED, () => {
setLoaded(true);
});
const unsubscribeEarned = rewarded.addAdEventListener(
RewardedAdEventType.EARNED_REWARD,
reward => {
console.log('User earned reward of ', reward);
},
);
// Start loading the rewarded ad straight away
rewarded.load();
// Unsubscribe from events on unmount
return () => {
unsubscribeLoaded();
unsubscribeEarned();
};
}
}, [loaded]);
useEffect(() => {
if (loaded) {
rewarded.show();
setLoaded(false);
}
}, [loaded]);
};
export default Rewarded;
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { RewardedAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads'; const rewarded = RewardedAd.createForAdRequest(TestIds.REWARDED, { }); //Componente boton const Rewarded = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; const [loaded, setLoaded] = useState(false); useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); useEffect(() => { if (!loaded) { const unsubscribeLoaded = rewarded.addAdEventListener(RewardedAdEventType.LOADED, () => { setLoaded(true); }); const unsubscribeEarned = rewarded.addAdEventListener( RewardedAdEventType.EARNED_REWARD, reward => { console.log('User earned reward of ', reward); }, ); // Start loading the rewarded ad straight away rewarded.load(); // Unsubscribe from events on unmount return () => { unsubscribeLoaded(); unsubscribeEarned(); }; } }, [loaded]); useEffect(() => { if (loaded) { rewarded.show(); setLoaded(false); } }, [loaded]); }; export default Rewarded; const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { RewardedAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';

const rewarded = RewardedAd.createForAdRequest(TestIds.REWARDED, {

});

//Componente boton
const Rewarded = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    const [loaded, setLoaded] = useState(false);

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");

            });
    }, []);


    useEffect(() => {
        if (!loaded) {
            const unsubscribeLoaded = rewarded.addAdEventListener(RewardedAdEventType.LOADED, () => {
                setLoaded(true);
            });
            const unsubscribeEarned = rewarded.addAdEventListener(
                RewardedAdEventType.EARNED_REWARD,
                reward => {
                    console.log('User earned reward of ', reward);
                },
            );

            // Start loading the rewarded ad straight away
            rewarded.load();

            // Unsubscribe from events on unmount
            return () => {
                unsubscribeLoaded();
                unsubscribeEarned();
            };
        }
    }, [loaded]);


    useEffect(() => {
        if (loaded) {
            rewarded.show();
            setLoaded(false);
        }
    }, [loaded]);

};

export default Rewarded;

const styles = StyleSheet.create({

});

Ahora importamos el componente:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import Rewarded from '../componentes/Anuncios/Rewarded'
import Rewarded from '../componentes/Anuncios/Rewarded'
import Rewarded from '../componentes/Anuncios/Rewarded'

Y lo inicializamos:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<Rewarded />
<Rewarded />
<Rewarded />

Rewarded Interstitial

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { RewardedInterstitialAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';
const rewardedInterstitial = RewardedInterstitialAd.createForAdRequest(TestIds.REWARDED_INTERSTITIAL, {
});
//Componente boton
const Rewarded = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
const [loaded, setLoaded] = useState(false);
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
useEffect(() => {
if (!loaded) {
const unsubscribeLoaded = rewardedInterstitial.addAdEventListener(
RewardedAdEventType.LOADED,
() => {
setLoaded(true);
},
);
const unsubscribeEarned = rewardedInterstitial.addAdEventListener(
RewardedAdEventType.EARNED_REWARD,
reward => {
console.log('User earned reward of ', reward);
},
);
// Start loading the rewarded interstitial ad straight away
rewardedInterstitial.load();
// Unsubscribe from events on unmount
return () => {
unsubscribeLoaded();
unsubscribeEarned();
};
}
}, [loaded]);
useEffect(() => {
if (loaded) {
rewardedInterstitial.show();
setLoaded(false);
}
}, [loaded]);
};
export default Rewarded;
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { RewardedInterstitialAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads'; const rewardedInterstitial = RewardedInterstitialAd.createForAdRequest(TestIds.REWARDED_INTERSTITIAL, { }); //Componente boton const Rewarded = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; const [loaded, setLoaded] = useState(false); useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); useEffect(() => { if (!loaded) { const unsubscribeLoaded = rewardedInterstitial.addAdEventListener( RewardedAdEventType.LOADED, () => { setLoaded(true); }, ); const unsubscribeEarned = rewardedInterstitial.addAdEventListener( RewardedAdEventType.EARNED_REWARD, reward => { console.log('User earned reward of ', reward); }, ); // Start loading the rewarded interstitial ad straight away rewardedInterstitial.load(); // Unsubscribe from events on unmount return () => { unsubscribeLoaded(); unsubscribeEarned(); }; } }, [loaded]); useEffect(() => { if (loaded) { rewardedInterstitial.show(); setLoaded(false); } }, [loaded]); }; export default Rewarded; const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { RewardedInterstitialAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';

const rewardedInterstitial = RewardedInterstitialAd.createForAdRequest(TestIds.REWARDED_INTERSTITIAL, {

});

//Componente boton
const Rewarded = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    const [loaded, setLoaded] = useState(false);

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");

            });
    }, []);


    useEffect(() => {
        if (!loaded) {
            const unsubscribeLoaded = rewardedInterstitial.addAdEventListener(
                RewardedAdEventType.LOADED,
                () => {
                  setLoaded(true);
                },
              );
              const unsubscribeEarned = rewardedInterstitial.addAdEventListener(
                RewardedAdEventType.EARNED_REWARD,
                reward => {
                  console.log('User earned reward of ', reward);
                },
              );
          
              // Start loading the rewarded interstitial ad straight away
              rewardedInterstitial.load();
          
              // Unsubscribe from events on unmount
              return () => {
                unsubscribeLoaded();
                unsubscribeEarned();
              };
        }
    }, [loaded]);


    useEffect(() => {
        if (loaded) {
            rewardedInterstitial.show();
            setLoaded(false);
        }
    }, [loaded]);

};

export default Rewarded;

const styles = StyleSheet.create({

});

Para usarlo lo importamos:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import RewardedInterstitialAd from '../componentes/Anuncios/RewardedInterstitial'
import RewardedInterstitialAd from '../componentes/Anuncios/RewardedInterstitial'
import RewardedInterstitialAd from '../componentes/Anuncios/RewardedInterstitial'

Y lo añadimos al render:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<RewardedInterstitialAd />
<RewardedInterstitialAd />
<RewardedInterstitialAd />

Open APP:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import { useState, useEffect } from "react";
import { AppState, AppStateStatus } from "react-native";
import mobileAds, { AppOpenAd, AdEventType, TestIds, } from 'react-native-google-mobile-ads';
const appOpenAd = AppOpenAd.createForAdRequest(TestIds.APP_OPEN, {});
//TestIds.APP_OPEN
export const useOpenAppAds = () => {
const [appState, setAppState] = useState<AppStateStatus>(AppState.currentState);
const [loaded, setLoaded] = useState(false);
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds OpenAPP initialized successfully");
});
}, []);
useEffect(() => {
const handleAppStateChange = (nextAppState: AppStateStatus) => {
if (appState.match(/inactive|background/) && nextAppState === 'active') {
console.log('App has come to the foreground!');
if (loaded) {
showAppOpenAd();
}else{
loadAd();
}
}
setAppState(nextAppState);
};
const appStateListener = AppState.addEventListener('change', handleAppStateChange);
return () => {
appStateListener.remove();
};
}, [appState, loaded]);
const loadAd = () => {
if (!loaded) {
console.log("OpenAPP try to Ad load");
const unsubscribeLoaded = appOpenAd.addAdEventListener(AdEventType.LOADED, () => {
console.log("OpenAPP Ad loaded");
setLoaded(true);
});
const unsubscribeError = appOpenAd.addAdEventListener(AdEventType.ERROR, (error) => {
console.log("OpenAPP Ad failed to load with error: ", error);
});
appOpenAd.load();
return () => {
unsubscribeLoaded();
unsubscribeError();
};
}
}
const showAppOpenAd = () => {
console.log("OpenAPP Ad show");
appOpenAd.show();
setLoaded(false);
loadAd(); // Cargar un nuevo anuncio después de mostrar uno
};
return { loadAd, showAppOpenAd, loaded };
};
import { useState, useEffect } from "react"; import { AppState, AppStateStatus } from "react-native"; import mobileAds, { AppOpenAd, AdEventType, TestIds, } from 'react-native-google-mobile-ads'; const appOpenAd = AppOpenAd.createForAdRequest(TestIds.APP_OPEN, {}); //TestIds.APP_OPEN export const useOpenAppAds = () => { const [appState, setAppState] = useState<AppStateStatus>(AppState.currentState); const [loaded, setLoaded] = useState(false); useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds OpenAPP initialized successfully"); }); }, []); useEffect(() => { const handleAppStateChange = (nextAppState: AppStateStatus) => { if (appState.match(/inactive|background/) && nextAppState === 'active') { console.log('App has come to the foreground!'); if (loaded) { showAppOpenAd(); }else{ loadAd(); } } setAppState(nextAppState); }; const appStateListener = AppState.addEventListener('change', handleAppStateChange); return () => { appStateListener.remove(); }; }, [appState, loaded]); const loadAd = () => { if (!loaded) { console.log("OpenAPP try to Ad load"); const unsubscribeLoaded = appOpenAd.addAdEventListener(AdEventType.LOADED, () => { console.log("OpenAPP Ad loaded"); setLoaded(true); }); const unsubscribeError = appOpenAd.addAdEventListener(AdEventType.ERROR, (error) => { console.log("OpenAPP Ad failed to load with error: ", error); }); appOpenAd.load(); return () => { unsubscribeLoaded(); unsubscribeError(); }; } } const showAppOpenAd = () => { console.log("OpenAPP Ad show"); appOpenAd.show(); setLoaded(false); loadAd(); // Cargar un nuevo anuncio después de mostrar uno }; return { loadAd, showAppOpenAd, loaded }; };
import { useState, useEffect } from "react";
import { AppState, AppStateStatus } from "react-native";
import mobileAds, { AppOpenAd, AdEventType, TestIds, } from 'react-native-google-mobile-ads';

const appOpenAd = AppOpenAd.createForAdRequest(TestIds.APP_OPEN, {});
//TestIds.APP_OPEN
export const useOpenAppAds = () => {
    const [appState, setAppState] = useState<AppStateStatus>(AppState.currentState);
    const [loaded, setLoaded] = useState(false);

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds OpenAPP initialized successfully");
            });
    }, []);

    useEffect(() => {
        const handleAppStateChange = (nextAppState: AppStateStatus) => {
            if (appState.match(/inactive|background/) && nextAppState === 'active') {
                console.log('App has come to the foreground!');
                if (loaded) {
                    showAppOpenAd();
                }else{
                    loadAd();
                }
            }
            setAppState(nextAppState);
        };

        const appStateListener = AppState.addEventListener('change', handleAppStateChange);

        return () => {
            appStateListener.remove();
        };
    }, [appState, loaded]);

    const loadAd = () => {
        if (!loaded) {
            console.log("OpenAPP try to Ad load");
            const unsubscribeLoaded = appOpenAd.addAdEventListener(AdEventType.LOADED, () => {
                console.log("OpenAPP Ad loaded");
                setLoaded(true);
            });

            const unsubscribeError = appOpenAd.addAdEventListener(AdEventType.ERROR, (error) => {
                console.log("OpenAPP Ad failed to load with error: ", error);
            });

            appOpenAd.load();

            return () => {
                unsubscribeLoaded();
                unsubscribeError();
            };
        }
    }

    const showAppOpenAd = () => {
       
                console.log("OpenAPP Ad show");
                appOpenAd.show();
                setLoaded(false);
                loadAd(); // Cargar un nuevo anuncio después de mostrar uno
            
    };

    return { loadAd, showAppOpenAd, loaded };
};

Para utilizar OpenAPP tenemos que añadirlo cuando la APP se abra.

Para ello lo mejor sería integrarlo dentro de un context y realizar la llamada que inicializa el proceso:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
const { showAppOpenAd, loadAd, loaded } = useOpenAppAds(); // Usar el hook
useEffect(() => {
console.log("Loaded: " + loaded);
if (!loaded) {
loadAd();
}
}, [loaded]);
const { showAppOpenAd, loadAd, loaded } = useOpenAppAds(); // Usar el hook useEffect(() => { console.log("Loaded: " + loaded); if (!loaded) { loadAd(); } }, [loaded]);
 
const { showAppOpenAd, loadAd, loaded } = useOpenAppAds(); // Usar el hook

useEffect(() => {
        console.log("Loaded: " + loaded);
        if (!loaded) {
            loadAd();
        }
    }, [loaded]);

*Extra:

Si queremos que los anuncios interstitiales se carguen cuándo se realice un evento, podemos crear una función que los inicialice y lance, para ello haremos esta modificación:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { InterstitialAd, TestIds, AdEventType } from 'react-native-google-mobile-ads';
import { getVideoAds } from '../../util/Ids_anuncios';
const interstitial = InterstitialAd.createForAdRequest(getVideoAds(), {
});
var setLoadAd = null;
//Componente boton
const Banner = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
const [loaded, setLoaded] = useState(false);
const [initLoad, setInitLoad] = useState(false);
setLoadAd = setInitLoad;
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
useEffect(() => {
if (initLoad) {
const unsubscribe = interstitial.addAdEventListener(AdEventType.LOADED, () => {
setLoaded(true);
});
// Start loading the interstitial straight away
interstitial.load();
// Unsubscribe from events on unmount
return unsubscribe;
}
}, [initLoad]);
useEffect(() => {
if (loaded) {
interstitial.show();
setLoaded(false);
}
}, [loaded]);
};
export default Banner;
export function initLoadInterstitial() {
setLoadAd(true);
}
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { InterstitialAd, TestIds, AdEventType } from 'react-native-google-mobile-ads'; import { getVideoAds } from '../../util/Ids_anuncios'; const interstitial = InterstitialAd.createForAdRequest(getVideoAds(), { }); var setLoadAd = null; //Componente boton const Banner = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; const [loaded, setLoaded] = useState(false); const [initLoad, setInitLoad] = useState(false); setLoadAd = setInitLoad; useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); useEffect(() => { if (initLoad) { const unsubscribe = interstitial.addAdEventListener(AdEventType.LOADED, () => { setLoaded(true); }); // Start loading the interstitial straight away interstitial.load(); // Unsubscribe from events on unmount return unsubscribe; } }, [initLoad]); useEffect(() => { if (loaded) { interstitial.show(); setLoaded(false); } }, [loaded]); }; export default Banner; export function initLoadInterstitial() { setLoadAd(true); } const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { InterstitialAd, TestIds, AdEventType } from 'react-native-google-mobile-ads';

import { getVideoAds } from '../../util/Ids_anuncios';

const interstitial = InterstitialAd.createForAdRequest(getVideoAds(), {

});

var setLoadAd = null;

//Componente boton
const Banner = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    const [loaded, setLoaded] = useState(false);
    const [initLoad, setInitLoad] = useState(false);

    setLoadAd = setInitLoad;

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");

            });
    }, []);


    useEffect(() => {
        if (initLoad) {
            const unsubscribe = interstitial.addAdEventListener(AdEventType.LOADED, () => {
                setLoaded(true);
            });

            // Start loading the interstitial straight away
            interstitial.load();

            // Unsubscribe from events on unmount
            return unsubscribe;
        }
    }, [initLoad]);


    useEffect(() => {
        if (loaded) {
            interstitial.show();
            setLoaded(false);
        }
    }, [loaded]);

};

export default Banner;

export function initLoadInterstitial() {
    setLoadAd(true);
}

const styles = StyleSheet.create({

});

De esta forma tendremos que llamar a la función initLoadInterstitial() desde el Screen o botón en el que queramos visualizar el anuncio.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import Interstitial, { initLoadInterstitial } from '../componentes/Anuncios/Interstitial';
import Interstitial, { initLoadInterstitial } from '../componentes/Anuncios/Interstitial';
import Interstitial, { initLoadInterstitial } from '../componentes/Anuncios/Interstitial';

Ejecutar:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
useEffect(() => {
initLoadInterstitial();
}, []);
useEffect(() => { initLoadInterstitial(); }, []);
  useEffect(() => {
        initLoadInterstitial();
    }, []);

Así quedarían los anuncios Rewarded:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { RewardedAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';
import { getBonificado } from '../../util/Ids_anuncios';
const rewarded = RewardedAd.createForAdRequest(getBonificado(), {
});
var setLoadAd = null;
//Componente boton
const Rewarded = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
const [loaded, setLoaded] = useState(false);
const [initLoad, setInitLoad] = useState(false);
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
useEffect(() => {
if (initLoad) {
const unsubscribeLoaded = rewarded.addAdEventListener(RewardedAdEventType.LOADED, () => {
setLoaded(true);
});
const unsubscribeEarned = rewarded.addAdEventListener(
RewardedAdEventType.EARNED_REWARD,
reward => {
console.log('User earned reward of ', reward);
},
);
// Start loading the rewarded ad straight away
rewarded.load();
// Unsubscribe from events on unmount
return () => {
unsubscribeLoaded();
unsubscribeEarned();
};
}
}, [initLoad]);
useEffect(() => {
if (loaded) {
rewarded.show();
setLoaded(false);
}
}, [loaded]);
};
export default Rewarded;
export function initLoadRewardedAds() {
setLoadAd(true);
}
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { RewardedAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads'; import { getBonificado } from '../../util/Ids_anuncios'; const rewarded = RewardedAd.createForAdRequest(getBonificado(), { }); var setLoadAd = null; //Componente boton const Rewarded = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; const [loaded, setLoaded] = useState(false); const [initLoad, setInitLoad] = useState(false); useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); useEffect(() => { if (initLoad) { const unsubscribeLoaded = rewarded.addAdEventListener(RewardedAdEventType.LOADED, () => { setLoaded(true); }); const unsubscribeEarned = rewarded.addAdEventListener( RewardedAdEventType.EARNED_REWARD, reward => { console.log('User earned reward of ', reward); }, ); // Start loading the rewarded ad straight away rewarded.load(); // Unsubscribe from events on unmount return () => { unsubscribeLoaded(); unsubscribeEarned(); }; } }, [initLoad]); useEffect(() => { if (loaded) { rewarded.show(); setLoaded(false); } }, [loaded]); }; export default Rewarded; export function initLoadRewardedAds() { setLoadAd(true); } const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { RewardedAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';
import { getBonificado } from '../../util/Ids_anuncios';

const rewarded = RewardedAd.createForAdRequest(getBonificado(), {

});

var setLoadAd = null;
//Componente boton
const Rewarded = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    const [loaded, setLoaded] = useState(false);
    const [initLoad, setInitLoad] = useState(false);

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");

            });
    }, []);


    useEffect(() => {
        if (initLoad) {
            const unsubscribeLoaded = rewarded.addAdEventListener(RewardedAdEventType.LOADED, () => {
                setLoaded(true);
            });
            const unsubscribeEarned = rewarded.addAdEventListener(
                RewardedAdEventType.EARNED_REWARD,
                reward => {
                    console.log('User earned reward of ', reward);
                },
            );

            // Start loading the rewarded ad straight away
            rewarded.load();

            // Unsubscribe from events on unmount
            return () => {
                unsubscribeLoaded();
                unsubscribeEarned();
            };
        }
    }, [initLoad]);


    useEffect(() => {
        if (loaded) {
            rewarded.show();
            setLoaded(false);
        }
    }, [loaded]);

};

export default Rewarded;

export function initLoadRewardedAds() {
    setLoadAd(true);
}

const styles = StyleSheet.create({

});

Interstitial Rewarded:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";
import mobileAds, { RewardedInterstitialAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';
const rewardedInterstitial = RewardedInterstitialAd.createForAdRequest(TestIds.REWARDED_INTERSTITIAL, {
});
var setLoadAd = null;
//Componente boton
const Rewarded = (props) => {
//Parametros de constructor se pasan por props
const { texto, onPress, styleExtra = {} } = props;
const [loaded, setLoaded] = useState(false);
const [initLoad, setInitLoad] = useState(false);
useEffect(() => {
mobileAds()
.initialize()
.then(adapterStatuses => {
console.log("MobileAds initialized successfully");
});
}, []);
useEffect(() => {
if (initLoad) {
const unsubscribeLoaded = rewardedInterstitial.addAdEventListener(
RewardedAdEventType.LOADED,
() => {
setLoaded(true);
},
);
const unsubscribeEarned = rewardedInterstitial.addAdEventListener(
RewardedAdEventType.EARNED_REWARD,
reward => {
console.log('User earned reward of ', reward);
},
);
// Start loading the rewarded interstitial ad straight away
rewardedInterstitial.load();
// Unsubscribe from events on unmount
return () => {
unsubscribeLoaded();
unsubscribeEarned();
};
}
}, [initLoad]);
useEffect(() => {
if (loaded) {
rewardedInterstitial.show();
setLoaded(false);
}
}, [loaded]);
};
export default Rewarded;
export function initLoadRewardedInterstititalAds() {
setLoadAd(true);
}
const styles = StyleSheet.create({
});
import React, { useState, useEffect } from "react"; import { StyleSheet, Text } from "react-native"; import mobileAds, { RewardedInterstitialAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads'; const rewardedInterstitial = RewardedInterstitialAd.createForAdRequest(TestIds.REWARDED_INTERSTITIAL, { }); var setLoadAd = null; //Componente boton const Rewarded = (props) => { //Parametros de constructor se pasan por props const { texto, onPress, styleExtra = {} } = props; const [loaded, setLoaded] = useState(false); const [initLoad, setInitLoad] = useState(false); useEffect(() => { mobileAds() .initialize() .then(adapterStatuses => { console.log("MobileAds initialized successfully"); }); }, []); useEffect(() => { if (initLoad) { const unsubscribeLoaded = rewardedInterstitial.addAdEventListener( RewardedAdEventType.LOADED, () => { setLoaded(true); }, ); const unsubscribeEarned = rewardedInterstitial.addAdEventListener( RewardedAdEventType.EARNED_REWARD, reward => { console.log('User earned reward of ', reward); }, ); // Start loading the rewarded interstitial ad straight away rewardedInterstitial.load(); // Unsubscribe from events on unmount return () => { unsubscribeLoaded(); unsubscribeEarned(); }; } }, [initLoad]); useEffect(() => { if (loaded) { rewardedInterstitial.show(); setLoaded(false); } }, [loaded]); }; export default Rewarded; export function initLoadRewardedInterstititalAds() { setLoadAd(true); } const styles = StyleSheet.create({ });
import React, { useState, useEffect } from "react";
import { StyleSheet, Text } from "react-native";

import mobileAds, { RewardedInterstitialAd, RewardedAdEventType, TestIds } from 'react-native-google-mobile-ads';

const rewardedInterstitial = RewardedInterstitialAd.createForAdRequest(TestIds.REWARDED_INTERSTITIAL, {

});

var setLoadAd = null;
//Componente boton
const Rewarded = (props) => {

    //Parametros de constructor se pasan por props
    const { texto, onPress, styleExtra = {} } = props;

    const [loaded, setLoaded] = useState(false);
    const [initLoad, setInitLoad] = useState(false);

    useEffect(() => {
        mobileAds()
            .initialize()
            .then(adapterStatuses => {
                console.log("MobileAds initialized successfully");

            });
    }, []);


    useEffect(() => {
        if (initLoad) {
            const unsubscribeLoaded = rewardedInterstitial.addAdEventListener(
                RewardedAdEventType.LOADED,
                () => {
                  setLoaded(true);
                },
              );
              const unsubscribeEarned = rewardedInterstitial.addAdEventListener(
                RewardedAdEventType.EARNED_REWARD,
                reward => {
                  console.log('User earned reward of ', reward);
                },
              );
          
              // Start loading the rewarded interstitial ad straight away
              rewardedInterstitial.load();
          
              // Unsubscribe from events on unmount
              return () => {
                unsubscribeLoaded();
                unsubscribeEarned();
              };
        }
    }, [initLoad]);


    useEffect(() => {
        if (loaded) {
            rewardedInterstitial.show();
            setLoaded(false);
        }
    }, [loaded]);

};

export default Rewarded;

export function initLoadRewardedInterstititalAds() {
  setLoadAd(true);
}

const styles = StyleSheet.create({

});
0

Deja un comentario