SwiftUI 列表禁用单元格按下

Posted 2023-02-24

【中文标题】SwiftUI 列表禁用单元格按下

【英文标题】：SwiftUI List disable cell press

【发布时间】：2019-09-03 10:32:50

【问题描述】：

我正在使用带有 SwiftUI 的 xCode 11 beta 7。

我有一个简单的列表，每个列表元素都有几个按钮。目前，当用户按下单元格（不是按钮）时，它会突出显示列表单元格的背面（可能不是 SwiftUI 的正确术语）。

如何禁用此行为？我找不到明显的 api 来禁用它。

List 
    HStack 
        Group 
            Button(action: ) 
                Text("Read").padding(5)
            .onTapGesture 
                print("1")                    
            
            .padding()
            .background(Color.blue)
            .cornerRadius(5)
        
        Group 
            Button(action: ) 
                Text("Notify").padding(5)
            .onTapGesture 
                print("2") 
            
            .padding()
            .background(Color.purple)
            .cornerRadius(5)
        
        Group 
            Button(action: ) 
                Text("Write").padding(5)
            .onTapGesture 
                print("3")
            
            .padding()
            .background(Color.yellow)
            .cornerRadius(5)
        
    

【问题讨论】：

您不能直接禁用单元格的突出显示（目前）。但是您可以使用垂直滚动视图而不是列表。您还可以设置背景以阻止用户看到突出显示的背景，但分隔符会闪烁

是的，我觉得这可能是目前的解决方案，SwiftUI 肯定还没有准备好生产。

你需要帮忙吗？

我得到了两个感谢

注意点：List(...) 比 ScrollView(...) 处理大列表要好得多，性能也要好得多，所以如果是这样，请找到一种方法来处理列表项点击并放弃滚动条。

【参考方案1】：

与How to remove highlight on tap of List with SwiftUI?中的答案相同

我知道我来晚了，但它是为那些正在搜索的人准备的（比如我?）

我发现了什么

我想你应该看看How to disable the overlay color for images inside Button and NavigationLink来自@TwoStraws的短文

只需将.buttonStyle(PlainButtonStyle()) 修饰符添加到List 中的项目，您就会得到您想要的。也让Buttons在List中再次工作，这是我遇到的另一个问题。

Swift 5.1 的工作示例：

import Combine
import SwiftUI

struct YourItem: Identifiable 
    let id = UUID()
    let text: String


class YourDataSource: ObservableObject 
    let willChange = PassthroughSubject<Void, Never>()
    var items = [YourItem]()

    init() 
        items = [
            YourItem(text: "Some text"),
            YourItem(text: "Some other text")
        ]
    


struct YourItemView: View 
    var item: YourItem

    var body: some View 
        VStack(alignment: .leading) 
            Text(item.text)
            HStack 
                Button(action: 
                    print("Like")
                ) 
                    Image(systemName: "heart.fill")
                
                Button(action: 
                    print("Star")
                ) 
                    Image(systemName: "star.fill")
                
            
        
        .buttonStyle(PlainButtonStyle())
    


struct YourListView: View 
    @ObservedObject var dataSource = YourDataSource()

    var body: some View 
        List(dataSource.items)  item in
            YourItemView(item: item)
        
        .navigationBarTitle("List example", displayMode: .inline)
        .edgesIgnoringSafeArea(.bottom)
    


#if DEBUG
struct YourListView_Previews: PreviewProvider 
    static var previews: some View 
        YourListView()
    

#endif

正如文章中所说，它也适用于NavigationLinks。我希望它对你们中的一些人有帮助??

【讨论】：

很好的答案。我想补充一点，如果您将.buttonStyle(PlainButtonStyle()) 移出YourItemView 结构本身并将其放在YourListView 结构中YourItemView(item: item) 行之后的结构中，这似乎也有效。

太棒了......它就像一个魅力。

很好的答案，谢谢！

【参考方案2】：

这是对我有用的最简单的解决方案（瞧，我正在用 Swift 和 SwiftUI 构建我的第一个应用程序，这是我在 SO 上的第一篇文章）：

无论哪里有按钮，添加 .buttonStyle(BorderlessButtonStyle())

Button(action:)
Text("Hello")
.buttonStyle(BorderlessButtonStyle())

然后在您的列表中添加 .onTapGesture return

List
Text("Hello")
.onTapGesture return

【讨论】：

这禁用了我在其中一个部分中使用的分段视图点击手势。

【参考方案3】：

不要使用按钮，而是尝试用手势来代替

Group 
    Text("Notify").padding(5).gesture(TapGesture().onEnded() 
            print("action2")
            )
        .padding()
        .background(Color.purple)
        .cornerRadius(5)
    

【讨论】：

击败按钮点，此外，您不会获得免费获得的漂亮按钮动画，例如触摸时突出显示等。