SwiftUI macOS：如何禁用TextEditor滚动指示器背景仅显示滑块

要实现仅显示滚动指示器的可拖动滑块、隐藏背景轨道的效果（类似系统弹出框中的滚动条样式），SwiftUI原生的TextEditor没有直接提供对应API，需要通过封装AppKit的NSTextView来实现，具体步骤如下：

实现自定义TextEditor封装 #

创建一个遵循NSViewRepresentable的自定义视图，配置其内部滚动视图的指示器样式：

import SwiftUI

struct CustomTextEditor: NSViewRepresentable {
    @Binding var text: String
    
    func makeNSView(context: Context) -> NSTextView {
        let textView = NSTextView()
        // 设置滚动指示器为覆盖式（仅显示滑块，无背景轨道）
        textView.enclosingScrollView?.scrollerStyle = .overlay
        // 可选：调整滑块的色调，匹配你的UI风格
        textView.enclosingScrollView?.verticalScroller?.controlTint = .blueControlTint
        // 基础配置：禁用富文本、设置字体
        textView.isRichText = false
        textView.font = .systemFont(ofSize: 14)
        return textView
    }
    
    func updateNSView(_ nsView: NSTextView, context: Context) {
        // 同步文本内容
        if nsView.string != text {
            nsView.string = text
        }
    }
}

使用自定义TextEditor #

在你的SwiftUI视图中直接调用这个自定义组件即可：

struct ContentView: View {
    @State private var text = "测试文本\n多行内容\n用于演示滚动效果\n更多行...\n继续添加\n直到出现滚动条\n再添加几行\n让滚动条显示出来"
    
    var body: some View {
        CustomTextEditor(text: $text)
            .frame(height: 200)
            .border(Color.gray.opacity(0.3))
    }
}

关键说明 #

• scrollerStyle = .overlay是实现效果的核心：这个样式会让滚动指示器以覆盖层形式显示，只保留可拖动的滑块部分，隐藏默认的背景轨道，和系统弹出框中的滚动条样式完全一致。
• 你可以根据需求进一步自定义滑块的外观，比如修改controlTint调整色调，或者设置scrollerKnobStyle改变滑块形状。

内容的提问来源于stack exchange，提问作者devon't