Allow Dragging Elements on the Screen in React Native

Allow Dragging Elements on the Screen in React Native

Tiempo de lectura: < 1 minuto Today we are going to create a component that will allow us to drag other elements across the screen using React Native. The first thing we will do is create the component that we will call DragComponent.tsx and add the logic that will allow us to drag: < pre class=”EnlighterJSRAW” data-enlighter-language=”generic” data-enlighter-theme=”” data-enlighter-highlight=”” data-enlighter-linenumbers=”” data-enlighter-lineoffset=”” … Read more

How to put a React Native app with Expo in Immersive mode (full screen) for Android

How to put a React Native app with Expo in Immersive mode (full screen) for Android

Tiempo de lectura: < 1 minuto We will implement the Immersive mode for Android on an Expo React Native app today. The Immersive mode allows us to put an app in full-screen mode on Android. We will start by installing the necessary libraries: Expo navigation bar: expo install expo-navigation-bar Expo status bar: expo install expo-status-bar And now to hide the status … Read more

Transform Android XML Vector to SVG Using the Command Line

Transform Android XML Vector to SVG Using the Command Line

Tiempo de lectura: < 1 minuto We will learn today how to transform an Android XML vector into a vector in SVG format using the command line. With the vector in SVG, we can use it both in React, Flutter or Web. First, we will install this library (if we want to use the web version): npm install -g vector-drawable-to-svg Once … Read more

Add an SVG in React Native with Expo

Add an SVG in React Native with Expo

Tiempo de lectura: 2 minutos We will learn today how to add an SVG image in React Native using Expo. The first thing we will do is install the necessary dependencies: First react-native-svg html expo install react-native-svg And now we installreact-native-svg-transformer npm install –save-dev react-native-svg-transformer We need to configure react-native-svg-transformer. To do this, we open the metro.config.js file and add: … Read more

Add Haptic Feedback (Vibration) to a Button in Your React Native App with Expo

Add Haptic Feedback (Vibration) to a Button in Your React Native App with Expo

Tiempo de lectura: 2 minutos Reading time: 2 minutes Today we are going to learn how we can add haptic feedback to a button using React Native with Expo. Haptic feedback on a button is tactile feedback provided by a device when you press a button or perform some touch action on it. Instead of simply pressing a button and … Read more

Add a Custom Font in React Native

Add a Custom Font in React Native

Tiempo de lectura: < 1 minuto Reading time: < 1 minute Today we are going to learn how we can add a custom Font to our application project with React Native. The first thing we need to do is download a font, we can use this website: https://www.dafont.com/es/ You can download the .ttf or .otf format Important: I recommend that you … Read more

Optimize Images with react-native-fast-image in React Native

Optimize Images with react-native-fast-image in React Native

Tiempo de lectura: 2 minutos Image optimization is a very important point when developing an APP. With the react-native-fast-image library, we will be able to load images quickly and easily. The first thing we will do is install this library: npm install react-native-fast-image –save Once installed, we will create a component that will allow us to load any type of … Read more

Add i18next to Internationalize a React Native + Expo APP using TypeScript

Add i18next to Internationalize a React Native + Expo APP using TypeScript

Tiempo de lectura: 2 minutos Today we are going to learn how we can internationalize and add multi-language support to a React Native APP using TypeScript. The first thing we will do is install i18n: npm install i18next react-i18next –save Once installed, we create a folder called language and inside it, we create a file i18next.ts // i18next.ts import i18n … Read more