VStack

import { Host, VStack, Text } from '@expo/ui/swift-ui';

export default function BasicVStackExample() {
  // Give the host a size when the stack needs room to align its children.
  return (
    <Host style={{ flex: 1 }}>
      <VStack spacing={12}>
        <Text>First</Text>
        <Text>Second</Text>
        <Text>Third</Text>
      </VStack>
    </Host>
  );
}

import { Host, VStack, Rectangle } from '@expo/ui/swift-ui';
import { frame } from '@expo/ui/swift-ui/modifiers';

export default function VStackAlignmentExample() {
  return (
    <Host style={{ flex: 1 }}>
      <VStack spacing={12} alignment="leading">
        <Rectangle modifiers={[frame({ width: 50, height: 50 })]} />
        <Rectangle
          modifiers={[frame({ width: 100, height: 50 })]}
        />
        <Rectangle modifiers={[frame({ width: 75, height: 50 })]} />
      </VStack>
    </Host>
  );
}

import { VStack } from '@expo/ui/swift-ui';