bugfix

README.md

@@ -1,13 +1,36 @@
 # react-native-inputscrollview
-防止键盘弹出时候，输入框被遮挡
+
+1. 防止键盘弹出时候，输入框被遮挡
+2. 解决在ScrollView中点击其它元素时需要点击两次才能生效的问题
 
 ## 如何安装
 
+0.35以上:
+
 ```bash
 npm install react-native-inputscrollview --save
 rnpm link react-native-inputscrollview
 
 ```
 
+0.34以下:
+
+```bash
+npm install react-native-inputscrollview@1.x --save
+rnpm link react-native-inputscrollview
+
+```
+
+
 ## 如何使用
 用InputScrollView替换InputView外层的ScrollView组件
+
+## 属性
+
+### distance: number (default 50)
+
+当输入框非常靠近底部的时候,会自动和键盘保持一定的距离。这可以为你其它的组件留出空间。
+
+### tapToDismiss: boolean (default true)
+
+是否可以点击ScrollView来关闭键盘。

index.js

@@ -2,22 +2,22 @@
  * Created by lvbingru on 12/16/15.
  */
 
-import React, {Component, PropTypes, } from 'react';
+import React, {Component, PropTypes } from 'react';
-import ReactNative, {InteractionManager, View, Text, ScrollView, Platform, Animated, UIManager, NativeModules, Dimensions} from 'react-native';
+import ReactNative, {
+    InteractionManager, View, Text, ScrollView, Platform, Animated, UIManager, NativeModules, Dimensions,
+    Keyboard,
+} from 'react-native';
 import TextInputState from 'react-native/Libraries/Components/TextInput/TextInputState';
-import dismissKeyboard from 'react-native/Libraries/Utilities/dismissKeyboard';
-import packageData from 'react-native/package.json';
-import semver from 'semver';
 const ViewPlugins = NativeModules.InputScrollViewPlugin;
+const dismissKeyboard = Keyboard.dismiss;
 
 const propTypes = {
     distance : PropTypes.number,
     tapToDismiss : PropTypes.bool,
-    onKeyboardWillShow : PropTypes.func,
 }
 
 const defaultProps = {
-    distance : 160,
+    distance : 50,
     tapToDismiss : true,
 }
 
@@ -33,6 +33,42 @@ export default class InputScrollView extends Component {
         this.moved = false;
     }
 
+    componentWillMount() {
+        this.keyboardWillShowListener = Keyboard.addListener('keyboardWillShow', this.onKeyboardWillShow);
+        this.keyboardWillHideListener = Keyboard.addListener('keyboardWillHide', this.onKeyboardWillHide);
+    }
+
+    componentWillUnmount() {
+        this.keyboardWillShowListener.remove();
+        this.keyboardWillHideListener.remove();
+    }
+
+    onKeyboardWillShow = e => {
+        if (!this.scrollViewRef) {
+            return;
+        }
+        const currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
+        if (currentlyFocusedTextInput != null) {
+            ViewPlugins && ViewPlugins.isSubview(
+                currentlyFocusedTextInput,
+                this.scrollViewRef.getInnerViewNode(),
+                r => {
+                    if (r === true) {
+                        this.move(currentlyFocusedTextInput, e)
+                    }
+                });
+        }
+    };
+    onKeyboardWillHide = e=> {
+        if (!this.scrollViewRef) {
+            return;
+        }
+        if (this.moved) {
+            this.moved = false;
+            this.scrollToY(this.offsetY);
+        }
+    };
+
     render() {
         const {distance, tapToDismiss, onKeyboardWillShow, keyboardShouldPersistTaps, children, ...others} = this.props
         return (
@@ -67,30 +103,6 @@ export default class InputScrollView extends Component {
                     ref={(srcollView) => {
                         this.scrollViewRef = srcollView;
                     }}
-                onKeyboardWillShow = {e => {
-                    if (!this.scrollViewRef) {
-                        return;
-                    }
-                   const currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
-                   if (currentlyFocusedTextInput != null) {
-                       ViewPlugins && ViewPlugins.isSubview(
-                        currentlyFocusedTextInput,
-                        this.scrollViewRef.getInnerViewNode(),
-                        r => {
-                            if(r===true) {this.move(currentlyFocusedTextInput, e)}
-                        });
-                   }
-                   onKeyboardWillShow && onKeyboardWillShow(e);
-                }}
-                onKeyboardWillHide = {e=> {
-                    if (!this.scrollViewRef) {
-                        return;
-                    }
-                    if (this.moved) {
-                        this.moved = false;
-                        this.scrollToY(this.offsetY);
-                    }
-                }}
                     onMomentumScrollEnd = {e=>{
                         if (!this.moved) {
                             this.offsetY = Math.max(0, e.nativeEvent.contentOffset.y)
@@ -112,7 +124,7 @@ export default class InputScrollView extends Component {
             e=>{console.warning(e)},
             (left, top, width, height)=>{
                 let keyboardScreenY = Dimensions.get('window').height;
-              if (e && e.endCoordinates) {
+                if (e) {
                     keyboardScreenY = e.endCoordinates.screenY;
                 }
                 let scrollOffsetY = top - keyboardScreenY + height + this.props.distance;
@@ -128,13 +140,8 @@ export default class InputScrollView extends Component {
     }
 
     scrollToY(offsetY) {
-        if (semver.gte(packageData.version, '0.20.0')) {
         this.scrollViewRef.scrollTo({x:0, y:offsetY});
     }
-        else {
-            this.scrollViewRef.scrollTo(offsetY, 0);
-        }
-    }
 }
 
 InputScrollView.propTypes = propTypes;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-inputscrollview",
-  "version": "1.0.3",
+  "version": "2.0.0",
   "description": "输入框位置动态调整",
   "main": "index.js",
   "scripts": {
@@ -24,5 +24,8 @@
   "homepage": "https://github.com/reactnativecn/react-native-inputscrollview.git%22#readme",
   "dependencies": {
     "semver":  "^5.1.0"
+  },
+  "peerDependencies": {
+    "react-native": "^0.35.0"
   }
 }