Permitir arrastrar elementos por la pantalla en React Native

Permitir arrastrar elementos por la pantalla en React Native

Tiempo de lectura: 2 minutos Hoy vamos a crear un componente que nos permitirá arrastrar otros elementos por la pantalla usando React Native. Lo primero que haremos es crear el componete que llamaremos DragComponent.tsx y añadiremos la lógica que nos permita arrastrar: Ahora voy a explicar el código: Para utilizarlo solo tendremos que envolver nuestro componente con este: DevCodeLight devcodelight.com

Ocultar statusBar cuando mostramos modal en React Native

Ocultar statusBar cuando mostramos modal en React Native

Tiempo de lectura: < 1 minuto Vamos a ver cómo podemos solucionar el error que nos muestra el statusbar cuando mostramos un modal en React Native. Para solucionar este bug, tenemos que añadir la siguiente propiedad en nuestro modal: Y ahora se mostrará en pantalla completa: isMa Ingeniero en Informática, Investigador, me encanta crear cosas o arreglarlas y darles una nueva … Leer más

Añadir respuesta háptica (vibración) a un botón de tu APP de React Native con Expo

Añadir respuesta háptica (vibración) a un botón de tu APP de React Native con Expo

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos añadir una respuesta háptica en un botón usando React Native con Expo. Una respuesta háptica en un botón es una retroalimentación táctil que proporciona un dispositivo cuando presionas un botón o realizas alguna acción táctil sobre él. En lugar de simplemente pulsar un botón y no recibir ningún tipo … Leer más

Crear fuente (Font) personalizada para APP React Native con Expo

Crear fuente (Font) personalizada para APP React Native con Expo

Tiempo de lectura: < 1 minuto Hoy aprenderemos cómo podemos añadir una fuente personalizada (Font) usando React Native con Expo. Lo primero que tenemos que hacer es descargar nuestra fuente, por ejemplo de https://fonts.google.com/ Ahora la guardaremos dentro de assets/fonts Ahora iremos a nuestro entry point, en mi caso es app.tsx Usaremos expo-font Si queremos cargarla de forma nativa: Con esto … Leer más

Añadir fuente de texto (Font) personalizada en React Native

Añadir fuente de texto (Font) personalizada en React Native

Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos añadir una fuente personalizada Font a nuestro proyecto de aplicación con React Native. Lo primero que tenemos que hacer es descargar una fuente, podemos utilizar esta web: https://www.dafont.com/es/ Puedes descargar el formato .ttf o .otf Importante: Recomiendo que reviseis las licencias de las fuentes descargadas para evitar sorpresas. Guardamos … Leer más

Optimizar imágenes con react-native-fast-image en React Native

Optimizar imágenes con react-native-fast-image en React Native

Tiempo de lectura: 2 minutos La optimización de imágenes es un punto muy importante a la hora de desarrollar una APP. Con la librería react-native-fast-image conseguiremos cargar las imágenes de forma rápida y sencilla. Lo primero que haremos es instalar esta librería: Una vez instalada, vamos a crear un componente que nos permitirá cargar cualquier tipo de imagen usando esta … Leer más

Añadir i18next para internacionalizar una APP React Native + Expo usando TypeScript

Añadir i18next para internacionalizar una APP React Native + Expo usando TypeScript

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos internacionalizar y añadir multi lenguaje a una APP en React Native y usando TypeScript. Lo primero que haremos es instalar i18n: Una vez instalado, creamos una carpeta llamada language y dentro creamos un archivo i18next.ts Este archivo determinará automáticamente el idioma seleccionado en el dispositivo. El idioma por defecto … Leer más

Solucionar error Could not find Ninja on PATH or in SDK CMake bin folders. en React Native con Expo

Solucionar error Could not find Ninja on PATH or in SDK CMake bin folders. en React Native con Expo

Tiempo de lectura: < 1 minuto Hoy vamos a solucionar el siguiente error: A problem occurred evaluating project ‘:expo’. A problem occurred configuring project ‘:expo-modules-core’.[CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders. Este error ocurre cuando queremos generar el build de desarrollo con Expo: Para solucionar este error, tenemos que ir al SDK manager de Android … Leer más

Añadir un SVG en React Native con Expo

Añadir un SVG en React Native con Expo

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos añadir una imagen SVG en React Native usando Expo. Lo primero que haremos es instalar las dependencias necesarias: Primero react-native-svg Y ahora instalamos react-native-svg-transformer Una vez instaladas tenemos que configurar react-native-svg-transformer. Para ello abrimos el archivo metro.config.js y añadimos: Y si usamos TypeScript tendremos que añadir este código dentro … Leer más

Error SDK location not found en React Native

Error SDK location not found en React Native

Tiempo de lectura: < 1 minuto Si nos encontramos con este error al intentar generar un apk de una aplicación en React Native SDK location not found Define a valid SDK location with an ANDROID_HOME environment variable or by setting the sdk.dir path in your project’s local properties file, debemos hacer lo siguiente para solucionarlo. Ahora crearemos un fichero llamado local.properties … Leer más