Componente View

View es una caja invisible que agrupa y posiciona otros elementos en la pantalla. Por sí solo no muestra nada — piénsalo como un estante que sostiene y organiza tu contenido.

<View style={styles.container}>
  <Text>Dentro de un View</Text>
</View>

View vs. div

Si conoces HTML, piensa en View como el equivalente de <div> en React Native. Pero hay diferencias importantes:

HTML <div>	React Native <View>
Usa CSS para el diseño	Usa Flexbox por defecto
Diseño de bloque por defecto	Flex en columna por defecto
Renderiza texto directamente	No admite texto sin <Text>

Importante: No puedes poner texto directamente dentro de un View — siempre envuélvelo en un componente <Text>.

// Esto va a tronar
<View>Hola</View>

// Esto sí funciona
<View><Text>Hola</Text></View>

Anidar Views

Construye diseños complejos anidando Views unos dentro de otros:

<View style={{ flex: 1 }}>
  <View style={{ flexDirection: "row", justifyContent: "space-between" }}>
    <Text>Izquierda</Text>
    <Text>Derecha</Text>
  </View>
  <View style={{ flex: 1, alignItems: "center" }}>
    <Text>Contenido centrado</Text>
  </View>
</View>

Intenta esto: Crea un diseño con una fila de encabezado en la parte superior y contenido centrado abajo, usando Views anidados.