El componente reactivo del text nativo no se centrará dentro de un componente de vista.

Hola, creo que esto debería ser simple, pero no puedo hacer que funcione. Parece que no importa lo que haga, no puedo hacer que el componente de text se centre horizontalmente dentro de la vista. He intentado usar alignItems: center, justifyContent: center, alignSelf: center, textAlign: center … nada funciona. Puedo hacer que se centre verticalmente, pero no horizontalmente. Whyyyyy querido señor?

<Animated.View style={[styles.titleContainer]}> <Text style={styles.title}>App logo here</Text> </Animated.View> 

¿Cómo puedo hacer que el text se centre vertical y horizontalmente?

Aquí está mi CSS:

 titleContainer: { flex: 1, marginTop:30, marginBottom:30, justifyContent:'center' }, title:{ color:'white', textAlign:'center', alignSelf:'center' }, 

Este es mi resultado:

introduzca la descripción de la imagen aquí

Prueba esto … Aquí hay una demo de trabajo

  container: { flex: 1, marginTop: 30, marginBottom: 30, justifyContent: 'center', backgroundColor: '#fff', }, title: { fontSize: 28, textAlign: 'center', },