鸿蒙键盘遮挡react native内容尝试

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;

相关推荐
全堆鸿蒙10 小时前
27 RdbPredicates 条件查询详解:EqualTo、OrderBy、组合条件
华为·harmonyos·鸿蒙系统
心中有国也有家10 小时前
AtomGit Flutter 鸿蒙客户端: ChangeNotifier 模式
学习·flutter·华为·harmonyos
国服第二切图仔11 小时前
HarmonyOS APP《画伴梦工厂》开发第59篇-碰一碰精准分享——跨设备素材插入
华为·harmonyos
hqzing11 小时前
在鸿蒙 PC 上使用 Claude Code(最新的 Bun 版本)
华为·harmonyos
xd18557855512 小时前
鸿蒙AI菜谱生成器:基于ArkTS原生开发与鸿蒙PC适配实战
人工智能·华为·harmonyos·鸿蒙
GitCode官方13 小时前
开源鸿蒙跨平台直播|QRN 跨端鸿蒙一体化实战
人工智能·华为·开源·harmonyos·atomgit
ZZZMMM.zip14 小时前
演示架构师-PPT大纲生成的HarmonyOS开发实践
人工智能·华为·powerpoint·harmonyos·鸿蒙·鸿蒙系统
国服第二切图仔14 小时前
HarmonyOS APP《画伴梦工厂》开发第60篇-分布式软总线2.0——多设备协同新范式
分布式·wpf·harmonyos
2501_9185823715 小时前
50 Canvas 动画:@State + @Watch + animateTo 驱动模式
华为·harmonyos·鸿蒙系统
xianjixiance_15 小时前
43 短距通信场景汇总:NFC / 二维码 / 剪贴板 / 超级终端
华为·harmonyos·鸿蒙系统