键盘避免视图调整大小在安卓中不起作用



我希望"下一步"按钮在看到键盘时不要覆盖它。 当我使用KeyboardAvoidingView时,IOS工作正常。 但它的工作方式就像在Android上AdjustPan一样。manifest设置为AdjustResize

如何让它在安卓上工作?

import React, { Component } from 'react';
import {
Button, Text, Container, Content, Header, Left, Body, Right, Icon, Input, Form,
} from 'native-base';
import {
StyleSheet, Dimensions, KeyboardAvoidingView, Platform,
} from 'react-native';

const { height } = Dimensions.get('window');
const titleTopMargin = height / 7.38;
const inputTopMargin = height / 12.3;
const nextButtonTopMargin = height / 6.246;
const styles = StyleSheet.create({
headerStyle: {
borderBottomWidth: 0,
},
headerViewsLeft: {
flex: 1,
justifyContent: 'flex-start',
alignItems: 'flex-start',
marginLeft: 23,
},
backButtonText: {
fontSize: 16,
color: '#666666',
},
titleText: {
marginLeft: 60,
fontSize: 18,
color: '#333333',
marginTop: titleTopMargin,
},
inputStyle: {
marginTop: inputTopMargin,
marginLeft: 59,
marginRight: 59,
color: '#333333',
fontSize: 16,
borderBottomWidth: 1,
borderBottomColor: '#666666',
},
nextButton: {
marginTop: nextButtonTopMargin,
},
});
class LoginEmailContainer extends Component {
back = () => {
const { navigation } = this.props;
navigation.goBack();
}

render() {
const { back } = this;
return (
<Container>
<Header style={styles.headerStyle}>
<Left style={styles.headerViewsLeft}>
<Button iconLeft onPress={() => back()} transparent>
<Text style={styles.backButtonText}>back</Text>
</Button>
</Left>
</Header>
<KeyboardAvoidingView
behavior="padding"
style={{ flex: 1 }}
>
<Content scrollEnabled bounces={false} style={{flex:1}}>
<Text style={styles.titleText}>email</Text>
<Form>
<Input
placeholder="example@gmail.com"
placeholderColor="rgba(153, 153, 153, 0.55)"
style={styles.inputStyle}
/>
</Form>
<Button style={styles.nextButton}>
<Text>Next</Text>
</Button>
</Content>
</KeyboardAvoidingView>
</Container>
);
}
}
export default LoginEmailContainer;

我试图nullKeyboardAvoidingViewbehavior,但没有奏效。 我也尝试keyboardVerticalOffset到 -500,但这也没有用。

https://snack.expo.io/rkXnqiXaV

我的代码的零食。 它不完全像我的应用程序。 它的工作原理大致相似。

React Native 文档 说:

当完全没有行为道具时,Android可能会表现得更好,而iOS则相反。

我相信对于导航,您正在使用反应导航库。 键盘回避视图不考虑标题高度。因此,您需要在偏移值中给出标题高度。

键盘垂直偏移量 = {标题高度 + 20}

">adjustResize">

活动的主窗口始终调整大小,以便为软窗口腾出空间 屏幕上的键盘。

">调整潘">

活动的主窗口不会调整大小以为软窗口腾出空间 键盘。相反,窗口的内容会自动平移 这样当前焦点就不会被键盘和用户遮挡 总能看到他们在打什么。这通常不太理想 比调整大小,因为用户可能需要关闭软键盘 进入窗口的遮挡部分并与之交互。

您的要求将像这样工作:

<activity android:windowSoftInputMode="adjustResize"> </activity>

您需要将其添加到活动代码中,并附上android:name=".MainActivity"

相关内容

最新更新