SwiftUI NavigationLink in ScrollView not responding until scrolling

Viewed 238

As the title says, NavigationLink (or Button) does not receive tap before the horizontal scrollview has been scrolled, i.e. nothing is tappable/reponsive. After scrolling everything works as expected.

I am using Xcode 12 Beta 2 with the API of iOS 13 (can not use iOS 14 API due to the clients needs)

struct ARQuickMenuChooseArt: View {
let title: String
let favorites: [Artwork]
var donePressed: (() -> Void)?
var seeAllArtPressed: (() -> Void)?

var body: some View {
    VStack(alignment: .leading, spacing: 24) {
        Text("Favourites")
            .font(.title)
            .padding(.bottom, -10)
        ScrollView(.horizontal, showsIndicators: false) {
            HStack(spacing: 12) {
                ForEach(favorites) { favorite in
                    NavigationLink(destination: Text("Destination View")) {
                        ARQuickMenuArtListItem(artwork: favorite)
                    }
                }
            }
        }
    }
}

}

Here is the view that uses the view containing the scrollview.

struct AddArtFlowView: View {
let controller: ARArtworksModelController
@Binding var position: CardPosition
@EnvironmentObject var appState: AppState
    
var body: some View {
    ARMenuContainer(position: $position, dismissAction: dismiss) {
        NavigationView {
            ARQuickMenuChooseArt(
                title: "Add artwork",
                favorites: artworkData,
                seeAllArtPressed: {
                    appState.activeView = .menuOpen(.add)
                }
            )
        }
    }
}

}

ARMenuContainer is simply a wrapper, seen here:

struct ARMenuContainer<Content>: View where Content: View {
@Binding var position: CardPosition
let dismissAction: () -> Void
let content: () -> Content

init(position: Binding<CardPosition>, dismissAction: @escaping () -> Void, @ViewBuilder content: @escaping () -> Content) {
    self._position = position
    self.dismissAction = dismissAction
    self.content = content
}

var body: some View {
    SlideOverCard($position, backgroundTapped: dismissAction) {
        VStack {
            content()
            
            Spacer()
        }
        .padding(.top, -3)
    }
}

}

Which in turn uses a SlideOverCard https://github.com/moifort/swiftUI-slide-over-card, which is used to display above an AR experience.

Here is how it looks in-app enter image description here

Any ideas why it will not respond without first scrolling?

0 Answers
Related