React Native Copy Text to Clipboard Android iOS Example

Clipboard is a clean slate temporary storage area in computers & mobile phones used to perform cut, copy and paste text functionality. By default the cut, copy and paste functionality works automatically in TextInput component in react native. Sometimes developer needs to manually push and pop the values of Clipboard. We would use the react native’s Clipboard component API to manually insert and get value of Clipboard. In this tutorial we would learn about React Native Copy Text to Clipboard API in Android iOS Example.

Content in this project React Native Copy Text to Clipboard Android iOS Example:

1. Import Platform, StyleSheet, View, TextInput, Clipboard, TouchableOpacity and Text component in your project.

2. Create constructor() in your project. In constructor we would make 2 State named as clipboardText and textInputText.

clipboardText : Used to hold the Clipboard copy and cut text.

textInputText : Used to store the TextInput component entered text.

3. Create a function named as get_Text_From_Clipboard() with async() type of. ASYNC type of function always returns a promise.

await Clipboard.getString() : Used to get the current clipboard text.

4. Create a function named as set_Text_Into_Clipboard(). In this function we would set the TextInput entered text into Clipboard API.

Clipboard.setString() : Setting up any text manually in Clipboard.

5. Create 1 TextInput component, 2 Buttons using TouchableOpacity component & 1 Text component.

6. Creating Style.

Screenshots:

React Native Copy Text to Clipboard

One Comment

  1. nice tutorial , i love to react native .

Leave a Reply

Your email address will not be published. Required fields are marked *