SwiftUI中如何在文本选中弹出菜单中添加自定义选项?
在SwiftUI中为选中文本添加自定义菜单选项
完全可以实现这个需求。由于SwiftUI原生的TextEditor目前没有直接提供扩展系统选中文本菜单的API,最稳妥的方案是通过UIViewRepresentable封装原生的UITextView,利用UIKit的API自定义编辑菜单。
实现步骤与代码示例
- 封装支持自定义菜单的
UITextView
import SwiftUI import UIKit struct CustomTextEditor: UIViewRepresentable { @Binding var text: String // 可自定义菜单标题和操作逻辑 let customMenuTitle: String let customAction: (String) -> Void func makeUIView(context: Context) -> UITextView { let textView = UITextView() textView.delegate = context.coordinator textView.font = .systemFont(ofSize: 16) textView.backgroundColor = .clear // 适配SwiftUI视图背景 return textView } func updateUIView(_ uiView: UITextView, context: Context) { if uiView.text != text { uiView.text = text } } func makeCoordinator() -> Coordinator { Coordinator(parent: self) } class Coordinator: NSObject, UITextViewDelegate { private let parent: CustomTextEditor init(parent: CustomTextEditor) { self.parent = parent } // 重写方法修改系统默认编辑菜单 func textView(_ textView: UITextView, editMenuForTextIn range: NSRange, defaultMenu: UIMenu) -> UIMenu? { // 创建自定义菜单项 let customUIAction = UIAction(title: parent.customMenuTitle, image: UIImage(systemName: "square.and.pencil")) { _ in guard let selectedText = textView.text(in: range) else { return } parent.customAction(selectedText) } // 将自定义选项插入到默认菜单开头(用appending可放到末尾) return defaultMenu.prepending([customUIAction]) } } }
- 在SwiftUI视图中使用
struct ContentView: View { @State private var inputText = "选中这段文本,试试自定义菜单选项~" var body: some View { VStack(spacing: 20) { CustomTextEditor( text: $inputText, customMenuTitle: "处理选中内容", customAction: { selectedText in // 这里编写你的自定义逻辑,比如修改文本、弹窗提示等 print("选中的文本:\(selectedText)") inputText = inputText.replacingOccurrences(of: selectedText, with: "[\(selectedText)]") } ) .padding() .frame(minHeight: 200) .border(.gray.opacity(0.3), cornerRadius: 8) Text("选中上方文本后,菜单会显示自定义选项") .font(.caption) .foregroundColor(.secondary) } .padding() } }
关键说明
- 方案兼容iOS 13及以上版本,覆盖绝大多数设备
- 通过
UITextViewDelegate的textView(_:editMenuForTextIn:defaultMenu:)方法,可直接修改系统默认编辑菜单,添加自定义操作 - 可按需调整自定义菜单项的位置(开头/末尾)、图标和执行逻辑
内容的提问来源于stack exchange,提问作者agmcoder
相关产品推荐
相关产品推荐

