Reaccionar el radio del borde nativo con el color de fondo

En React Native, borderRadius está funcionando, pero el color de fondo que se le da al botón sigue siendo un cuadrado. ¿Que esta pasando aqui?

JS

<TouchableHighlight
  style={styles.submit}
  onPress={() => this.submitSuggestion(this.props)}
  underlayColor='#fff'>
    <Text style={[this.getFontSize(),styles.submitText]}>Submit</Text>
</TouchableHighlight>

Estilo

...
submit:{
    marginRight:40,
    marginLeft:40,
    marginTop:10,
},
submitText:{
    paddingTop:20,
    paddingBottom:20,
    color:'#fff',
    textAlign:'center',
    backgroundColor:'#68a0cf',
    borderRadius: 10,
    borderWidth: 1,
    borderColor: '#fff'
},
...

Intente mover el estilo del botón al TouchableHighlightmismo:

Estilos:

  submit:{
    marginRight:40,
    marginLeft:40,
    marginTop:10,
    paddingTop:20,
    paddingBottom:20,
    backgroundColor:'#68a0cf',
    borderRadius:10,
    borderWidth: 1,
    borderColor: '#fff'
  },
  submitText:{
      color:'#fff',
      textAlign:'center',
  }

Botón (mismo):

<TouchableHighlight
  style={styles.submit}
  onPress={() => this.submitSuggestion(this.props)}
  underlayColor='#fff'>
    <Text style={[this.getFontSize(),styles.submitText]}>Submit</Text>
</TouchableHighlight>

Debes agregar overflow: hiddena tus estilos:

Js:

<Button style={styles.submit}>Submit</Button>

Estilos:

submit {
   backgroundColor: '#68a0cf';
   overflow: 'hidden';
}

Nunca le dé borderRadius a su <Text />siempre envuelva eso <Text />dentro de su <View />o en su<TouchableOpacity/> .

borderRadius on <Text />funcionará perfectamente en dispositivos Android. Pero en los dispositivos IOS no funcionará.

Así que tenga esto en su práctica para envolver su <Text/>interior de su <View/>o en <TouchableOpacity/>y después dar el borderRadius a que <View />o<TouchableOpacity /> por lo que va a trabajar tanto en Android, así como en los dispositivos IOS.

Por ejemplo:-

<TouchableOpacity style={{borderRadius: 15}}>
   <Text>Button Text</Text>
</TouchableOpacity>

-Gracias

Aplicar la siguiente línea de código:

<TextInput
  style={{ height: 40, width: "95%", borderColor: 'gray', borderWidth: 2, borderRadius: 20,  marginBottom: 20, fontSize: 18, backgroundColor: '#68a0cf' }}
  // Adding hint in TextInput using Placeholder option.
  placeholder=" Enter Your First Name"
  // Making the Under line Transparent.
  underlineColorAndroid="transparent"
/>