fix(keyboard): Android keyboard covers input — use react-native-keyboard-controller
Bug: 3 Stellen hatten `behavior={Platform.OS === 'ios' ? 'padding' : undefined}`.
Auf Android = `undefined` = KeyboardAvoidingView macht NICHTS → Input wird von
Tastatur verdeckt (chat-input, profile-edit-nickname, room-chat).
Fix: switch zu react-native-keyboard-controller's KeyboardAvoidingView mit
behavior='padding' für beide Plattformen. Funktioniert sauber cross-platform
weil KeyboardProvider schon im root-layout sitzt.
Affected Files:
- components/KeyboardAwareScreen.tsx (used by profile-edit + auth-screens)
- app/dm.tsx (DM chat)
- app/room.tsx (room chat)
lyra.tsx war bereits OK (`'height'` für Android — kein Fix nötig).
iOS-Verhalten unverändert.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
c9273a2770
commit
77bb7b84dc
@ -4,12 +4,12 @@ import {
|
|||||||
Text,
|
Text,
|
||||||
FlatList,
|
FlatList,
|
||||||
TouchableOpacity,
|
TouchableOpacity,
|
||||||
KeyboardAvoidingView,
|
|
||||||
Platform,
|
Platform,
|
||||||
ActivityIndicator,
|
ActivityIndicator,
|
||||||
Image,
|
Image,
|
||||||
StyleSheet,
|
StyleSheet,
|
||||||
} from 'react-native';
|
} from 'react-native';
|
||||||
|
import { KeyboardAvoidingView } from 'react-native-keyboard-controller';
|
||||||
import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
|
import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||||
import { useRouter, useLocalSearchParams } from 'expo-router';
|
import { useRouter, useLocalSearchParams } from 'expo-router';
|
||||||
import { Ionicons } from '@expo/vector-icons';
|
import { Ionicons } from '@expo/vector-icons';
|
||||||
@ -275,7 +275,7 @@ export default function DmScreen() {
|
|||||||
|
|
||||||
<KeyboardAvoidingView
|
<KeyboardAvoidingView
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
|
behavior="padding"
|
||||||
keyboardVerticalOffset={0}
|
keyboardVerticalOffset={0}
|
||||||
>
|
>
|
||||||
<View style={{ flex: 1, backgroundColor: chatBg }}>
|
<View style={{ flex: 1, backgroundColor: chatBg }}>
|
||||||
|
|||||||
@ -9,12 +9,12 @@ import {
|
|||||||
Modal,
|
Modal,
|
||||||
TextInput,
|
TextInput,
|
||||||
ActivityIndicator,
|
ActivityIndicator,
|
||||||
KeyboardAvoidingView,
|
|
||||||
Platform,
|
Platform,
|
||||||
Alert,
|
Alert,
|
||||||
StyleSheet,
|
StyleSheet,
|
||||||
ScrollView,
|
ScrollView,
|
||||||
} from 'react-native';
|
} from 'react-native';
|
||||||
|
import { KeyboardAvoidingView } from 'react-native-keyboard-controller';
|
||||||
import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
|
import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||||
import { useRouter, useLocalSearchParams } from 'expo-router';
|
import { useRouter, useLocalSearchParams } from 'expo-router';
|
||||||
import { Ionicons } from '@expo/vector-icons';
|
import { Ionicons } from '@expo/vector-icons';
|
||||||
@ -360,7 +360,7 @@ export default function RoomScreen() {
|
|||||||
) : (
|
) : (
|
||||||
<KeyboardAvoidingView
|
<KeyboardAvoidingView
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
|
behavior="padding"
|
||||||
>
|
>
|
||||||
<FlatList
|
<FlatList
|
||||||
ref={flatRef}
|
ref={flatRef}
|
||||||
|
|||||||
@ -1,7 +1,6 @@
|
|||||||
import { ReactNode } from 'react';
|
import { ReactNode } from 'react';
|
||||||
import {
|
import {
|
||||||
Keyboard,
|
Keyboard,
|
||||||
KeyboardAvoidingView,
|
|
||||||
Platform,
|
Platform,
|
||||||
ScrollView,
|
ScrollView,
|
||||||
StyleProp,
|
StyleProp,
|
||||||
@ -9,6 +8,7 @@ import {
|
|||||||
View,
|
View,
|
||||||
ViewStyle,
|
ViewStyle,
|
||||||
} from 'react-native';
|
} from 'react-native';
|
||||||
|
import { KeyboardAvoidingView } from 'react-native-keyboard-controller';
|
||||||
|
|
||||||
export interface KeyboardAwareScreenProps {
|
export interface KeyboardAwareScreenProps {
|
||||||
children: ReactNode;
|
children: ReactNode;
|
||||||
@ -42,7 +42,7 @@ export function KeyboardAwareScreen({
|
|||||||
return (
|
return (
|
||||||
<KeyboardAvoidingView
|
<KeyboardAvoidingView
|
||||||
style={[{ flex: 1 }, style]}
|
style={[{ flex: 1 }, style]}
|
||||||
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
|
behavior="padding"
|
||||||
keyboardVerticalOffset={headerOffset}
|
keyboardVerticalOffset={headerOffset}
|
||||||
>
|
>
|
||||||
{scrollable ? (
|
{scrollable ? (
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user