Usando o React nativo 0,26,

Meu componente é algo como isto

const Search = () => {
    return (
      <View style={styles.backgroundImage}>
        <TextInput style={styles.textInput} onChangeText={(text) => console.log(text)} placeholder={"Enter Search Term"}/>
      </View>
    )
}

E meus estilos:

const styles = StyleSheet.create({
  backgroundImage: {
    flex : 1,
    flexDirection: "column",
    justifyContent: 'center',
    alignItems: 'center'
  },
  textInput: {
    justifyContent: "center",
    alignItems: "stretch",
    borderRightWidth: 30,
    borderLeftWidth: 30,
    height: 50,
    borderColor: "#FFFFFF",
  }
})

Os problemas que estou enfrentando são

A largura direita da borda e a esquerda não parecem ter efeito e o texto do espaço reservado começa na borda esquerda.O plano de fundo do TextInput é "cinza", igual ao plano de fundo da exibição. Eu esperava que fosse branco por padrão (parece transparente).Com o simulador iOS, como abrir o teclado, eu gostaria de definirreturnKeyType e veja a aparência do teclado (e tenha algum código emonSubmitEditing e teste).

Captura de tela abaixo: