rn,invite: fix bottom padding on AddPeopleDialog on Android
This commit is contained in:
parent
171b065db1
commit
a9da047d3a
|
@ -67,6 +67,11 @@ type Props = AbstractProps & {
|
||||||
|
|
||||||
type State = AbstractState & {
|
type State = AbstractState & {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Boolean to show if an extra padding needs to be added to the bottom bar.
|
||||||
|
*/
|
||||||
|
bottomPadding: boolean,
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* State variable to keep track of the search field value.
|
* State variable to keep track of the search field value.
|
||||||
*/
|
*/
|
||||||
|
@ -94,6 +99,7 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
|
||||||
defaultState = {
|
defaultState = {
|
||||||
addToCallError: false,
|
addToCallError: false,
|
||||||
addToCallInProgress: false,
|
addToCallInProgress: false,
|
||||||
|
bottomPadding: false,
|
||||||
fieldValue: '',
|
fieldValue: '',
|
||||||
inviteItems: [],
|
inviteItems: [],
|
||||||
searchInprogress: false,
|
searchInprogress: false,
|
||||||
|
@ -194,9 +200,11 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
|
||||||
</View>
|
</View>
|
||||||
<TextInput
|
<TextInput
|
||||||
autoCorrect = { false }
|
autoCorrect = { false }
|
||||||
autoFocus = { true }
|
autoFocus = { false }
|
||||||
clearButtonMode = 'always' // iOS only
|
clearButtonMode = 'always' // iOS only
|
||||||
|
onBlur = { this._onFocused(false) }
|
||||||
onChangeText = { this._onTypeQuery }
|
onChangeText = { this._onTypeQuery }
|
||||||
|
onFocus = { this._onFocused(true) }
|
||||||
placeholder = {
|
placeholder = {
|
||||||
this.props.t(`inviteDialog.${placeholderKey}`)
|
this.props.t(`inviteDialog.${placeholderKey}`)
|
||||||
}
|
}
|
||||||
|
@ -223,7 +231,11 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
|
||||||
renderItem = { this._renderItem } />
|
renderItem = { this._renderItem } />
|
||||||
</View>
|
</View>
|
||||||
</SafeAreaView>
|
</SafeAreaView>
|
||||||
<SafeAreaView style = { [ styles.bottomBar, _headerStyles.headerOverlay ] }>
|
<SafeAreaView
|
||||||
|
style = { [
|
||||||
|
styles.bottomBar,
|
||||||
|
_headerStyles.headerOverlay,
|
||||||
|
this.state.bottomPadding ? styles.extraBarPadding : null ] }>
|
||||||
{ this._renderShareMeetingButton() }
|
{ this._renderShareMeetingButton() }
|
||||||
</SafeAreaView>
|
</SafeAreaView>
|
||||||
</KeyboardAvoidingView>
|
</KeyboardAvoidingView>
|
||||||
|
@ -317,6 +329,22 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
_onFocused: boolean => Function;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Constructs a callback to be used to update the padding of the field if necessary.
|
||||||
|
*
|
||||||
|
* @param {boolean} focused - True of the field is focused.
|
||||||
|
* @returns {Function}
|
||||||
|
*/
|
||||||
|
_onFocused(focused) {
|
||||||
|
return () => {
|
||||||
|
Platform.OS === 'android' && this.setState({
|
||||||
|
bottomPadding: focused
|
||||||
|
});
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
_onInvite: () => void
|
_onInvite: () => void
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -58,6 +58,13 @@ export default {
|
||||||
justifyContent: 'flex-start'
|
justifyContent: 'flex-start'
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A special padding to avoid issues on some devices (such as Android devices with custom suggestions bar).
|
||||||
|
*/
|
||||||
|
extraBarPadding: {
|
||||||
|
paddingBottom: 30
|
||||||
|
},
|
||||||
|
|
||||||
invitedList: {
|
invitedList: {
|
||||||
padding: 3
|
padding: 3
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue