无法覆盖react-native的TextInput默认填充

Question

我有以下TextInput：

  _renderTextInput() {
    return (
      <TextInput
        onChangeText={TextInput => this.setState({TextInput})}
        style={{flex: 1, backgroundColor: "maroon", paddingVertical: 0}}
        autoFocus={true}
        multiline={true}
        underlineColorAndroid="transparent"
        returnKeyType="go"
      />
    )
  }

  render() {
    return(
      <View style={{flex: 1, backgroundColor: "#E0E0E0", paddingVertical: 0}}>
        {this._renderTextInput()}
      </View>
    )
  }

我想要实现的是一个全屏无干扰区域，供用户输入他的帖子。

我确信这是一个填充问题，但无论我尝试什么，我根本无法覆盖它。我试过了padding:0 paddingTop:0 paddingVertical: 0似乎无法正常工作......

预览：

Answer 1

经过漫长的一天无休止的 g-o-o-g-l-i-n-g 后，我发现了导致不必要填充的原因。它看起来像默认情况下，TextInput的文本垂直居中，因此为什么一切都在中间。要覆盖它，只需添加：

textAlignVertical: 'top'到TextInput的样式，你就完成了。 ：）

@ matt-aft关于改变文字风格的评论有助于解决这个问题。

Answer 2

Flex不会在这里工作，因为你还有其他组件也使用flex，因此屏幕正在被分割。使用设备的高度和宽度应该可以工作，或者使用带有测试输入的模态也可以工作。

const {height, width} = Dimensions.get('window');

style={{ height, width, backgroundColor: "maroon", paddingVertical: 0}}

Answer 3

如果有人在使用输入时寻找解决方案，请将其多线属性设置为true。

多= {TRUE}

Answer 4

       <TextInput multiline={true}
          underlineColorAndroid='transparent'
          style={styles.input}
          onChangeText={(text) => this.setState({ text })}
          value={this.state.text}
          placeholder={this.props.navigation.state.params.screen}
          placeholderTextColor={colors.light_grayc}
          textAlignVertical='top'
          paddingRight={12}
          paddingLeft={12}
        />