为 App 添加文本选择及复制功能

了解如何使用 SwiftUI 为 App 添加文本复制功能,并允许用户自定义选择复制的内容。

为 App 添加文本选择及复制功能

从 iOS 15 开始,SwiftUI 提供了 .textSelection() 修饰器,允许用户复制 Text() 组件的内容。关于 textSelection() 的使用方法,可以阅读这篇文章

然而,textSelection() 的局限性在于,它只能复制整个文本内容,无法通过选择光标来控制复制的具体部分。

解决方案

使用 contextMenu 提供复制菜单

可以使用 contextMenu 提供两个复制选项:

  • 复制所有内容:该选项将复制 TextEditor 中的所有文本。
  • 选择文本复制:点击后显示一个 .sheet 窗口,在窗口中使用 TextEditor 展示文本内容,用户可以通过选择文本来进行复制。

使用 TextEditor 实现选择复制

示例代码:

import SwiftUI

struct ContentView: View {
    @State private var text = "这是一个可选择的文本,您可以选择部分文本进行复制,也可以选择复制所有内容。"
    @State private var showSheet = false
    @State private var displayContent = ""  // 存储需要显示在 TextEditor 中的文本内容

    var body: some View {
        Text(text)
            .padding()
            .contextMenu {
                Button("复制所有内容") {
                    UIPasteboard.general.string = text
                }
                Button("选择文本复制") {
                    displayContent = text  // 选择文本复制时将完整内容传递给显示区域
                    showSheet.toggle()
                }
            }
            .sheet(isPresented: $showSheet) {
                NavigationStack {
                    TextEditor(text: .constant(displayContent))
                        .font(.custom("SourceHanSerifSC-Regular", size: 17)) // 设置自定义字体
                        .scrollContentBackground(.hidden)
                        .padding()
                        .navigationTitle("选择文本")
                        .navigationBarTitleDisplayMode(.inline)
                        .toolbar {
                            ToolbarItem(placement: .topBarTrailing) {
                                Button("完成") {
                                    showSheet = false
                                }
                            }
                        }
                }
            }
    }
}