Group

Expo UI Group matches the official SwiftUI Group API and groups views together without introducing additional layout structure.

Usage

Basic group

Groups are useful for applying modifiers to multiple views at once or organizing views without affecting layout.

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

export default function BasicGroupExample() {
  return (
    <Host matchContents style={{ alignSelf: 'center' }}>
      <VStack spacing={8}>
        <Group modifiers={[foregroundStyle('blue')]}>
          <Text>First item</Text>
          <Text>Second item</Text>
          <Text>Third item</Text>
        </Group>
      </VStack>
    </Host>
  );
}

API

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

Component

`Group`

Type: React.Element<GroupProps>

GroupProps

`children`

Type: ReactNode

Inherited props

CommonViewModifierProps

Modifiers

Use these modifiers in the modifiers prop of the SwiftUI version.

Modifiers for any view

Sources

The original Expo docs for this page:

Group (SwiftUI) (source-of-truth/versions/v57.0.0/sdk/ui/swift-ui/group.md)

On this page