Skip to content

Commit 9e4051c

Browse files
committed
Update readme
1 parent 762f1c1 commit 9e4051c

File tree

1 file changed

+2
-91
lines changed

1 file changed

+2
-91
lines changed

README.md

Lines changed: 2 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# react-native-keyboard-aware-scroll-view
1+
# react-native-keyboard-adjusted-scroll-view
22

33
<img src="https://travis-ci.org/APSL/react-native-keyboard-aware-scroll-view.svg?branch=master" />
44

@@ -8,97 +8,8 @@ A ScrollView component that handles keyboard appearance and automatically scroll
88
<img src="https://raw.githubusercontent.com/wiki/APSL/react-native-keyboard-aware-scroll-view/kasv.gif" alt="Scroll demo" width="400">
99
</p>
1010

11-
## Supported versions
12-
- `v0.2.0` requires `RN>=0.32.0`.
13-
- `v0.1.2` requires `RN>=0.27.2` but you should use `0.2.0` in order to make it work with multiple scroll views.
14-
- `v0.0.7` requires `react-native>=0.25.0`.
15-
- Use `v0.0.6` for older RN versions.
16-
1711
## Installation
18-
Installation can be done through ``npm``:
1912

2013
```shell
21-
npm i react-native-keyboard-aware-scroll-view --save
22-
```
23-
24-
## Usage
25-
You can use the ``KeyboardAwareScrollView`` or the ``KeyboardAwareListView``
26-
components. Both accept ``ScrollView`` and ``ListView`` default props and
27-
implements a custom ``KeyboardAwareMixin`` to handle keyboard appearance.
28-
The mixin is also available if you want to use it in any other component.
29-
30-
Import ``react-native-keyboard-aware-scroll-view`` and wrap your content inside
31-
it:
32-
33-
```js
34-
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view'
35-
```
36-
37-
```jsx
38-
<KeyboardAwareScrollView>
39-
<View>
40-
<TextInput />
41-
</View>
42-
</KeyboardAwareScrollView>
43-
```
44-
45-
## Auto-scroll in `TextInput` fields
46-
As of `v0.1.0`, the component auto scrolls to the focused `TextInput` 😎. For versions `v0.0.7` and older you can do the following.
47-
48-
### Programatically scroll to any `TextInput`
49-
In order to scroll to any `TextInput` field, you can use the built-in method `scrollToFocusedInput`. Example:
50-
51-
```js
52-
_scrollToInput (reactNode: any) {
53-
// Add a 'scroll' ref to your ScrollView
54-
this.refs.scroll.scrollToFocusedInput(reactNode)
55-
}
14+
yarn add react-native-keyboard-adjusted-scroll-view
5615
```
57-
58-
```jsx
59-
<KeyboardAwareScrollView ref='scroll'>
60-
<View>
61-
<TextInput onFocus={(event: Event) => {
62-
// `bind` the function if you're using ES6 classes
63-
this._scrollToInput(ReactNative.findNodeHandle(event.target))
64-
}/>
65-
</View>
66-
</KeyboardAwareScrollView>
67-
```
68-
69-
### Programatically scroll to any position
70-
There's another built-in function that lets you programatically scroll to any position of the scroll view:
71-
72-
```js
73-
this.refs.scroll.scrollToPosition(0, 0, true)
74-
```
75-
76-
## Register to keyboard events
77-
You can register to `ScrollViewResponder` events `onKeyboardWillShow` and `onKeyboardWillHide`:
78-
79-
```js
80-
<KeyboardAwareScrollView
81-
onKeyboardWillShow={(frames: Object) => {
82-
console.log('Keyboard event', frames)
83-
}}>
84-
<View>
85-
<TextInput />
86-
</View>
87-
</KeyboardAwareScrollView>
88-
```
89-
90-
## API
91-
### Props
92-
All the `ScrollView`/`ListView` props will be passed.
93-
94-
| **Prop** | **Type** | **Description** |
95-
|----------|----------|-----------------|
96-
| `viewIsInsideTabBar` | `boolean` | Adds an extra offset that represents the `TabBarIOS` height. |
97-
| `resetScrollToCoords` | `Object: {x: number, y: number}` | Coordinates that will be used to reset the scroll when the keyboard hides. |
98-
| `enableAutoAutomaticScroll` | `boolean` | When focus in `TextInput` will scroll the position, default is enabled. |
99-
| `extraHeight` | `number` | Adds an extra offset when focusing the `TextInput`s. |
100-
| `extraScrollHeight` | `number` | Adds an extra offset to the keyboard. Useful if you want to stick elements above the keyboard. |
101-
102-
## License
103-
104-
MIT.

0 commit comments

Comments
 (0)