Contents

reorderContainer(for:itemID:isEnabled:move:)

Defines a container of reorderable views, with a type and keypath you specify to identify items.

Declaration

nonisolated func reorderContainer<Item, ItemID>(for item: Item.Type, itemID: KeyPath<Item, ItemID>, isEnabled: Bool = true, move: @escaping (ReorderDifference<ItemID, ReorderableSingleCollectionIdentifier>) -> ()) -> some View where ItemID : Hashable, ItemID : Sendable

Parameters

  • item:

    The type of reorderable items in the container.

  • itemID:

    A keypath to the identifier used to represent this item.

  • isEnabled:

    Whether the container allows reordering.

  • move:

    A closure that provides the change at the end of a session.

Discussion

Declare this modifier on your list, stack, grid, or custom layout to define a reorderable container. Then, apply reorderable() to the content of your container to make those views reorderable.

Use this overload if your container only has one collection within it. If you have multiple collections of reorderable views and you need to provide the type and keypath you use to identify items, use reorderContainer(for:itemID:in:isEnabled:move:) instead and provide a type for collection identifiers.

A person can lift a reorderable view within the container using a drag gesture. As they lift the item, the system puts a placeholder view in its place to indicate where the view can drop. As they move the item through the container, the position of the placeholder updates to reflect which view the person drags over. When they drop the view, the system calls the move closure and provides the change.

The system provides the change as a different to the closure. The difference contains the identifiers of items to move, in the order that the person selected them. It also contains a destination value, which indicates where to insert the item or items.

The following example shows a list of landmark views that a person can move to reorder inside the List:

struct ContentView: View {
    @State private var landmarks: [Landmark] = []
    @State private var selection = Set<Landmark.ID>()

    var body: some View {
        List(selection: $selection) {
            ForEach(landmarks, id: \.location) { landmark in
                LandmarkView(landmark)
            }
            .reorderable()
        }
        .reorderContainer(for: Landmark.self, id: \.location) {
            (difference) in
            apply(difference: difference)
        }
    }
}

See Also

Reordering items