Context Menu Destructive Actions, SwiftUI

Question

Created Oct ’20

Replies 7

Boosts 0

Views 3.6k

Participants 5

I'm trying to add a delete action in a context menu, however it just gets displayed as the default black color. The Photos app uses a red color for its delete action as well. I've seen in some spaces online that this is not a functionality currently provided of contextMenu, however I have also seen it used in third party apps in the wild from developers such as Steve Troughton-Smith in his Broadcast app (It's not letting me link to his tweet, however he has a video showing a red item in a context menu). Does anyone know how to accomplish this?

Also, looking on Apple's documentation for contextMenu it says that they have been deprecated for everything except for macOS. I find it strange that they deprecated it just one year after introducing it. Was this replaced by another component that I should be using?

Code Block Swiftvar body: some View {
        ScrollView {
            LazyVGrid(columns: columns, spacing: 20) {
                ForEach(photos) { photo in
                    Image(uiImage: UIImage(data: photo.imageData!)!)
                        .resizable()
                        .aspectRatio(1, contentMode: .fill)
                        .contextMenu(menuItems: {
                            Button(action: {
                                deletePhoto(selectedPhoto: photo)
                            }) {
                                Label("Remove", systemImage: "trash")
                            }
                        })
                }
            }
            .padding()
            .navigationBarTitle(Text("Albums"))
            .navigationBarItems(trailing:
                Button(action: {
                    self.showingImagePicker = true
                }) {
                    Image(systemName: "plus.circle.fill")
                }
            )
            .sheet(isPresented: $showingImagePicker, onDismiss: loadImage) {
                ImagePicker(image: self.$inputImage)
            }
        }
    }

Answered by JoshHolme in 642272022

It appears that while ContextMenu was deprecated, .contextMenu was not, so I am using the correct option. However, there does not appear to be a way to change the color of actions at this time.

Boost

Answer 1

Claude31 OP

Oct ’20

I tried a lot of things, setting foreground, background… No result.

Found this, which seems to prove it is not possible in SwiftUI contextMenu (no destructive attribute)

https://stackoverflow.com/questions/58467846/how-to-configure-contextmenu-buttons-for-delete-and-disabled-in-swiftui

Also, looking on Apple's documentation for contextMenu it says that they have been deprecated for everything except for macOS. I find it strange that they deprecated it just one year after introducing it. Was this replaced by another component that I should be using?

Yes, they say to use menu instead. With a long press gesture
https://developer.apple.com/documentation/swiftui/longpressgesture

Code Block Menu("Options") {
Button("Option 1", action: actionOne)
Button("Option 2", action: actionTwo)
}

I did not test, but you should try to add .destructive attribute.

contextMenu it says that they have been deprecated

That's probably linked to the removal of touchForce, which is regrettable.

1

Answer 2

JoshHolme OP

Oct ’20

Yes, they say to use menu instead. With a long press gesture

I'd like to make sure trackpads are supported to be a good platform citizen. Would this work for right click with a mouse on iPadOS or would I need to roll out support for that by myself?

0

Answer 3

BabyJ OP

Oct ’20

How would you show a Menu with an onLongPressGesture?
Is there another parameter for Menu or modifier?

I don’t know if this would work, but playing with a custom MenuStyle could show destructive text.

0

Answer 4

JoshHolme OP

Oct ’20

Accepted Answer

It appears that while ContextMenu was deprecated, .contextMenu was not, so I am using the correct option. However, there does not appear to be a way to change the color of actions at this time.

1

Answer 5

Claude31 OP

Oct ’20

@ JoshHolme Deprecated does not mean it does not work. It means you should not use anymore as it could be not working in a future version of iOS.

So, it works, but you are unsafe and not future proof here.

Otherwise, you reached the same conclusion that I posted: destructive action is not possible in SwiftUI.

0

Answer 6

duffdude-apple OP

May ’22

use role: .destructive when creating the button. eg

Button(role: .destructive) { }

see https://www.hackingwithswift.com/books/ios-swiftui/creating-context-menus

1

Answer 7

vmarildo OP

Mar ’24

Use a different button initializer with a .destructive role. See example below:

Button(role: .destructive, action: delete) { Label("Delete", systemImage: "trash") }

0