Astrocoders / React Native Selectable Text
Licence: mit
Capture text selection and customize the action menu
Stars: ✭ 174
Projects that are alternatives of or similar to React Native Selectable Text
React Native Directed Scrollview
UNMAINTAINED- see below. A natively implemented scrollview component which lets you specify different scroll directions for child content.
Stars: ✭ 139 (-20.11%)
Mutual labels: native
Smenu
smenu started as a lightweight and flexible terminal menu generator, but quickly evolved into a powerful and versatile CLI selection tool for interactive or scripting use.
Stars: ✭ 1,906 (+995.4%)
Mutual labels: selection
Gta V Data Dumps
GTA V Data dumps useful for modding & scripting
Stars: ✭ 148 (-14.94%)
Mutual labels: native
Proton Native
A React environment for cross platform desktop apps
Stars: ✭ 10,834 (+6126.44%)
Mutual labels: native
Drag Select Recyclerview
👇 Easy Google Photos style multi-selection for RecyclerViews, powered by Kotlin and AndroidX.
Stars: ✭ 1,818 (+944.83%)
Mutual labels: selection
Purescript Presto
Write Apps like Mathematical Equations!
Stars: ✭ 149 (-14.37%)
Mutual labels: native
Context Menu.ios
You can easily add awesome animated context menu to your app.
Stars: ✭ 1,854 (+965.52%)
Mutual labels: context-menu
Conari
🧬 Platform for unmanaged memory, pe-modules, related PInvoke features, and more for: Libraries, Executable Modules, enjoy using of the unmanaged native C/C++ in .NET world, and other raw binary data …
Stars: ✭ 138 (-20.69%)
Mutual labels: native
Jquery Ui Contextmenu
jQuery plugin that turns a jQueryUI menu widget into a context menu.
Stars: ✭ 170 (-2.3%)
Mutual labels: context-menu
Stunning Signature
Native Signature Verification For Android (with example)
Stars: ✭ 139 (-20.11%)
Mutual labels: native
Jpegkit Android
Efficient JPEG operations for Android without the risk of an OutOfMemoryException.
Stars: ✭ 154 (-11.49%)
Mutual labels: native
Deeputteranceaggregation
Modeling Multi-turn Conversation with Deep Utterance Aggregation (COLING 2018)
Stars: ✭ 171 (-1.72%)
Mutual labels: selection
Node Postal
NodeJS bindings to libpostal for fast international address parsing/normalization
Stars: ✭ 165 (-5.17%)
Mutual labels: native
react-native-selectable-text
Demo
Android
iOS
Usage
import { SelectableText } from "@astrocoders/react-native-selectable-text";
// Use normally, it is a drop-in replacement for react-native/Text
<SelectableText
menuItems={["Foo", "Bar"]}
/*
Called when the user taps in a item of the selection menu:
- eventType: (string) is the label
- content: (string) the selected text portion
- selectionStart: (int) is the start position of the selected text
- selectionEnd: (int) is the end position of the selected text
*/
onSelection={({ eventType, content, selectionStart, selectionEnd }) => {}}
value="I crave star damage"
/>;
Getting started
$ npm install @astrocoders/react-native-selectable-text --save
Mostly automatic installation
$ react-native link @astrocoders/react-native-selectable-text
Manual installation
iOS - Binary Linking (Alternative 1)
- In XCode, in the project navigator, right click
Libraries
➜Add Files to [your project's name]
- Go to
node_modules
➜@astrocoders/react-native-selectable-text
and addRNSelectableText.xcodeproj
- In XCode, in the project navigator, select your project. Add
libRNSelectableText.a
to your project'sBuild Phases
➜Link Binary With Libraries
- Run your project (
Cmd+R
)<
iOS - Pods (Alternative 2)
- Add
pod 'RNSelectableText', :path => '../node_modules/@astrocoders/react-native-selectable-text/ios/RNSelectableText.podspec'
to your projects podfile - run
pod install
Android
- Open up
android/app/src/main/java/[...]/MainActivity.java
- Add
import com.astrocoders.selectabletext.RNSelectableTextPackage;
to the imports at the top of the file - Add
new RNSelectableTextPackage()
to the list returned by thegetPackages()
method
- 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/@astrocoders/react-native-selectable-text/android')
- Insert the following lines inside the dependencies block in
android/app/build.gradle
:compile project(':react-native-selectable-text')
Props
name | description | type | default |
---|---|---|---|
value | text content | string | "" |
onSelection | Called when the user taps in a item of the selection menu | ({ eventType: string, content: string, selectionStart: int, selectionEnd: int }) => void | () => {} |
menuItems | context menu items | array(string) | [] |
style | additional styles to be applied to text | Object | null |
highlights | array of text ranges that should be highlighted with an optional id | array({ id: string, start: int, end: int }) | [] |
highlightColor | highlight color | string | null |
onHighlightPress | called when the user taps the highlight | (id: string) => void | () => {} |
appendToChildren | element to be added in the last line of text | ReactNode | null |
TextComponent | Text component used to render value
|
ReactNode | |
textValueProp | text value prop for TextComponent. Should be used when passing TextComponent. Defaults to 'children' which works for | string | 'children' |
textComponentProps | additional props to pass to TextComponent | object | null |
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].