DisclosureGroup

A SwiftUI DisclosureGroup component for displaying expandable content.

iOS

Recommended version:

~55.0.17

Expo UI DisclosureGroup matches the official SwiftUI DisclosureGroup API and displays a disclosure indicator that reveals or hides content.

Installation

Terminal

- npx expo install @expo/ui

- yarn expo install @expo/ui

- pnpm expo install @expo/ui

- bun expo install @expo/ui

If you are installing this in an existing React Native app, make sure to install expo in your project.

Usage

Basic disclosure group

BasicDisclosureGroupExample.tsx

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

export default function BasicDisclosureGroupExample() {
  return (
    <Host matchContents>
      <DisclosureGroup label="More Information">
        <Text>This content is revealed when the disclosure group is expanded.</Text>
      </DisclosureGroup>
    </Host>
  );
}

Initially expanded

Set isExpanded to true initially to show the content by default.

InitiallyExpandedExample.tsx

import { useState } from 'react';
import { Host, DisclosureGroup, Text } from '@expo/ui/swift-ui';

export default function InitiallyExpandedExample() {
  const [isExpanded, setIsExpanded] = useState(true);

  return (
    <Host matchContents>
      <DisclosureGroup label="Details" isExpanded={isExpanded} onIsExpandedChange={setIsExpanded}>
        <Text>This content is visible by default.</Text>
      </DisclosureGroup>
    </Host>
  );
}

API

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

No API data file found, sorry!