Question

点击时列表行的默认颜色为灰色。

我知道如何使用.listRowBackground更改背景颜色，但随后它会更改为整个列表。

点击时如何更改为自定义颜色，所以只有点击的行保持红色？

import SwiftUI

struct ExampleView: View {
    @State private var fruits = ["Apple", "Banana", "Grapes", "Peach"]

    var body: some View {
        NavigationView {
            List {
                ForEach(fruits, id: \.self) { fruit in
                    Text(fruit)
                }
                .listRowBackground(Color.red)

            }


        }
    }


}

struct ExampleView_Previews: PreviewProvider {
    static var previews: some View {
        ExampleView()
    }
}

Answer 1

如果您正在为 iOS 上的样式目的寻找替代方案，并且不想引入状态管理，因为列表由 UITableView 支持，您可以使用

UITableViewCell.appearance().selectedBackgroundView = UIView()

完全删除选择颜色。或：

UITableViewCell.appearance().selectedBackgroundView = {
            let view = UIView()
            view.backgroundColor = .blue
            return view
        }()

设置特定的高亮颜色

请注意，这适用于整个应用程序，并且仅适用于支持 UITableView 的平台，因此 MacOS 或 WatchOS 需要其他解决方案。

Answer 2

首先，您希望行上的.ListRowBackground修饰符不是整个列表，然后使用它有条件地为每行设置行背景色。如果将点击的行的ID保存在@State变量中，则可以根据选择状态将行设置为红色或默认颜色。这是代码：

import SwiftUI

struct ContentView: View {
    @State private var fruits = ["Apple", "Banana", "Grapes", "Peach"]
    @State private var selectedFruit: String?

    var body: some View {
        NavigationView {
            List {
                ForEach(fruits, id: \.self) { fruit in
                    Text(fruit)
                        .onTapGesture {
                            self.selectedFruit = fruit
                    }
                    .listRowBackground(self.selectedFruit == fruit ? Color.red : Color(UIColor.systemGroupedBackground))
                }
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Answer 3

在@Chuck H之后，

我正在使用：

        List {
            ForEach(viewModel.sharingGroups, id: \.self) { group in
                Button(action: {
                    self.selectedGroup = group
                }, label: {
                    Text(group.name)
                })
                .listRowBackground(self.selectedGroup == group ? Color.gray : Color(UIColor.systemGroupedBackground))
            }
        }

如果您直接使用“按钮”而不是“文本”，那么这使我可以点击行中的任意位置，而不仅仅是文本。

SwiftUI：更改列表行点击时突出显示颜色

3 个答案: