# react-native-scrollable-input

> This package fix the problem of scrolling on a react-native rtl TextInput in the ScrollView. (Android & iOS)

Latest version **1.0.7** (published 2019-01-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-native-scrollable-input
pnpm add react-native-scrollable-input
yarn add react-native-scrollable-input
bun add react-native-scrollable-input
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2019-01-02 |
| First published | 2018-12-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 5.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Mohammad Zeynali |
| Maintainers | farazm64 |
| Keywords | scrollable, TextInput, scrollable, rtl, input, android, rtl, TextInput |

## Links

- npm: https://www.npmjs.com/package/react-native-scrollable-input
- npm.io page: https://npm.io/package/react-native-scrollable-input

## Alternatives

- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads

## Recent versions

- 1.0.7 (latest) — 2019-01-02
- 1.0.6 — 2018-12-10
- 1.0.5 — 2018-12-10
- 1.0.4 — 2018-12-09
- 1.0.3 — 2018-12-09
- 1.0.2 — 2018-12-09
- 1.0.1 — 2018-12-09
- 1.0.0 — 2018-12-09

## README

# React Native Scrollable TextInput

A cross-platform TextInput component for React Native.
This is a JavaScript-only implementation of React-Native TextInput.


## Features

- Fix the problem of scrolling RTL TextInput in a ScrollView Component for Android & iOS (Specially Android)

## Installation

```sh
$ npm install react-native-scrollable-input --save
```

## Quick Start

This example make a large scrollable content list for testing InputText when it put in the ScrollView (You can dragging on InputText's for moving content of ScrollView top and down).

```js
import React from 'react';
import { View, ScrollView, StyleSheet } from 'react-native';
import InputText from 'react-native-scrollable-input';

export default class Example extends React.Component
{
    state = {
        text: '',
        tempList: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
    }
    
    render ()
    {
        return (
            <View style={styles.container}>
                <ScrollView>
                    {this.state.tempList.map ((item, index) =>
                    {
                        return (
                            <InputText
                                value={this.state.text}
                                onChangeText={(value) => this.setState ({text: value})}
                                style={styles.input}
                                containerStyle={styles.inputContainer}
                                placeholder='اینجا بنویسید ...'
                                // All React-Native Original TextInput Props is Supported.
                            />
                        );
                    })}
                </ScrollView>
            </View>
        );
    }
}

const styles = StyleSheet.create ({
  container: {
    flex: 1,
  },
  input: {
    // Your custom text fontFamily, color and etc ...
  },
  inputContainer: {
    // Custom style for Container of InputText
  }
});
```

---
_Source: https://npm.io/package/react-native-scrollable-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._