UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

SOLVED: Conditionally showing toolbar items when in EditMode

Forums > SwiftUI

Hi, I'm banging my head against the wall here trying to get my view to update to only show prev/next buttons when editmode is active:

.toolbar {
        ToolbarItemGroup(placement: .navigationBarLeading) {
            if editMode?.wrappedValue.isEditing == true {
                HStack {
                    Button("Prev day") {
                        changeDay(direction: "prev")
                    }
                    Spacer()
                    Button("Next day") {
                        changeDay(direction: "next")
                    }
                }
            }
        }
    ToolbarItemGroup(placement: .navigationBarTrailing) {
        EditButton()
    }
}

I'm not sure how I should approach this "isEditing" state. I tried making it a computer value, bringing that comparison in to the value, but it still doesn't seem to be able to toggle the display of these values.

Should I be using a custom button instead of EditButton and toggling isEditing myself?

2      

Hi! Maybe this workaround will help to solve this challenge.

struct ContentView: View {
    @State private var editActive = false

    @State private var items = [
        "Item 1",
        "Item 2",
        "Item 3",
        "Item 4",
        "Item 5",
        "Item 6",
        "Item 7",
        "Item 8"

    ]

    var body: some View {
        NavigationStack {
            List {
                ForEach(items, id: \.self) { item in
                    Text(item)
                }
                .onDelete { indexSet in
                    items.remove(atOffsets: indexSet)
                    editActive = false
                }
            }
            .toolbar {
                if editActive {
                    ToolbarItemGroup(placement: .topBarLeading) {
                        Button("<< Prev") { }
                        Button("Next >>") { }
                    }
                }

                ToolbarItem(placement: .topBarTrailing) {
                    Button(editActive ? "Done" : "Edit") {
                        editActive.toggle()
                    }
                }
            }
            .environment(\.editMode, .constant(editActive ? EditMode.active : EditMode.inactive))
        }
    }
}

3      

That's a great workaround! Amazing. I imagine there might be some compromise to not using the built-in EditButton() view, but as I was hoping to replace it with an icon anyway this might be the way way to go.

2      

If I could suggest one tweak, I found this made the transition smoother:

withAnimation {
  editActive.toggle()
}

2      

Hacking with Swift is sponsored by Essential Developer

SPONSORED Join a FREE crash course for mid/senior iOS devs who want to achieve an expert level of technical and practical skills – it’s the fast track to being a complete senior developer! Hurry up because it'll be available only until April 28th.

Click to save your free spot now

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.