当键盘出现时,有什么特别的事情可以让视图向上滑动吗?根据我看到的所有示例,默认情况下它会这样做,但在我这边,它直接从 A 点到 B 点。
这是我的渲染,其中 FadeInView 只是一个 Animated.View:
<FadeInView style={{ flex: 1 }}>
<KeyboardAvoidingView
style={s.container}
contentContainerStyle={{alignItems: 'center'}}
behavior="position"
keyboardVerticalOffset={-80}
>
<View style={{
width: 100, height: 100, borderWidth: 1,
borderColor: '#E0E0E0', marginBottom: 30,
}} />
<Item>
<Input
placeholder={t('login:username')}
onChangeText={(username) => { username = username.trim(); return this.setState({ username }); }} />
</Item>
<Item style={{ marginBottom: 10 }}>
<Input
secureTextEntry={true}
placeholder={t('login:password')}
onChangeText={(password) => { password = password.trim(); return this.setState({ password }); }} />
</Item>
{isFetching ?
<TouchableOpacity
disabled={true}
style={cs.button}
onPress={() => this.onLogin()}>
<Text>{t('common:loading').toUpperCase()}</Text>
</TouchableOpacity>
:
<TouchableOpacity
activeOpacity={0.7}
style={cs.button}
onPress={() => this.onLogin()}>
<Text style={cs.buttonText}>{t('login:login').toUpperCase()}</Text>
</TouchableOpacity>
}
{errorMessage != null &&
<Text style={cs.errorMessage}>{errorMessage}</Text>
}
</KeyboardAvoidingView>
</FadeInView>
和容器样式:
const s = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
paddingTop: 50,
paddingRight: 20,
paddingLeft: 20,
},
});
对不起,大代码,但我对这个问题有点绝望......谢谢!