React Native 聊天室置底输入框的设计

哎，我又绕回了最初的设计方式

先讲讲之前的设计思路，通过监听键盘的事件，为了接近完美的效果，我监听的是keyboardWillShow、keyboardWillHide
通过打印监听的返回信息，我成功的获得了键盘弹起、收起的动画参数，这个很重要，我可以将这个动画参数，完全提供给输入框，这样她们就可以同步移动，人不知鬼不觉，媲美原生效果，事实上我也是这么做的，代码如下

componentDidMount () {
    /** 注册键盘弹起事件监听  */
    this.keyboardWillShowListener = Keyboard.addListener('keyboardWillShow', this._keyboardWillShow.bind(this))
    this.keyboardWillHideListener = Keyboard.addListener('keyboardWillHide', this._keyboardWillHide.bind(this))
}

componentWillUnmount () {
  /** 移除键盘监听 **/
  this.keyboardWillShowListener.remove()
  this.keyboardWillHideListener.remove()
}

通过监听键盘行为触发动画

/** 键盘弹起 */
_keyboardWillShow (e) {
  if (!this.state.keyboardHeight) this.setState({ keyboardHeight: e.endCoordinates.height })
  Animated.timing(this.state.compositeAnim, {
    toValue: 1,
    easing: Easing.keyboard,
    duration: 250
  }).start()
}

/** 键盘收起 */
_keyboardWillHide (e) {
  console.log(e)
  Animated.timing(this.state.compositeAnim, {
    toValue: 0,
    easing: Easing.keyboard,
    duration: 250
  }).start()
}

<Animated.View style={
   {
 flex: 1,
 transform: [{