在Android上可见的React-native占位符方

时间:2018-05-17 21:42:29

标签: react-native textinput

我有一个以textinput为中心的问题,同时保持占位符可见。我希望文本从占位符开始(居中)开始。

在IOS上它正在工作,但在Android上它只是部分可见。

IOS的​​结果: IOS placeholder

关于android的结果: Android placeholder

这是我的代码:

render() {
return (
  <View style={styles.containerStyle}>
    <TextInput
      underlineColorAndroid='transparent'

      placeholder={"Placeholder    "}
      placeholderTextColor={"grey"}
      maxLength={6}
      style={{  fontSize: 30, color: "black",
        justifyContent: "center",  }}
      onChangeText={this.props.onChangeText}
      value={this.props.value.toUpperCase()}
    />
  </View>
);
  }
}

const styles = {
  containerStyle: {
    flexDirection: 'row',
    backgroundColor: "#fff",
    borderRadius: 5,
    borderWidth: 1,
    shadowColor: "#000",
    elevation: 2,
    marginLeft: 5,
    marginRight: 5,
    alignItems: 'center',
    justifyContent: "center"
  }
};

1 个答案:

答案 0 :(得分:2)

flex:1样式

中使用TextInput
<View style={styles.containerStyle}>
    <TextInput
      underlineColorAndroid='transparent'

      placeholder={"Placeholder    "}
      placeholderTextColor={"grey"}
      maxLength={6}
      style={{  flex:1, fontSize: 30, color: "black",
        justifyContent: "center",  }}
      onChangeText={this.props.onChangeText}
      value={this.props.value.toUpperCase()}
    />
  </View>