MaterialUIKit
Github
  • MaterialUIKit
  • Essentials
    • Configuring and Personalizing
    • Defining a Custom Color Schemes
  • Configuration and Color Schemes
    • MUIKitConfiguration
    • MUIKitColorScheme
  • Components
    • Action Button
      • ActionButtonStyle
    • Checkbox
    • Collection
      • CollectionStyle
    • Container
    • Date Selector
    • Dialog
    • Dialog Sheet
    • Dropdown Menu
      • Dropdown Menu Label
    • FAB
    • Icon Button
      • IconButtonStyle
    • Navigation Container
      • NavigationContainerHeaderStyle
      • Navigation Route
      • Navigation Route Label
    • Progress Bar
    • Radio Buttons Group
    • Search Box
    • Secure Text Box
    • Segmented Buttons
    • Separator
      • SeparatorOrientationStyle
    • Snackbar
    • Switch
    • Time Selector
    • Text Box
    • Tab Bar
      • TabBar Item
Powered by GitBook
On this page
  • Overview
  • Initializers
  • Parameters
  • Example
  1. Components

Collection

Represents a Material UI styled collection of items arranged in a grid or list.

Overview

The Collection provides a stylized list view in Material Design styles, including plain, inset, and inset grouped.

To use the Collection, initialize it with your desired style and a closure that returns the content view for each element in the list.

Initializers

Creates a stylized collection with a default CollectionStyle.insetGrouped style.

Collection(@ViewBuilder content: () -> Content)

Creates a stylized collection with a custom collection style.

Collection(style: CollectionStyle, @ViewBuilder _ content: () -> Content)

For detailed descriptions of the available collection styles, refer to the CollectionStyle.

Parameters

Parameter

Description

style

The style of the collection, such as .plain, .inset, or .insetGrouped.

content

A closure that returns the content view for each element in the list. This parameter is used in both initializers.

Example

Displays a vertical stack of a item with a default CollectionStyle.insetGrouped style.

Container {
    Collection {
        Text("Item 1")
        Text("Item 2")
        Text("Item 3")
    }
}

Displays a vertical stack of items with a custom collection style.

Container {
    Collection(style: .inset) {
        Text("Item 1")
        Text("Item 2")
        Text("Item 3")
    }
}
PreviousCheckboxNextCollectionStyle

Last updated 10 months ago