NSColorPicker 是 macOS AppKit 框架中系统颜色面板(NSColorPanel)的插件接口,允许创建自定义的颜色选择器模块,扩展用户可选颜色的来源和方式。
它并不是一个普通的颜色控件,而是一个开发者用来自定义颜色选择器行为的抽象类,属于插件机制的一部分。
架构背景
macOS 系统中,点击 NSColorWell 会弹出颜色面板(NSColorPanel),该面板的左上角有多个选项卡:滑块、调色板等。
这些选项卡就是由多个 NSColorPicker 插件子类提供的,也可以添加自己的。

类定义(简化)
class NSColorPicker: NSObject {
init?(pickerMask: NSColorPanel.Options, colorPanel: NSColorPanel)
var view: NSView { get }
func insertNewButtonImage() -> NSImage!
func provideNewButtonImage() -> NSImage!
func supportsMode(_ mode: NSColorPanel.Mode) -> Bool
func setMode(_ mode: NSColorPanel.Mode)
func colorChanged(_ sender: Any?)
}
必须创建其子类,实现一个自定义颜色选择 UI(通常是一个 NSView),并将它注册到 NSColorPanel。
实现NSColorPicker
利用NSColorPicker会实现一个颜色面板的新“页签”,和系统默认的“滑块”、“光谱”等一样,在 NSColorPanel 中自动出现,支持自定义颜色逻辑(比如品牌色、随机色、HSV 面板等)。
重要提示:下面只是一个流程介绍,实际上并不能实现真正的NSColorPicker插件效果,目前也没有比较好的教程可以实现NSColorPicker插件。
1、创建Cocoa Bundle
1、打开Xcode – File -New – Project。
2、选择 macOS – Framework & Library – Bundle。

3、命名并创建 .bundle 插件项目。

2、创建 NSColorPicker 的子类
import AppKit
class MyColorPicker: NSColorPicker {
private let colorPanel: NSColorPanel
private var customView: NSView!
override init?(pickerMask: NSColorPanel.Options, colorPanel: NSColorPanel) {
self.colorPanel = colorPanel
super.init(pickerMask: pickerMask, colorPanel: colorPanel)
setupUI()
}
private func setupUI() {
let view = NSView(frame: NSRect(x: 0, y: 0, width: 200, height: 200))
let button = NSButton(title: "随机颜色", target: self, action: #selector(setRandomColor))
button.frame = NSRect(x: 20, y: 80, width: 160, height: 40)
view.addSubview(button)
customView = view
}
override var view: NSView {
return customView
}
@objc func setRandomColor() {
let randomColor = NSColor(
red: CGFloat.random(in: 0...1),
green: CGFloat.random(in: 0...1),
blue: CGFloat.random(in: 0...1),
alpha: 1.0
)
colorPanel.color = randomColor
}
override func insertNewButtonImage() -> NSImage! {
return NSImage(systemSymbolName: "paintpalette", accessibilityDescription: nil)
}
override func provideNewButtonImage() -> NSImage! {
return insertNewButtonImage()
}
}
3、修改Info.plist注册插件
添加key:
<key>NSColorPicker</key>
<array>
<string>MyColorPicker</string>
</array>
确保类名和 plist 注册名称一致。

如果没有Info.plist文件,则参考《Xcode项目Info.plist文件位置》新增Info.plist文件。
4、构建设置
在 Xcode 中 Target 的 Build Settings 中确保:
1、Mach-O Type 是 Bundle。
2、Defines Module 设置为 YES。
3、Skip Install 设置为 NO(是插件,不是 App)。
5、构建.bundle
点击Xcode上方的Product – Build,或者按Command + B进行构建。
构建完成后,会出现 .bundle 文件,位置在:
~/Library/Developer/Xcode/DerivedData/YourProjectName-xxxx/Build/Products/Debug/MyColorPicker.bundle
可以在访达中,按Command + Shift + G前往路径:
~/Library/Developer/Xcode/DerivedData/

在DerivedData文件夹中,找到项目名称文件夹。
在Build – Products – Debug 文件夹中,找到MyColorPicker.bundle。

6、安装插件
可以将 .bundle 手动拷贝到系统插件目录:
~/Library/ColorPickers/
如果没有这个目录,需要手动创建:
mkdir -p ~/Library/ColorPickers
然后把编译好的 .bundle 拖进去。
7、打开系统颜色面板
可以运行任意一个 macOS 支持颜色面板的 App(如 TextEdit、Keynote、Xcode),打开颜色选择器(⌘Shift+C) → 检查左上角是否出现 picker 插件图标。
如果看到自定义的“随机颜色”按钮,那就成功了!
8、常见问题
1、插件不显示:确保 Info.plist 注册了类名、拷贝路径正确。
2、不执行回调:确保 button 使用了 @objc 方法,target = self。
3、无法识别 NSColorPanel:只适用于 AppKit(macOS),不适用于 SwiftUI。
4、Swift 项目无法被系统识别:确保使用 Objective-C 兼容构建方式或写桥接头文件。
注意事项
NSColorPicker 是面向插件开发者的高级 API,普通应用开发者几乎不会直接用它。
使用它需要注册为一个插件(通常是 .bundle 文件)。
SwiftUI、普通 App 开发中推荐用 NSColorWell + NSColorPanel 或 ColorPicker(SwiftUI)。
总结
NSColorPicker是一个抽象类,需要子类化。为 NSColorPanel 添加自定义颜色选择器。
属于插件式开发,比较高级,内置调色板、滑块、光谱等都是 NSColorPicker 的子类。
相关文章
1、mac颜色选择控件NSColorWell:https://fangjunyu.com/2025/07/01/mac%e9%a2%9c%e8%89%b2%e9%80%89%e6%8b%a9%e6%8e%a7%e4%bb%b6nscolorwell/
2、Xcode项目Info.plist文件位置:https://fangjunyu.com/2024/12/08/xcode%e9%a1%b9%e7%9b%aeinfo-plist%e6%96%87%e4%bb%b6%e4%bd%8d%e7%bd%ae/
3、GitHub 项目MaterialDesignColorPicker:https://github.com/johnyanarella/MaterialDesignColorPicker
4、GitHub 项目color-picker-plus:https://github.com/viktorstrate/color-picker-plus