Saturday, May 2, 2026
HomeiOS Developmentios - SwiftUI make ForEach Record row correctly clickable for version in...

ios – SwiftUI make ForEach Record row correctly clickable for version in EditMode

[ad_1]

I’ve this following code:

NavigationView {
    Record {
        ForEach(someList) { someElement in
            NavigationLink(vacation spot: someView()) {
                someRowDisplayView()
            } //: NavigationLink
        } //: ForEach
    } //: Record
} //: NavigationView

Principally, it shows a dynamic record of sophistication objects beforehand crammed by person enter. I’ve an “addToList()” perform that permits customers so as to add some parts (as an example title, e mail, no matter) and as soon as the person confirms it provides the factor to this record. Then I’ve a view that shows the record by way of a ForEach after which makes a NavigationLink of every factor as indicated within the code instance above.

As soon as clicked on a component of this record, the person needs to be correctly redirected to a vacation spot view because the NavigationLink implies. All that is working high quality.

This is the place I face a difficulty: I need the person to have the ability to edit the content material of a row of this record with out having to delete the row and re-add one other one.

I made a decision to make use of the EditMode() function of SwiftUI. So that is what I got here up with:

@State non-public var editMode = EditMode.inactive
[...]
NavigationView {
    Record {
        ForEach(someList) { someElement in
            NavigationLink(vacation spot: someView()) {
                someRowDisplayView()
            } //: NavigationLink
        } //: ForEach
    } //: Record
    .toolbar {
        ToolbarItem(placement: .navigationBarLeading) {
            EditButton()
        }
    }
    .surroundings(.editMode, $editMode)
} //: NavigationView

The EditMode is correctly triggered once I click on on the Edit button. However I observed that the record row will not be clickable in edit mode, which is ok as a result of I don’t need it to comply with the NavigationLink whereas in edit mode.

Although what I need is that the person is both redirected to a view that permits enhancing of the tapped row, or higher, that an version sheet is introduced to the person.

Since I could not faucet the row in version mode, I’ve tried a number of tips however none of them concluded as I wished. Listed here are my tries.

.simultaneousGesture

I attempted so as to add a .simultaneousGesture modified to my NavigationLink and toggle a @State variable with the intention to show the version sheet.

@State non-public var isShowingEdit: Bool = false
[...]
.simultaneousGesture(TapGesture().onEnded{
    isShowingEdit = true
})
.sheet(isPresented: $isShowingEdit) {
    EditionView()
}

This merely doesn’t work. Plainly this .simultaneousGesture one way or the other breaks the NavigationLink, the faucet succeeds like as soon as out of 5 occasions.

It would not work even by including a situation on the edit mode, like:

if (editMode == .energetic) {
    isShowingEdit = true
}

In non-edition mode the NavigationLink continues to be bugged. However I’ve observed that after in version mode, it sort of does what I wished.

Modifier situation extension on View

After the earlier failure my first thought was that I wanted the faucet gesture to be triggered solely in edit mode, in order that in non-edit mode the view would not even know that it has a faucet gesture.

I made a decision so as to add an extension to the View construction with the intention to outline circumstances to modifiers (I discovered this code pattern someplace on Stackoverflow):

extension View {
    @ViewBuilder func `if`<Content material: View>(_ situation: Bool, remodel: (Self) -> Content material) -> some View {
        if situation {
            remodel(self)
        } else {
            self
        }
    }
}

Then in my principal code, as a substitute of the beforehand tried .simultaneousGesture modifier, I added this to NavigationLink:

.if(editMode == .energetic) { view in
    view.onTapGesture {
        isShowingEdit = true
    }
}

And it labored, I used to be in a position to show this version view as soon as a person faucets on a row whereas in version mode and the regular non-edition mode nonetheless labored because it correctly triggered the NavigationLink.

However one thing bothered me, it did not really feel like a pure or native habits. As soon as tapped, the row did not present any suggestions prefer it exhibits in non-edition mode when following the NavigationLink: it would not spotlight even for a really quick time.
The faucet gesture modifier merely executes the code I’ve requested with out animation, suggestions or something.

  • I would love the person to know and see which row was tapped and I would love it to spotlight simply because it does when when tapping on the NavigationLink: merely make it appear to be the row was really “tapped”. I hope it is smart.

  • I might additionally just like the code to be triggered when the person faucets on the entire row and never solely the elements the place the textual content is seen. Presently, tapping on an empty subject of the row does nothing. It has to have textual content on it.

A good higher answer could be one thing that stops me from making use of such conditional modifiers and extensions to the View construction as I certainly desire a extra pure and higher methodology if that is potential.

I am new to Swift so possibly there’s a lot simpler or higher answer and I am prepared to comply with the perfect practices.

How may I handle to perform what I need on this scenario?
Thanks on your assist.

I’m growing the app for minimal iOS 14, utilizing Swift language and SwiftUI framework.
In the event you want extra code samples or higher explanations please be happy to ask and I’ll edit my query.

[ad_2]

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments