image.png

当输入框在底部的时候, 唤起键盘会造成遮挡问题,解决方法如下:

    class ForumDetail extends React.Component {
    
        render(){
            let behavior = Platform.OS == 'ios' ? 'padding' : null 
    return (
      <KeyboardAvoidingView style={{ flex: 1 }} behavior={behavior} enabled>
        <SafeAreaView style={{ backgroundColor: '#fff', flex: 1 }} >
          <ScrollView
            style={{ flex: 1 }}
          >
           <Text>渲染的评论</Text>
          </ScrollView>
          <View style={[styles.write]}>
            <View style={[styles.inputBox,{paddingVertical: Platform.OS == 'ios' ? px2dp(16) : null}]}>
              <Image
                style={{ width: px2dp(34), height: px2dp(34), marginHorizontal: px2dp(8) }}
                source={write}
              />
              <TextInput allowFontScaling={false}
                value={this.state.comment}
                placeholder={'写下你的评论'}
                textAlignVertical = "center"
                multiline={true} 
                textAlign='left' 
                onChangeText={text => { this.setState({ comment: text }) }}
                // onContentSizeChange = {e => this.multilineChange(e)}
                style={{ fontSize: px2dp(22), width: "94%"}}></TextInput>
            </View>
            <Text style={styles.submit} onPress={() => { this.submitComment() }}>发表</Text>
          </View>
        </SafeAreaView>
      </KeyboardAvoidingView>

    );
        }
        
    }

发现在ios没有问题, 但是在android上有问题,查阅之后解决方法如下:
找到:项目目录androidappsrcmainAndroidManifest.xml
修改:

android:windowSoftInputMode="stateAlwaysHidden|adjustPan"

另外: ScrollView是必须的, 这样点击ScrollView所在区域,TextInput就是自动失去焦点,收起键盘。


xu57829812
28 声望0 粉丝

当我回首往事的时候,我希望我能说一句,我这一辈子我尽力了。