View Source Section

<Section>

Groups elements in a container.

Overview

Use a section to group together elements in <List>, <Picker>, and other container elements.

<Section>
    <Text>Item #1</Text>
    ...
</Section>
<Section>
    <Text>Item #1</Text>
    ...
</Section>

Add a header and footer to customize sections.

<Section>
    <Text template={:header}>Group #1</Text>
    <Text template={:content}>Item #1</Text>
    <Text template={:footer}>The first group ends here</Text>
</Section>
<Section>
    <Text template={:header}>Group #2</Text>
    <Text template={:content}>Item #1</Text>
    <Text template={:footer}>The second group ends here</Text>
</Section>

On macOS, ListStyle/sidebar can have collapsible sections. Use the collapsible attribute to make a section collapsible.

<Section collapsible>
    ...
</Section>

Attributes

Children

  • content - The main body of the section.
  • header - Describes the content of the section.
  • footer - Elements displayed at the end of the section.

SwiftUI Documentation

See SwiftUI.Section for more details on this View.

References

Enables this section to be collapsed in sidebar lists on macOS.