SwiftUI Modifier: deleteDisabled

In SwiftUI, modifiers allow you to customize the appearance and behavior of views. They provide a flexible way to modify existing views or create new ones. One useful modifier available in SwiftUI is deleteDisabled, which allows you to disable the delete functionality in a list or a collection view.

The deleteDisabled modifier is particularly helpful when you want to prevent users from deleting items from a list based on certain conditions. For example, you may want to disable the delete action for items that are marked as favorites or for items that are in a locked state. Let's explore how to use the deleteDisabled modifier with some examples.

Using deleteDisabled Modifier

The deleteDisabled modifier can be applied to a view representing an individual item in a list or a collection view. It takes a boolean value indicating whether the delete action should be disabled (true) or enabled (false). Here's the basic syntax for using the deleteDisabled modifier:

Copycopy code to clipboard
1.deleteDisabled(condition)

In the above code, condition is a boolean value that determines whether the delete action is enabled or disabled. If condition evaluates to true, the delete action will be disabled for the corresponding item. Conversely, if condition evaluates to false, the delete action will be enabled.

Let's look at a practical example. Suppose we have a list of items, and we want to disable the delete action for items that are marked as favorites. Here's how we can achieve that using the deleteDisabled modifier:

Copycopy code to clipboard
1struct Item: Identifiable {
2    let id: UUID
3    let name: String
4    var isFavorite: Bool
5}
6
7struct ItemListView: View {
8    @State private var items = [
9        Item(id: UUID(), name: "Item 1", isFavorite: true),
10        Item(id: UUID(), name: "Item 2", isFavorite: false),
11        Item(id: UUID(), name: "Item 3", isFavorite: true)
12    ]
13    
14    var body: some View {
15        List {
16            ForEach(items) { item in
17                Text(item.name)
18                    .deleteDisabled(item.isFavorite)
19            }
20            .onDelete(perform: delete)
21        }
22    }
23    
24    func delete(at offsets: IndexSet) {
25        items.remove(atOffsets: offsets)
26    }
27}

In the above example, we define a Item struct that represents individual items in our list. Each item has an isFavorite property that indicates whether it is marked as a favorite. In the ItemListView, we use the deleteDisabled modifier on the Text view representing each item, passing the isFavorite property as the condition. As a result, the delete action will be disabled for items that are marked as favorites.

You can customize the appearance and behavior of the disabled delete action using other modifiers, such as changing the color or the opacity. For example, you can use the .foregroundColor(.gray) modifier to make the text of the disabled item appear grayed out.

Copycopy code to clipboard
1Text(item.name)
2    .deleteDisabled(item.isFavorite)
3    .foregroundColor(item.isFavorite ? .gray : .primary)

By combining the deleteDisabled modifier with other modifiers, you can

create a visually appealing and interactive user interface for your app.

In Closing

The deleteDisabled modifier in SwiftUI provides an easy way to disable the delete functionality in a list or a collection view. By using this modifier, you can customize the behavior of your views based on certain conditions, such as marking items as favorites or locking them. This allows you to create a more intuitive and user-friendly experience for your app users.

I recently wrote another post about adding swipe to delete to your SwiftUI List, if you're interested you can also check that out here!.