如何在 SwiftUI 中使整个列表行成为 NavigationLink

Posted 2023-04-13

【中文标题】如何在 SwiftUI 中使整个列表行成为 NavigationLink

【英文标题】：How to make whole List row a NavigationLink in SwiftUI

【发布时间】：2021-09-20 11:45:25

【问题描述】：

我正在制作一个问题集列表，并希望整行导航到下一个视图（每一行都有不同的目标视图），但只有文本旁边的区域是可点击的。我尝试在 List 之外创建一个 SetRow() 并且它工作得很好，但是当它在 List 内部时只有空白区域在工作。

Red is the working area

在这里列出代码：

NavigationView 
            VStack 
                SearchBar(input: $searchInput)
                List(viewModel.filterList(by: searchInput))  setVM in
                    NavigationLink(destination:
                        SetView(viewModel: QuestionListViewModel(
                                            emoji: setVM.questionSet.emoji,
                                            title: setVM.questionSet.title,
                                            setID: setVM.questionSet.id)
                            ))
                    
                        SetRow(viewModel: setVM)
                    
                    .onLongPressGesture(minimumDuration: 1) 
                        selectedSetVM = setVM
                        showDeleteAlert.toggle()
                    
                    
                
                .listStyle(PlainListStyle())
                
            

这里是 SetRow 代码：

HStack 
            Text(viewModel.questionSet.emoji)
                .font(.system(size: 50))
            VStack(alignment: .leading) 
                Text(viewModel.questionSet.title)
                    .font(.system(size: 20, weight: .semibold, design: .default))
                VStack(alignment: .leading) 
                    Text("Questions: \(viewModel.questionSet.size)")
                        .font(.system(size: 15, weight: .light, design: .default))
                        .foregroundColor(.gray)
                    Text("Updated: \(viewModel.questionSet.lastUpdated, formatter: taskDateFormat)")
                        .font(.system(size: 15, weight: .light, design: .default))
                        .foregroundColor(.gray)
                
            
            Spacer()
        
        .padding(.top, 10)

【参考方案1】：

问题出在您的“longPressGesture”上，它想要控制行的内容并监听 longPresses。为避免这种情况，您可以使用“onTapGesture”来控制 NavigationLink 的激活，并使用“onLongPressGesture”来激活您的 actionSheet 或 Alert。

这是一个演示用法的简短代码示例： https://***.com/a/67099257

【讨论】：

谢谢，你是对的！我什至没有想到 longPressGesture 会对它产生影响。