swiftui - SwiftUI TextEditor - 编辑完成后保存状态
问题描述
问题概述
我正在构建一个笔记应用程序,并且有一个笔记编辑视图,其中一些 TextEditor 用于收听用户的输入。现在一个环境对象被传递给这个笔记编辑视图,我设计了一个保存按钮来保存更改。它运行良好,只是用户必须单击保存按钮才能更新模型。
预期行为
编辑完成后,文本编辑器应更新 EnvironmentObject 实例的值。不一定要单击保存按钮来保存更改。
下面是视图的示例代码
struct NoteDetails: View {
@EnvironmentObject var UserData: Notes
@Binding var selectedNote: SingleNote?
@Binding var selectedFolder: String?
@Binding var noteEditingMode: Bool
@State var title:String = ""
@State var updatedDate:Date = Date()
@State var content: String = ""
var id: Int?
var label: String?
@State private var wordCount: Int = 0
var body: some View {
VStack(alignment: .leading) {
TextEditor(text: $title)
.font(.title2)
.padding(.top)
.padding(.horizontal)
.frame(width: UIScreen.main.bounds.width, height: 50, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
Text(updatedDate, style: .date)
.font(.subheadline)
.padding(.horizontal)
Divider()
TextEditor(text: $content)
.font(.body)
.lineSpacing(15)
.padding(.horizontal)
.frame(maxHeight:.infinity)
Spacer()
}
}
}
下面是 EnvironmentObject 的编辑函数的示例代码
UserData.editPost(label: label!, id: id!, data: SingleNote(updateDate: Date(), title: title, body: content))
我尝试过的方法
- 我试图向 TextEditor 添加一个 onChange 修饰符,但它会在发生任何更改时立即应用,这是不希望的。我还尝试了其他一些修饰符,例如 onDisapper 等。
- 用户数据已经
@Published var NoteList: [String: [SingleNote]]
并且我尝试将 $UserData.NoteList[label][id].title 传递给 TextEditor 并且它也没有被接受
在互联网上没有找到合理的解决方案,所以在这里提出这个问题。提前感谢您的建议!
解决方案
编辑完成后,我不知道您要保存的确切含义。这是我发现的两种可能的方法。
注意:在下面的演示中,蓝色背景的文本显示保存的文本。
1.当用户关闭键盘时保存
解决方案:添加一个轻击手势,让用户在TextEditor
. 同时打电话save()
。
代码:
struct ContentView: View {
@State private var text: String = ""
@State private var savedText: String = ""
var body: some View {
VStack(spacing: 20) {
Text(savedText)
.frame(width: 300, height: 200, alignment: .topLeading)
.background(Color.blue)
TextEditor(text: $text)
.frame(width: 300, height: 200)
.border(Color.black, width: 1)
.onTapGesture {}
}
.onTapGesture { hideKeyboardAndSave() }
}
private func hideKeyboardAndSave() {
UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
save()
}
private func save() {
savedText = text
}
}
2. x 秒无更改后保存
解决方案:只有在没有进一步事件的情况下经过几秒钟后才使用Combine
with发布和观察。.debounce
x
我已经设置x
为 3。
代码:
struct ContentView: View {
@State private var text: String = ""
@State private var savedText: String = ""
let detector = PassthroughSubject<Void, Never>()
let publisher: AnyPublisher<Void, Never>
init() {
publisher = detector
.debounce(for: .seconds(3), scheduler: DispatchQueue.main)
.eraseToAnyPublisher()
}
var body: some View {
VStack(spacing: 20) {
Text(savedText)
.frame(width: 300, height: 200, alignment: .topLeading)
.background(Color.blue)
TextEditor(text: $text)
.frame(width: 300, height: 200)
.border(Color.black, width: 1)
.onChange(of: text) { _ in detector.send() }
.onReceive(publisher) { save() }
}
}
private func save() {
savedText = text
}
}
推荐阅读
- awk - 将两列合并为新列并打印所有列
- php - 如何在functions.php中获取数据
- python - pygame - while循环使pygame窗口冻结/我如何将子弹射出玩家?
- javascript - 使用 JavaScript 我想要以下输出
- ios - SwiftUI 将 Label 的垂直对齐方式更改为居中图像和文本
- javascript - 猫头鹰轮播导航效果
- python - Blender Python 语句控制台日志记录
- webstorm - 如何让 JetBrains Rider 显示左括号线?
- c# - 转换 IEnumerable
加倍 - tkinter - 多帧中的 Tkinter 网格和 ttk 小部件的潜在影响