SQRichTextEditor 1.0.1

SQRichTextEditor 1.0.1

林宇威维护。



  • 林宇威

SQRichTextEditor

Build Status Version License Platform Swift Version

简介

我在寻找一个iOS上的所见即所得文本编辑器,发现了一些解决方案,但它们都没有使用WKWebView。苹果将不再接受使用UIWebView API的应用程序的提交。我找到一个HTML5富文本编辑器,它提供了一个强大且轻量级的跨浏览器标准化。因此,我构建了这个项目和iOS的桥接器,该桥接器用于在WKWebView的Swift和JavaScript之间发送消息。

示例

要运行示例项目,请克隆仓库,然后从示例目录打开SQRichTextEditor.xcworkspace

SQRichTextEditor SQRichTextEditor

要求

  • 部署目标iOS 10.0+
  • Swift 5+
  • Xcode 11+

安装

SQRichTextEditor可以通过CocoaPods获取。要安装它,只需将以下行添加到您的Podfile中。

pod 'SQRichTextEditor'

特性

  • 粗体
  • 斜体
  • 下划线
  • 删除线
  • 插入图片
  • 插入HTML
  • 创建链接
  • 文字颜色
  • 文字大小
  • 文字背景颜色

入门指南

SQTextEditorView是UIView的子类,因此您可以将其用于您需要的任何地方。

import SQRichTextEditor

private lazy var editorView: SQTextEditorView = {
	/// You can pass the custom css string, if you want to change the default editor style
	/// var customCss: String?
        /// if let cssURL = Bundle.main.url(forResource: isDarkMode ? "editor_dark" : "editor_light", withExtension: "css"),
        ///    let css = try? String(contentsOf: cssURL, encoding: .utf8) {
        ///    customCss = css
        /// }
        /// let _editorView = SQTextEditorView(customCss: customCss)

        let _editorView = SQTextEditorView()
        _editorView.translatesAutoresizingMaskIntoConstraints = false
        return _editorView
}()

view.addSubview(editorView)
editorView.topAnchor.constraint(equalTo: collectionView.bottomAnchor, constant: 10).isActive = true
editorView.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 10).isActive = true
editorView.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -10).isActive = true
editorView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -10).isActive = true

代理

您可以通过实现SQTextEditorDelegate来检查事件。

editorView.delegate = self

代理具有以下功能

//Called when the editor components is ready.
optional func editorDidLoad(_ editor: SQTextEditorView)
    
//Called when the user selected some text or moved the cursor to a different position.
optional func editor(_ editor: SQTextEditorView,
                               selectedTextAttributeDidChange attribute: SQTextAttribute)
    
//Called when the user inserted, deleted or changed the style of some text.
optional func editor(_ editor: SQTextEditorView,
                               contentHeightDidChange height: Int)

//Called when the user tapped the editor
optional func editorDidFocus(_ editor: SQTextEditorView)

//Called when the user tapped the done button of keyboard tool bar
optional func editorDidTapDoneButton(_ editor: SQTextEditorView)

//Called when the editor cursor moved
optional func editor(_ editor: SQTextEditorView, cursorPositionDidChange position: SQEditorCursorPosition)

编辑器功能

getHTML

返回编辑器当前状态下的HTML值。

func getHTML(completion: @escaping (_ html: String?) -> ())

insertHTML

在当前光标位置插入HTML片段,或者如果选中则替换选中内容。提供的值应不包含标签或其他内容。在脚本评估完成或失败时调用的块。

func insertHTML(_ html: String, completion: ((_ error: Error?) -> ())? = nil)

getSelectedText

当前在编辑器中选中的文本。

func getSelectedText(completion: @escaping (_ text: String?) -> ())

bold

将当前选中的非加粗文本转换为加粗(通过使用'b'标签包裹),否则从选中的文本中移除加粗格式。一个在脚本评估完成或失败时将被调用的块。

func bold(completion: ((_ error: Error?) -> ())? = nil)

italic

通过用'i'标签包裹它。

func italic(completion: ((_ error: Error?) -> ())? = nil)

underline

通过用'u'标签包裹它。

func underline(completion: ((_ error: Error?) -> ())? = nil)

strikethrough

通过用'del'标签包裹它。

func strikethrough(completion: ((_ error: Error?) -> ())? = nil)

setTextColor

设置选中文本的颜色。

func setText(color: UIColor, completion: ((_ error: Error?) -> ())? = nil)

setTextBackgroundColor

设置选中文本背景的颜色。

func setText(backgroundColor: UIColor, completion: ((_ error: Error?) -> ())? = nil)

setTextSize

设置选中文本的字体大小。

func setText(size: Int, completion: ((_ error: Error?) -> ())? = nil)

insertImage

在当前光标位置插入图片。当脚本评估完成或失败时调用的块。

func insertImage(url: String, completion: ((_ error: Error?) -> ())? = nil)

makeLink

将当前选中的文本设置为链接。如果没有选中文本,则将URL或电子邮件作为文本插入到当前光标处并将其设置为链接。当脚本评估完成或失败时调用的块。

func makeLink(url: String, completion: ((_ error: Error?) -> ())? = nil)

removeLink

移除任何至少部分选中的链接。当脚本评估完成或失败时调用的块。

func removeLink(completion: ((_ error: Error?) -> ())? = nil)

clear

清除编辑器内容。该方法移除所有块并插入新的初始空块 <div><br></div>。当脚本评估完成或失败时调用的块。

func clear(completion: ((_ error: Error?) -> ())? = nil)

focus

编辑器获得或失去焦点。

func focus(_ isFocused: Bool, completion: ((_ error: Error?) -> ())? = nil)

贡献

SQRichTextEditor 欢迎修复、改进和功能添加。如果您想贡献,请提交带详细更改说明的拉取请求。

如果您想为 editor.jseditor.css 添加或修复一些功能,您可以在以下仓库中提交拉取请求。

作者

林宇伟,[邮箱保护] @ OneupNetwork

许可证

SQRichTextEditor 在 MIT 许可下可用。有关更多信息,请参阅 LICENSE 文件。

归属权

SQRichTextEditor 使用了以下强大源代码的一部分

组件 描述 许可证
Squire Squire 是一个 HTML5 丰富文本编辑器,它在一个灵活轻盈的包中提供了强大的跨浏览器规范化。 MIT
EFColorPicker Swift 中的轻量级颜色选择器。 MIT