diff --git a/app/containers/MessageBox/AnimatedContainer.js b/app/containers/MessageBox/AnimatedContainer.js index eb5cbbe47..688ccd591 100644 --- a/app/containers/MessageBox/AnimatedContainer.js +++ b/app/containers/MessageBox/AnimatedContainer.js @@ -12,6 +12,7 @@ export default class MessageBox extends React.PureComponent { constructor(props) { super(props); this.animatedBottom = new Animated.Value(0); + this.state = { render: false }; } componentWillReceiveProps(nextProps) { @@ -25,6 +26,7 @@ export default class MessageBox extends React.PureComponent { } show() { + this.setState({ render: true }); this.animatedBottom.setValue(0); Animated.timing(this.animatedBottom, { toValue: 1, @@ -39,6 +41,9 @@ export default class MessageBox extends React.PureComponent { duration: 300, useNativeDriver: true }).start(); + setTimeout(() => { + this.setState({ render: false }); + }, 300); } render() { @@ -47,6 +52,10 @@ export default class MessageBox extends React.PureComponent { outputRange: [0, -this.props.messageboxHeight - 200] }); + if (!this.state.render) { + return null; + } + return ( { + Keyboard.dismiss(); + } get usersTyping() { const users = this.props.usersTyping.filter(_username => this.props.username !== _username); return users.length ? `${ users.join(' ,') } ${ users.length > 1 ? 'are' : 'is' } typing` : ''; } render() { - return ({this.usersTyping}); + return ( this.onPress()}>{this.usersTyping}); } } diff --git a/app/containers/message/index.js b/app/containers/message/index.js index 7ab119870..f57bb5e14 100644 --- a/app/containers/message/index.js +++ b/app/containers/message/index.js @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { View, TouchableHighlight, Text, TouchableOpacity, Animated } from 'react-native'; +import { View, TouchableHighlight, Text, TouchableOpacity, Animated, Keyboard } from 'react-native'; import { connect } from 'react-redux'; import Icon from 'react-native-vector-icons/MaterialIcons'; import moment from 'moment'; @@ -64,6 +64,10 @@ export default class Message extends React.Component { return this.props.item._updatedAt.toGMTString() !== nextProps.item._updatedAt.toGMTString() || this.props.item.status !== nextProps.item.status; } + onPress = () => { + Keyboard.dismiss(); + } + onLongPress() { const { item } = this.props; this.props.actionsShow(JSON.parse(JSON.stringify(item))); @@ -181,6 +185,7 @@ export default class Message extends React.Component { return ( this.onPress()} onLongPress={() => this.onLongPress()} disabled={this.isDeleted() || this.hasError()} underlayColor='#FFFFFF' diff --git a/app/views/RoomView/index.js b/app/views/RoomView/index.js index 023dae62e..94bbd4f12 100644 --- a/app/views/RoomView/index.js +++ b/app/views/RoomView/index.js @@ -209,7 +209,7 @@ export default class RoomView extends React.Component { renderRow={item => this.renderItem(item)} initialListSize={10} keyboardShouldPersistTaps='always' - keyboardDismissMode='on-drag' + keyboardDismissMode='none' /> {this.renderFooter()}