Merge pull request #143 from lbryio/fix-uri-bar-errors

blur text input and hide suggestions when the soft keyboard is closed
This commit is contained in:
Akinwale Ariwodola 2018-05-27 21:55:51 +01:00 committed by GitHub
commit 062e7cef24
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -8,6 +8,20 @@ import uriBarStyle from '../../styles/uriBar';
class UriBar extends React.PureComponent { class UriBar extends React.PureComponent {
static INPUT_TIMEOUT = 500; static INPUT_TIMEOUT = 500;
textInput = null;
keyboardDidHideListener = null;
componentDidMount () {
this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide);
}
componentWillUnmount() {
if (this.keyboardDidHideListener) {
this.keyboardDidHideListener.remove();
}
}
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
@ -41,6 +55,13 @@ class UriBar extends React.PureComponent {
navigation.navigate({ routeName: 'File', key: 'filePage', params: { uri: normalizeURI(value) }}); navigation.navigate({ routeName: 'File', key: 'filePage', params: { uri: normalizeURI(value) }});
} }
} }
_keyboardDidHide = () => {
if (this.textInput) {
this.textInput.blur();
}
this.setState({ focused: false });
}
render() { render() {
const { navigation, suggestions, updateSearchQuery, value } = this.props; const { navigation, suggestions, updateSearchQuery, value } = this.props;
@ -66,7 +87,8 @@ class UriBar extends React.PureComponent {
onPress={() => this.handleItemPress(item)} />} /> onPress={() => this.handleItemPress(item)} />} />
</View>)} </View>)}
<View style={uriBarStyle.uriContainer}> <View style={uriBarStyle.uriContainer}>
<TextInput style={uriBarStyle.uriText} <TextInput ref={(ref) => { this.textInput = ref }}
style={uriBarStyle.uriText}
selectTextOnFocus={true} selectTextOnFocus={true}
placeholder={'Search for videos, music, games and more'} placeholder={'Search for videos, music, games and more'}
underlineColorAndroid={'transparent'} underlineColorAndroid={'transparent'}