Añadir anuncio ‘Vídeos Intersticial’ de Admob con React Native y Expo

En el tutorial de hoy os voy a enseñar cómo cargar un vídeo Interstitial de pantalla completa. Lo primero que tenemos que hacer es configurar Admob en React Native Añadir anuncios de Admob con React Native (Banner) Una vez configurada, podemos usar este componente para mostrar los anuncios: Solo tenemos que id_anuncios_admob por el código … Leer más

Solucionar error ‘Ad is already loaded’ al usar AdmobRewarded o AdMobInterstitial en React Native

Si al ejecutar la aplicación en nuestro dispositivo o emulador aparece el mensaje ‘Ad is already loaded’ es porque tiene problemas al cargar el anuncio que hemos solicitado a Admob. Esto ocurre porque se solicita el anuncio una vez y al solicitarlo por segunda vez falla. Para solucionarlo utilizamos el siguiente código, que volverá a … Leer más

Añadir anuncios de Admob con React Native (Banner) – Monetiza tu APP

En este tutorial, os voy a enseñar cómo añadir un Banner de Admob usando React Native y Expo. Lo primero de todo es configurar un anuncio con Admob. Una vez configurado obtenemos los códigos (de APP y de Bloque) e instalamos la librería expo-ads-admob. Una vez instalada, creamos un nuevo componente que llamamos Banner (si … Leer más

Obtener idioma del dispositivo Android o iOS o navegador web usando React Native

Para obtener el idioma del dispositivo usando React Native tenemos que utilizar el siguiente método: Primero importamos los métodos Platform y NativeModules de react-native. Y con el siguiente método obtenemos el idioma: isMaIngeniero en Informática, me encanta crear cosas o arreglarlas y darles una nueva vida. Escritor y poeta. Más de 20 APPs publicadas y … Leer más

Multi-idioma con React Native de forma automática según el idioma del dispositivo. Compatible con Android e iOS y web

En este tutorial os voy a enseñar cómo añadir soporte multi-idioma en React Native. Vamos a utilizar la librería i18next (https://react.i18next.com/) Primero vamos a instalar las siguientes dependencias: Una vez instaladas, creamos una nueva carpeta en nuestro proyecto llamada language y dentro añadimos dos archivos con el código de país que queramos implementar. En mi … Leer más

Solucionar problema: i18next::pluralResolver: Your environment seems not to be Intl API compatible, use an Intl.PluralRules polyfill. Will fallback to the compatibilityJSON v3 format handling en i18n con React Native y Android

Al implementar el soporte multi-idioma de i18next en React Native, la plataforma Android puede devolver el siguiente error: Y por consola sale lo siguiente: Para solucionarlo, tenemos que ir al archivo qué creamos para inicializar el plugin i18n y después añadir compatibilidad con JSON v3 (compatibilityJSON: ‘v3’): Una vez añadido ya no aparece el error … Leer más

Añadir un loader en React Native

Os voy a enseñar cómo añadir un loader para las pantallas de carga de React Native. Para comenzar, hay que crear un nuevo componente que llamaremos Loader.js Ahora voy a explicar el código: Para crear el loader he utilizado la librería react-native-paper (https://reactnativepaper.com/), esta librería proporciona diseño basado en Material Design de Google. Si queremos … Leer más

Abrir Stack.Tab desde un Stack.Screen contenido dentro de un tab con diferentes NavitagionContainer React Native.

Os voy a explicar cómo abrir otro tab, dentro de un screen (fuera del tab pero contenido dentro de la pila de ejecución) que ya tenemos contenido en nuestro tab. Por ejemplo, tenemos la siguiente pantalla y queremos realizar la navegación qué se indica en el vídeo: Y queremos abrir el tab “Buscar” utilizando el … Leer más

Añadir iconos en Tab Navigator en React Native

Cuando creamos un Tab Navigator por defecto, este sale sin iconos: Partiendo de este código: Si queremos añadir iconos podemos hacer lo siguiente. Vamos a utilizar una librería que ya nos proporciona iconos a nuestro proyecto, también podemos utilizar nuestros propios iconos, pero para que sea más rápido vamos a utilizar esta librería. Instalamos la … Leer más