URI bar text visible from the left when it's not focused
This commit is contained in:
parent
82a7846e6d
commit
684f4867c3
1 changed files with 25 additions and 14 deletions
|
@ -14,6 +14,7 @@ class UriBar extends React.PureComponent {
|
||||||
|
|
||||||
componentDidMount () {
|
componentDidMount () {
|
||||||
this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide);
|
this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide);
|
||||||
|
this.setSelection();
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
|
@ -64,6 +65,12 @@ class UriBar extends React.PureComponent {
|
||||||
this.setState({ focused: false });
|
this.setState({ focused: false });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setSelection() {
|
||||||
|
if (this.textInput) {
|
||||||
|
this.textInput.setNativeProps({ selection: { start: 0, end: 0 }});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { navigation, suggestions, updateSearchQuery, value } = this.props;
|
const { navigation, suggestions, updateSearchQuery, value } = this.props;
|
||||||
if (this.state.currentValue === null) {
|
if (this.state.currentValue === null) {
|
||||||
|
@ -90,6 +97,7 @@ class UriBar extends React.PureComponent {
|
||||||
<View style={uriBarStyle.uriContainer}>
|
<View style={uriBarStyle.uriContainer}>
|
||||||
<TextInput ref={(ref) => { this.textInput = ref }}
|
<TextInput ref={(ref) => { this.textInput = ref }}
|
||||||
style={uriBarStyle.uriText}
|
style={uriBarStyle.uriText}
|
||||||
|
onLayout={() => { this.setSelection(); }}
|
||||||
selectTextOnFocus={true}
|
selectTextOnFocus={true}
|
||||||
placeholder={'Search for videos, music, games and more'}
|
placeholder={'Search for videos, music, games and more'}
|
||||||
underlineColorAndroid={'transparent'}
|
underlineColorAndroid={'transparent'}
|
||||||
|
@ -100,7 +108,10 @@ class UriBar extends React.PureComponent {
|
||||||
inlineImageLeft={'baseline_search_black_24'}
|
inlineImageLeft={'baseline_search_black_24'}
|
||||||
inlineImagePadding={16}
|
inlineImagePadding={16}
|
||||||
onFocus={() => this.setState({ focused: true })}
|
onFocus={() => this.setState({ focused: true })}
|
||||||
onBlur={() => this.setState({ focused: false })}
|
onBlur={() => {
|
||||||
|
this.setState({ focused: false });
|
||||||
|
this.setSelection();
|
||||||
|
}}
|
||||||
onChangeText={this.handleChangeText}
|
onChangeText={this.handleChangeText}
|
||||||
onSubmitEditing={() => {
|
onSubmitEditing={() => {
|
||||||
if (this.state.inputText) {
|
if (this.state.inputText) {
|
||||||
|
|
Loading…
Reference in a new issue