SwiftUI 和 UIKit 实现 Markdown 文本所见即所得编辑器
下面是一个使用 SwiftUI 和 UIKit 编写的简单的 Markdown 文本所见即所得的编辑器的示例代码:\n\n首先,我们需要创建一个 SwiftUI 的视图 MarkdownEditorView,它将包含一个 UITextView 和一个 UILabel。UITextView 用于用户输入 Markdown 文本,而 UILabel 用于显示所见即所得的效果。\n\nswift\nimport SwiftUI\nimport UIKit\n\nstruct MarkdownEditorView: UIViewRepresentable {\n typealias UIViewType = UIView\n\n @Binding var markdownText: String\n\n func makeUIView(context: Context) -> UIView {\n let textView = UITextView()\n textView.delegate = context.coordinator\n textView.font = UIFont.preferredFont(forTextStyle: .body)\n textView.autocapitalizationType = .none\n textView.autocorrectionType = .no\n textView.smartQuotesType = .no\n textView.smartDashesType = .no\n textView.smartInsertDeleteType = .no\n return textView\n }\n\n func updateUIView(_ uiView: UIView, context: Context) {\n guard let textView = uiView as? UITextView else { return }\n textView.text = markdownText\n }\n\n func makeCoordinator() -> Coordinator {\n Coordinator(self)\n }\n\n class Coordinator: NSObject, UITextViewDelegate {\n var parent: MarkdownEditorView\n\n init(_ parent: MarkdownEditorView) {\n self.parent = parent\n }\n\n func textViewDidChange(_ textView: UITextView) {\n parent.markdownText = textView.text\n }\n }\n}\n\n\n然后,我们可以在 SwiftUI 的主视图中使用 MarkdownEditorView:\n\nswift\nimport SwiftUI\n\nstruct ContentView: View {\n @State private var markdownText = ""\n\n var body: some View {\n VStack {\n MarkdownEditorView(markdownText: $markdownText)\n Divider()\n Text(markdownText)\n .padding()\n }\n }\n}\n\nstruct ContentView_Previews: PreviewProvider {\n static var previews: some View {\n ContentView()\n }\n}\n\n\n在上述示例代码中,我们使用 @State 属性包装了一个 markdownText 变量,以便在视图之间共享数据。\n\n最后,我们可以在 SceneDelegate 的 window 的 rootViewController 中创建一个 UIHostingController,并将 ContentView 作为其根视图。\n\nswift\nimport UIKit\nimport SwiftUI\n\nclass SceneDelegate: UIResponder, UIWindowSceneDelegate {\n\n var window: UIWindow?\n\n func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {\n if let windowScene = scene as? UIWindowScene {\n let window = UIWindow(windowScene: windowScene)\n let contentView = ContentView()\n let hostingController = UIHostingController(rootView: contentView)\n window.rootViewController = hostingController\n self.window = window\n window.makeKeyAndVisible()\n }\n }\n}\n\n\n这样,我们就创建了一个简单的 Markdown 文本所见即所得的编辑器。用户可以在 UITextView 中输入 Markdown 文本,然后在下方的 UILabel 中实时显示所见即所得的效果。
原文地址: https://www.cveoy.top/t/topic/ppnc 著作权归作者所有。请勿转载和采集!