鸿蒙键盘遮挡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;

相关推荐
xq952712 分钟前
编程之路 2025年终总结 ,勇往直前 再战江湖
harmonyos
不爱吃糖的程序媛1 小时前
鸿蒙PC命令行开发 macOS 上解决 pkg-config 命令未安装的问题
macos·华为·harmonyos
二流小码农3 小时前
鸿蒙开发:自定义一个圆形动画菜单
android·ios·harmonyos
不爱吃糖的程序媛3 小时前
解决鸿蒙PC命令行编译 macOS 上 cp 命令参数冲突问题
macos·harmonyos·策略模式
不爱吃糖的程序媛3 小时前
OpenHarmony PC 第三方 C/C++ 库适配完整指南
c语言·c++·harmonyos
不爱吃糖的程序媛4 小时前
OpenHarmony Linux 环境 SDK 使用说明(进阶--依赖库的解决方法)
linux·运维·harmonyos
狮子也疯狂4 小时前
【生态互联】| 鸿蒙三方库的选择与适配策略
华为·harmonyos
不爱吃糖的程序媛4 小时前
鸿蒙Lycium 交叉编译框架完全指南
华为·harmonyos
人间打气筒(Ada)4 小时前
[鸿蒙2025领航者闯关]星盾护航支付安全:鸿蒙6.0在金融APP中的实战闯关记
安全·金融·harmonyos·#鸿蒙2025领航者闯关#·#鸿蒙6实战#·#开发者年度总结#
hh.h.4 小时前
灰度发布与A/B测试:Flutter+鸿蒙的分布式全量发布方案
分布式·flutter·harmonyos