import React, { useState } from 'react';
import { View, TextInput, Button, KeyboardAvoidingView, Platform, StyleSheet } from 'react-native';
const FormScreen = () => {
const [text, setText] = useState('');
return (
<KeyboardAvoidingView
behavior={Platform.OS === 'ios' ? 'padding' : 'position'} // iOS 用 padding,Android 用 position
keyboardVerticalOffset={Platform.OS === 'ios' ? 60 : 0} // iOS 中补偿导航栏高度
style={styles.container}
>
<View style={styles.innerContainer}>
<TextInput
placeholder="请输入内容"
value={text}
onChangeText={setText}
style={styles.input}
/>
<Button
title="提交"
onPress={() => console.log('提交内容:', text)}
/>
</View>
</KeyboardAvoidingView>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
},
innerContainer: {
flex: 1,
justifyContent: 'center',
padding: 20,
},
input: {
height: 40,
borderColor: '#ccc',
borderWidth: 1,
marginBottom: 20,
padding: 10,
},
});
export default FormScreen;