Reactjs 键盘AVOIDGVIEW未调整高度

Reactjs 键盘AVOIDGVIEW未调整高度,reactjs,react-native,layout,keyboard,jsx,Reactjs,React Native,Layout,Keyboard,Jsx,我试图让我的文本视图和按钮在键盘被调用时居中。 我试着用键盘AvoidingView包裹我的安全区域,但似乎不起作用。 我还尝试将KeyBoardAvoidingView行为设置为位置,但同样无效。 任何指导都将不胜感激 键盘AvoidingView似乎无法按预期工作 **发生了什么:** **这是我的密码:** <SafeAreaView style={{ flex: 1, backgroundColor: '#376772' }}> <KeyboardA

我试图让我的文本视图和按钮在键盘被调用时居中。 我试着用键盘AvoidingView包裹我的安全区域,但似乎不起作用。 我还尝试将KeyBoardAvoidingView行为设置为
位置
,但同样无效。 任何指导都将不胜感激

键盘AvoidingView似乎无法按预期工作

**发生了什么:**

**这是我的密码:**

<SafeAreaView style={{ flex: 1, backgroundColor: '#376772' }}>
        <KeyboardAvoidingView
            style={{ flex: 1 }}
            behavior={Platform.Os == 'ios' ? 'padding' : null}
        >
            <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
                <View style={{ flex: 1 }}>
                    <MapView
                        style={{ flex: 0.6 }}
                        showsMyLocationButton={true}
                        showsUserLocation={true}
                        followsUserLocation={lock}
                        onTouchStart={() => {
                            set(false)
                        }}
                        onPress={(loc) => {
                            setLocation(loc.nativeEvent.coordinate)
                        }}
                    >
                        <Marker coordinate={location} />
                    </MapView>
                    <Fragment>
                        <View
                            style={{
                                alignSelf: 'center',
                                alignContent: 'center',
                                backgroundColor: '#202B35',
                                padding: 10,
                                paddingHorizontal: 35,
                                margin: 5,
                                borderRadius: 5,
                                alignItems: 'center',
                                position: 'absolute',
                            }}
                        >
                            <View style={{ flexDirection: 'row' }}>
                                <Badge
                                    status="error"
                                    containerStyle={{ padding: 5 }}
                                />
                                <Text
                                    style={{
                                        color: '#fff',
                                        fontSize: 16,
                                        marginBottom: 5,
                                    }}
                                >
                                    New Crossing
                                </Text>
                                <Text
                                    style={{
                                        color: '#fff',
                                        fontSize: 10,
                                        padding: 5,
                                    }}
                                >
                                    (Tap to add)
                                </Text>
                            </View>

                            <View style={{ flexDirection: 'row' }}>
                                <Badge
                                    status="primary"
                                    containerStyle={{ padding: 5 }}
                                />
                                <Text
                                    style={{
                                        color: '#fff',
                                        fontSize: 16,
                                    }}
                                >
                                    {'Existing Crossings'}
                                </Text>
                            </View>
                        </View>
                    </Fragment>

                    <View
                        style={{
                            flex: 0.4,
                            backgroundColor: '#376772',
                            margin: 5,
                            borderRadius: 5,
                        }}
                    >
                        <Input
                            placeholder="Enter Crossing name here"
                            inputStyle={{ color: 'orange' }}
                            rightIcon={
                                <Icon
                                    name="edit"
                                    size={25}
                                    color="orange"
                                />
                            }
                            placeholderTextColor={'orange'}
                            errorStyle={{ color: 'red' }}
                        />

                        <Button
                            buttonStyle={{
                                margin: 10,
                                top: scale(10),
                                padding: 15,

                                backgroundColor: '#5cb85c',
                                borderRadius: 4,
                            }}
                            icon={
                                <Icon name="send" size={15} color="white" />
                            }
                            iconRight
                            titleStyle={{ fontWeight: 'bold' }}
                            title="Submit  "
                        />
                    </View>
                </View>
            </TouchableWithoutFeedback>
        </KeyboardAvoidingView>
    </SafeAreaView>

{
设置(假)
}}
onPress={(loc)=>{
设置位置(loc.nativeEvent.坐标)
}}
>
新交叉
(点击添加)
{“现有交叉口”}
通过从样式中删除flex:1,将行为设置为“position”对我来说很有效,例如

<KeyboardAvoidingView behavior="position">
  {children}
</KeyboardAvoidingView>

{儿童}

干杯

谢谢!,安全区域和键盘避免视图等级也必须交换