Android 键盘与底部按钮重叠,直到刷新屏幕
我有以下组成部分: 带有Android 键盘与底部按钮重叠,直到刷新屏幕,android,react-native,keyboard,pull-to-refresh,hybrid,Android,React Native,Keyboard,Pull To Refresh,Hybrid,我有以下组成部分: 带有TextInput和按钮的滚动视图。我希望文本输入位于顶部,而按钮位于底部(justifyincontent:'spacebetween')。我正在从Android本机应用程序运行此组件。因此,我正在开发一款混合应用程序 问题: 当我点击文本输入时,键盘出现,它与底部的按钮重叠。如果在此之后我通过下拉刷新滚动视图,底部的按钮将出现在键盘上(我想要的)。 刷新控件呈现后发生了一些事情,设置了我的按钮的正确位置。但是我的组件看起来不太好,直到我拉刷新它,并且react nat
TextInput
和按钮的滚动视图
。我希望文本输入
位于顶部,而按钮
位于底部(justifyincontent:'spacebetween'
)。我正在从Android本机应用程序运行此组件。因此,我正在开发一款混合应用程序
问题:
当我点击文本输入
时,键盘出现,它与底部的按钮重叠。如果在此之后我通过下拉刷新滚动视图
,底部的按钮
将出现在键盘上(我想要的)。
刷新控件
呈现后发生了一些事情,设置了我的按钮的正确位置
。但是我的组件看起来不太好,直到我拉刷新它,并且react nativeRefreshControl
组件被激活
我的代码:
import React, { Component } from 'react';
import { View, KeyboardAvoidingView, TextInput, RefreshControl, Button, ScrollView } from 'react-native';
export default class Authenticate extends Component {
constructor(props) {
super(props);
this.state = {
refreshing: false
};
}
render() {
return (
<KeyboardAvoidingView enabled style={{ flex: 1 }}>
<ScrollView
contentContainerStyle={{ flex: 1, backgroundColor: 'gray', justifyContent: 'space-between' }}
refreshControl={<RefreshControl refreshing={this.state.refreshing} />}>
<View style={{ height: 200, backgroundColor: 'red' }}>
<TextInput
style={{
height: 60,
color: 'white',
backgroundColor: 'gray',
fontSize: 20,
textAlign: 'center'
}}
value="Press Me"
/>
</View>
<Button style={{ backgroundColor: 'blue', width: '100%' }} title="Footer button" />
</ScrollView>
</KeyboardAvoidingView>
);
}
}
import React,{Component}来自'React';
从“react native”导入{View、KeyboardAvoidingView、TextInput、RefreshControl、Button、ScrollView};
导出默认类扩展组件{
建造师(道具){
超级(道具);
此.state={
刷新:错误
};
}
render(){
返回(
);
}
}
如果您想隐藏按钮,然后它不会出现在键盘上方,请尝试此操作。更改您的AndroidManifest.xml文件。
将其添加到清单文件的活动标记中
android:windowSoftInputMode="adjustPan"
替换为
并使其具有1的灵活性。正如MD Naseem Ashraf
在此建议的那样,通过在我的清单文件android:WindowsofInputMode=“adjustResize”中添加以下行,问题得以解决。您可以使用键盘监听器“keyboardDidShow”在该侦听器的回调中,设置页脚按钮的动画,使其位于键盘上方,然后在“keyboardDidHide”上运行反向动画,也许可以尝试,在清单中的android:WindowsOfInputMode=adjustResize属性它不会改变任何内容。我不知道SafeArea
在这里有什么帮助。另外,正如文档所说,它只在ios上工作。是的,我的清单上有这一行。奇怪的是,只有在我通过下拉刷新屏幕后,按钮才会正确显示。是的,我的清单上有这一行。奇怪的是,只有在我通过下拉刷新屏幕后,按钮才会正确显示。
android:windowSoftInputMode="adjustPan"