当前位置：首页 > news >正文

SwiftUI 如何让文本自动支持查找和替换功能？

news 2025/8/6 7:11:05

在这里插入图片描述

概览

有些情况下，我们需要为文本编辑器实现文本的查找和替换功能（find & replace），如果完全靠自已撸码还是比较棘手的。

所幸的是，从 SwiftUI 4.0 （iOS 16）开始，Apple 已经将查找与替换功能原生嵌入到 TextEditor 中了：

在这里插入图片描述

只需几行代码，我们即能恣意任性实现文本查找和替换功能的开启与关闭，以及其它定制细节。

在本篇博文中，就让我们一起来看看如何轻松实现它吧！

Let‘s go！！！😉

开启和关闭

从 SwiftUI 4.0 开始，TextEditor 已经可以原生支持查找和替换功能了。

struct ContentView: View {@State private var bio = "Describe someone, Thanks./n contained no UIScene configuration dictionary (looking for configuration named BEST!"@State private var isShowingFindNavigator = falsevar body: some View {NavigationStack {TextEditor(text: $bio).font(.title).padding().navigationTitle("查找与替换DEMO")}}
}

如果设备已连接物理键盘，我们可以使用键盘快捷键 Cmd+F 开启查找界面，用 Option+Cmd+F 来开启替换界面：

在这里插入图片描述

我们还可以在 TextEditor 上调用 findNavigator() 修改器方法来手动启用和关闭查找和替换界面：

struct ContentView: View {@State private var bio = "Describe someone, Thanks./n contained no UIScene configuration dictionary (looking for configuration named BEST!"@State private var isShowingFindNavigator = falsevar body: some View {NavigationStack {TextEditor(text: $bio).font(.title).findNavigator(isPresented: $isShowingFindNavigator).toolbar {Button("打开查找与替换") {isShowingFindNavigator.toggle()}}.padding().navigationTitle("查找与替换DEMO")}}
}

默认情况下，findNavigator() 首先弹出查找界面，我们可以点击其中的放大镜小图标来继续显示替换界面：

在这里插入图片描述

需要注意的是：在 Xcode 14.2 预览中无法通过此种方法来显示替换界面，必须在模拟器或真机中才可以。

自定义条件

有些情况下，我们可能不希望 TextEditor 响应查找或替换功能。

这可以通过在 TextEditor 上调用 replaceDisabled() 或 findDisabled() 修改器来实现：

struct ContentView: View {@State private var bio = "Describe someone, Thanks./n contained no UIScene configuration dictionary (looking for configuration named BEST!"@State private var isShowingFindNavigator = falsevar body: some View {NavigationStack {TextEditor(text: $bio).font(.title)// 不开启文本替换功能.replaceDisabled(true).findNavigator(isPresented: $isShowingFindNavigator).toolbar {Button("打开查找与替换") {isShowingFindNavigator.toggle()}}.padding().navigationTitle("查找与替换DEMO")}}
}