react-native-selectable-text

allow selecting text and responding to selection changes

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-native-selectable-text
1.0.24 years ago4 years agoMinified + gzip package size for react-native-selectable-text in KB

Readme

react-native-selectable-text
Gives cross platform support for multiline selectable text, where no keyboard is wanted.

Getting started

$ npm install react-native-selectable-text --save

Mostly automatic installation

$ react-native link react-native-selectable-text

Manual installation

Android

  1. Open up android/app/src/main/java/[...]/MainActivity.java
  2. Add import fi.msand.RNSelectableTextPackage; to the imports at the top of the file
  3. Add new RNSelectableTextPackage() to the list returned by the getPackages() method
  4. Append the following lines to android/settings.gradle:
```
include ':react-native-selectable-text'
project(':react-native-selectable-text').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-selectable-text/android')
```
  1. Insert the following lines inside the dependencies block in android/app/build.gradle:
```
compile project(':react-native-selectable-text')
```

Usage

import SelectableText from 'react-native-selectable-text';

export default ({ text, onSelectionChange }) => (
  <SelectableText
    selectable
    multiline
    contextMenuHidden
    scrollEnabled={false}
    editable={false}
    onSelectionChange={(event) => {
      const {
        nativeEvent: {
          selection: { start, end },
        },
      } = event
      const str = text.substring(start, end)
      onSelectionChange({ str, start, end })
    }}
    style={{
      color: "#BAB6C8",
    }}
    value={text}
  />);