MacOS下SwiftUI如何移除带圆角List选中项的高亮颜色

选中强调色问题解决 #

SidebarListStyle会默认应用系统强调色作为选中行的高亮样式，即使设置listRowBackground也可能被系统样式覆盖。可以通过以下方式彻底替换系统选中效果：

1. 利用List的selection绑定判断当前行是否被选中，手动设置行背景；
2. 使用PlainButtonStyle()移除NavigationLink默认的按钮样式；
3. 全局设置accentColor(.clear)消除系统强调色的残留影响。

修改后的完整代码：

struct ContentView: View {
    @State var selection: Int? = 0
    private let selectedBgColor = Color.blue.opacity(0.2)
    private let normalBgColor = Color.gray
    
    var body: some View {
        NavigationView {
            List((0...10), id: \.self, selection: $selection) { i in
                NavigationLink(destination: DetailView()) {
                    RowView()
                }
                .listRowBackground(selection == i ? selectedBgColor : normalBgColor)
                .buttonStyle(PlainButtonStyle())
                .tag(i)
                .frame(height: 40)
            }
            .listStyle(SidebarListStyle())
            .scrollContentBackground(.hidden)
            .accentColor(.clear)
        }
    }
}

// 提取行内容为独立子View
struct RowView: View {
    var body: some View {
        HStack {
            Image("linuxIcon")
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(width: 40)
            VStack(alignment: .leading) {
                Text("IP: 192.168.1.1").font(.headline)
                Text("Linux 5.5.10").font(.subheadline)
            }
            Spacer()
            Image(systemName: "xmark")
                .padding(.trailing, 5)
                .imageScale(.large)
        }
        .cornerRadius(8)
    }
}

// 替换原hmm()为规范命名的详情页
struct DetailView: View {
    var body: some View {
        Text("设备详情")
            .navigationTitle("设备信息")
    }
}

代码优化建议 #

• 子View拆分：将重复的行内容封装为RowView，提升代码复用性和可读性，后续修改行样式只需修改这一个文件；
• 命名规范：避免使用hmm()这类无意义的View名称，改用DetailView这类清晰的命名；
• 颜色统一管理：把背景色提取为常量，方便后续全局调整颜色风格；
• 动态数据适配：如果IP、系统版本是动态数据，给RowView添加参数（比如deviceInfo: DeviceInfo）来传递数据，避免硬编码；
• iOS16+适配：若App目标版本≥iOS16，建议使用NavigationStack替代NavigationView（NavigationView已废弃），NavigationStack提供更灵活的导航状态控制。

内容的提问来源于stack exchange，提问作者CleanMyFloor