How to create a custom progress button in React Native with TypeScript: In this post, I will show you how to create a custom progress button in React Native using TypeScript. We will create a button component that will take different props to customize its style. props of the button: The following interface will be used as the button props: interface LoadingButtonProps { backgroundColorDefault: string; backgroundColorLoading: string; isLoading: boolean; indicatorColor: string; indicatorSize: number | "small" | "large" | undefined; textColorDefault: string; textColorLoading: str ..read more

How to hide the keyboard on scrolling through a list in React Native: This post will show you how to hide the keyboard once user starts to scroll through a FlatList. We will create one simple program with a FlatList. It will include a list of TextInput components. If the user clicks on the TextInput component, it will open the keyboard. We need to close the the keyboard if user scrolls through the list or clicks on anywhere on the screen that is not a TextInput component. Basic program with a FlatList: In this example, we will use the following program. It has one FlatList with a list of TextI ..read more

How to detect if Keyboard is opened or closed in React Native: This post will show you how to find if the keyboard is open or closed in React Native in different ways. We will use the Keyboard module. Method 1: By using the addListener() method: The Keyboard module in React Native provides different methods to control and listen to different keyboard events in both Android and iOS. The addListener method can be used to add listeners to different keyboard events. It takes two parameters: static addListener: ( eventType: KeyboardEventName, listener: KeyboardEventListener, ) => EmitterSu ..read more

How to hide the keyboard in React Native on tapping outside of TextInput: This is a common problem and expected behavior in a mobile application. Suppose we have multiple TextInput components in a row and we need to hide the keyboard if the user clicks on anywhere outside. This can be implemented in different ways in React Native. In this post, I will show you two different ways to solve this problem with a mini React Native project. Method 1: By using a ScrollView: We can simply add the items in a ScrollView and it will handle the keyboard automatically, i.e. if the user taps anywhere on Scro ..read more

How to change the text size of TextInput in React Native: The TextInput component of React Native is used to take text inputs. It provides different props to handle its different properties. This post will show you how to change the size of the text input font manually. Create a basic React Native project: Before starting the tutorial, let’s create a basic React Native project using React Native cli. You can skip this step if you are already working on a React Native project. Open a terminal window, go to a folder to create the project and run the following command: npx react-native@latest i ..read more

How to remove the first occurrence of an item in a list in Python: This post will show you how to remove the first occurrence of an item from a list in Python. The program will use one predefined list and one number to remove from the list. There are different ways to solve this problem in Python. I will show you four different ways. Method 1: By using the remove() method: The remove() method of Python list removes the first occurrence of an element from a list. This method takes the element as its parameter and removes its first instance. The syntax of the remove() method is: list.remove(e ..read more

JavaScript program to check if an object is an Array: In this post, we will learn different ways to check if an object is an Array or not. The typeof operator returns object for an Array as it is a non-primitive data type. For example, let a1 = [1, 2, 3, 4]; let a2 = [{i: 1}, 2, 3]; let a3 = 5; let a4 = 'hello'; let a5 = undefined; let a6 = {'name': 'Alex'}; console.log(typeof a1); // object console.log(typeof a2); // object console.log(typeof a3); // number console.log(typeof a4); // string console.log(typeof a5); // undefined console.log(typeof a6); // object If you run this program, it ..read more

JavaScript program to add the digits of a number: In this post, I will show you how to write a JavaScript program to add the digits of a given number or it will find the sum of the digits of a number. For example, if the number is 234, it will print 9. Method 1: Find the sum of digits of a number by using a while loop: With this approach, we will use one while loop to find the sum. It will follow the following steps: Initialize one variable sum as 0 to hold the final sum. Run one while loop until the number is greater than 0. In the loop, get the rightmost digit of the number and add it to th ..read more

How to find all matches in an array of objects in JavaScript: In this post, we will explore different ways to find all matches in an array in JavaScript. Method 1: By using the filter method: The filter method takes one function as its parameter and filters down the elements of the array that are passed by the provided function. It returns a shallow copy of the portion of the array. Let’s consider the below example: let studentArr = [{ id: 1, name: 'Alex', age: 20 }, { id: 2, name: 'Bob', age: 18 }, { id: 3, name: 'Chandler', age: 19 }, { id: 4, na ..read more

How to check if an element is present in an Array or not in JavaScript: In this JavaScript example, we will learn how to check if an element is present in an Array or not in different ways. We can use a for loop or we can use the predefined array functions. Let me show you how it works with example programs. Method 1: By using a loop: We can use a for or while loop to iterate over an array and find if an element is present in an Array or not. The following program shows how to use a for loop to check if a number is an array: const isInArray = (arr, n) => { for(let i = 0; i < arr.le ..read more