如何通过NSResponder拦截表情符号并应用到按钮标签？

问题描述 #

开发macOS应用时需要实现以下功能：

• 通过按钮打开表情选择器（已完成）
• 用NSResponder拦截用户选择的表情值
• 将表情更新到按钮标签上

当前代码能正常打开表情选择器，但选择表情后无任何响应。需求是不使用隐藏TextField（因列表行焦点逻辑冲突：选中行按回车时，焦点会落在表情TextField上，希望改为落在名称TextField上）。

问题原因 #

单纯的NSResponder实例无法直接成为窗口的第一响应者，必须依附于某个NSView并加入到应用的响应链中；同时默认NSResponder的acceptsFirstResponder返回false，无法获取焦点接收输入事件。

修正方案 #

1. 完善自定义NSResponder #

重写acceptsFirstResponder和becomeFirstResponder，确保响应器能获取焦点，并处理insertText事件：

import AppKit

class EmojiResponder: NSResponder {
    var onEmojiSelected: ((String) -> Void)?
    
    // 允许成为第一响应者
    override var acceptsFirstResponder: Bool { true }
    
    override func becomeFirstResponder() -> Bool {
        return true
    }
    
    // 拦截表情输入
    override func insertText(_ insertString: Any) {
        guard let selectedEmoji = insertString as? String else { return }
        onEmojiSelected?(selectedEmoji)
        print(selectedEmoji)
        // 处理完成后归还焦点
        resignFirstResponder()
    }
}

2. 创建承载响应器的NSViewRepresentable #

因为NSResponder必须依附于NSView才能加入响应链，所以创建一个透明的承载视图：

import SwiftUI
import AppKit

struct EmojiResponderView: NSViewRepresentable {
    let responder: EmojiResponder
    
    func makeNSView(context: Context) -> NSView {
        let view = NSView()
        // 将响应器接入视图的响应链
        view.nextResponder = responder
        responder.nextResponder = view
        return view
    }
    
    func updateNSView(_ nsView: NSView, context: Context) {}
}

3. 修改SwiftUI主视图 #

将承载视图加入界面，调整打开表情选择器的逻辑，确保响应器能接收输入：

import SwiftUI

struct ContentView: View {
    @State private var buttonLabel = "Emoji?"
    private let emojiResponder = EmojiResponder()
    
    var body: some View {
        Button {
            openEmojiPicker()
        } label: {
            Text(buttonLabel)
                .font(.title)
        }
        // 添加承载视图到背景（不可见，仅用于接入响应链）
        .background(EmojiResponderView(responder: emojiResponder))
        .onAppear {
            emojiResponder.onEmojiSelected = { selectedEmoji in
                buttonLabel = selectedEmoji // 更新按钮标签
            }
        }
    }
    
    private func openEmojiPicker() {
        guard let window = NSApplication.shared.keyWindow else { return }
        // 找到承载视图并设置为第一响应者
        if let emojiHostView = window.contentView?.subviews.first(where: {
            $0.nextResponder is EmojiResponder
        }) {
            window.makeFirstResponder(emojiHostView)
        }
        // 延迟打开表情选择器，确保响应者已获取焦点
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
            NSApp.orderFrontCharacterPalette(nil)
        }
    }
}

关键说明 #

• 承载视图仅用于将EmojiResponder接入响应链，不会对界面视觉产生影响
• 打开表情选择器前必须确保承载视图成为第一响应者，这样表情选择器的输入才会传递到自定义响应器
• 处理完表情后调用resignFirstResponder归还焦点，避免影响后续界面交互

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