Question

有人可以帮助我解决这个问题吗？实际上，我是React Native的新手，我已经尝试了几种方法来解决此问题，但是没有任何解决方法，请帮我解决这个问题，我不想让键盘干扰覆盖层

            <View style={{height:"9%"}}>

                <Button title="Add A New ToDO" onPress={this.onPressOpenOverLay}  buttonStyle={{height:"100%",borderBottomLeftRadius:30,borderBottomRightRadius:30}}/>

                <Overlay isVisible={this.state.setVisible} 
                onBackdropPress={this.onPressCloseOverLay} 
                animationType="fade" 
                overlayStyle={{height:"70%",width:"90%",borderRadius:20,alignItems:"center",paddingTop:"15%"}}>

                        <Text style={{fontSize:19,color:"#0288D1",fontWeight:"bold"}}>Add A New ToDo</Text>

                        <TextInput style={styles.input} 
                            placeholder="Email ID"
                            autoCapitalize="none" 
                            underlineColorAndroid="transparent"
                            onChangeText={email => this.setState({ email })}
                            value={this.state.email}
                            >

                        </TextInput>

                </Overlay>


            </View>

            <FlatList

                style={{marginTop:"2%"}}
                data={this.state.data}
                renderItem={this._renderMyList}
               keyExtractor={(item, index) => index.toString()}
               bounces={true}

            />

            </SafeAreaView>
    )
}

}

Answer 1

如果您用百分比设置宽度或高度，那么当UI布局发生某些变化（如出现键盘）时，它很容易发生变化。因此您需要给他们像素值。此外，您可以使用import {Dimension} from 'react-native'为您提供设备的宽度和高度，然后计算这些值的百分比并将其提供给视图。

使用键盘避免在叠加中查看的问题

1 个答案: