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

相关推荐
智塑未来5 分钟前
鸿蒙更智能:从“人找App”到“意图即服务”
华为·harmonyos
qizayaoshuap3 小时前
鸿蒙 ArkTS 实战:数据存储 Preferences 本地持久化(示例 95)
华为·harmonyos
木木子223 小时前
HarmonyOS NEXT 折叠面板与Step组件实战开发
华为·harmonyos
程序员黑豆5 小时前
鸿蒙应用开发:AppStorage 全局状态存储用法教程
前端·harmonyos
梦想不只是梦与想5 小时前
鸿蒙性能优化:启动速度
性能优化·harmonyos·启动速度
小雨青年6 小时前
【HarmonyOS 7开发者前瞻】10 HarmonyOS 7 真实项目适配路线图:API 26、AI / Agent 与多端改造优先级
人工智能·华为·harmonyos
aqi006 小时前
鸿蒙版本的小小机器人APP开放源码啦
人工智能·华为·harmonyos·鸿蒙·harmony
qizayaoshuap8 小时前
鸿蒙 ArkTS 实战:搜索列表 城市实时过滤(示例 94)
android·华为·harmonyos
木木子228 小时前
# HarmonyOS ArkTS 井字棋小游戏深度解析 —— 从零构建完整的三子棋对战应用
华为·harmonyos