鸿蒙键盘遮挡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 小时前
鸿蒙Divider 分割线组件完全指南:内容分组、视觉分区与自定义样式
华为·harmonyos
贾伟康11 小时前
【知律|18】HarmonyOS ArkTS 权限与隐私实战:让 module.json5、功能说明和拒绝路径一致
harmonyos·arkts·隐私合规·appgallery·应用权限
Kevin Coding1 天前
JsonConvert:适用于 Android、鸿蒙与 Flutter 的 JSON 转 Model 插件
android·flutter·harmonyos
m0_749690231 天前
【寻迹校园 HarmonyOS NEXT 实战 28】不交换手机号也能交接:固定校内交接点的隐私设计
华为·harmonyos·arkts·产品设计·隐私设计·安全交接
Magic-ZYJ1 天前
HarmonyOS Stage 模型实战:UIAbility 生命周期如何驱动页面安全状态
安全·华为·harmonyos·鸿蒙·移动端开发·独立开发者·心晴手记
贾伟康1 天前
【中国方言题库|09】HarmonyOS ArkTS 方言搜索实战:实现词语检索和无结果反馈
harmonyos·arkts·状态管理·arkui·本地搜索
光影少年1 天前
react navite 内存泄漏:定时器、监听事件、订阅销毁
前端·javascript·react native·react.js·前端框架
Dovis(誓平步青云)1 天前
从手机单栏到平板分栏:任务清单的筛选、选中态与不可变更新
华为·harmonyos
梦想不只是梦与想1 天前
鸿蒙 AppGallery Connect:查看应用信息(三)
harmonyos·appgallery·client id·app id·developer id
贾伟康1 天前
【中国方言题库|03】HarmonyOS ArkTS 四川话分库实战:复用题库组件并保持地区参数清晰
harmonyos·arkts·arkui·路由传参·组件复用