<KeyboardAvoidingView
 behavior="padding"
 style={{ marginBottom: Platform.OS === "ios" ? tabBarHeight : 0 }}>
 {/* content */}
</KeyboardAvoidingView>

System:
 OS: macOS 15.7.1
 CPU: (10) arm64 Apple M4
 Memory: 144.44 MB / 16.00 GB
 Shell:
 version: "5.9"
 path: /bin/zsh
Binaries:
 Node:
 version: 25.2.1
 Yarn: Not Found
 npm:
 version: 11.6.2
 Watchman:
 version: 2025年10月27日.00
 path: /opt/homebrew/bin/watchman
Managers:
 CocoaPods:
 version: 1.16.2
 path: /opt/homebrew/bin/pod
SDKs:
 iOS SDK:
 Platforms:
 - DriverKit 25.2
 - iOS 26.2
 - macOS 26.2
 - tvOS 26.2
 - visionOS 26.2
 - watchOS 26.2
 Android SDK: Not Found
IDEs:
 Android Studio: 2025.2 AI-252.25557.131.2521.14344949
 Xcode:
 version: 26.2/17C52
 path: /usr/bin/xcodebuild
Languages:
 Java:
 version: 17.0.17
 path: /usr/bin/javac
 Ruby:
 version: 2.6.10
 path: /usr/bin/ruby
npmPackages:
 "@react-native-community/cli":
 installed: 20.1.2
 wanted: latest
 react:
 installed: 19.1.0
 wanted: 19.1.0
 react-native:
 installed: 0.81.5
 wanted: 0.81.5
 react-native-macos: Not Found
npmGlobalPackages:
 "*react-native*": Not Found
Android:
 hermesEnabled: true
 newArchEnabled: true
iOS:
 hermesEnabled: true
 newArchEnabled: true

import React from 'react';
import {
 KeyboardAvoidingView,
 Platform,
 TextInput,
 View,
 StyleSheet,
 Text,
} from 'react-native';
import { createNativeBottomTabNavigator } from 'react-native-bottom-tabs';
import { NavigationContainer } from '@react-navigation/native';
import { useBottomTabBarHeight } from 'react-native-bottom-tabs';
const Tab = createNativeBottomTabNavigator();
function HomeScreen() {
 const tabBarHeight = useBottomTabBarHeight();
 return (
 <KeyboardAvoidingView
 behavior="padding"
 style={styles.container}
 // Workaround: Uncomment the line below to fix the issue
 // style={{ flex: 1, marginBottom: Platform.OS === 'ios' ? tabBarHeight : 0 }}
 >
 <View style={styles.content}>
 <Text style={styles.title}>KeyboardAvoidingView + Bottom Tabs Bug</Text>
 <View style={styles.spacer} />
 <TextInput
 style={styles.input}
 placeholder="Tap here to open keyboard"
 placeholderTextColor="#999"
 />
 </View>
 </KeyboardAvoidingView>
 );
}
function SettingsScreen() {
 return (
 <View style={styles.container}>
 <Text>Settings</Text>
 </View>
 );
}
export default function App() {
 return (
 <NavigationContainer>
 <Tab.Navigator>
 <Tab.Screen
 name="Home"
 component={HomeScreen}
 options={{
 tabBarIcon: () => require('./assets/home-icon.png'),
 }}
 />
 <Tab.Screen
 name="Settings"
 component={SettingsScreen}
 options={{
 tabBarIcon: () => require('./assets/settings-icon.png'),
 }}
 />
 </Tab.Navigator>
 </NavigationContainer>
 );
}
const styles = StyleSheet.create({
 container: {
 backgroundColor: '#fff',
 },
 content: {
 flex: 1,
 padding: 20,
 justifyContent: 'flex-end',
 },
 title: {
 fontSize: 20,
 fontWeight: 'bold',
 marginBottom: 10,
 },
 spacer: {
 flex: 1,
 },
 input: {
 borderWidth: 1,
 borderColor: '#ccc',
 borderRadius: 8,
 padding: 15,
 fontSize: 16,
 },
});