RichEditorView is a simple, modular, drop-in UIView subclass for Rich Text Editing.

Last update: Aug 3, 2022

RichEditorView

License: BSD 3 Cocoapods Carthage compatible

RichEditorView is a simple, modular, drop-in UIView subclass for Rich Text Editing.

Written in Swift 4

Supports iOS 8+ through Cocoapods or Carthage.

Seen in Action

Demo

Just clone the project and open RichEditorViewSample/RichEditorViewSample.xcworkspace in Xcode.

Features

Toolbar Demo

  • Bold
  • Italic
  • Subscript
  • Superscript
  • Strikethrough
  • Underline
  • Justify Left
  • Justify Center
  • Justify Right
  • Heading 1
  • Heading 2
  • Heading 3
  • Heading 4
  • Heading 5
  • Heading 6
  • Undo
  • Redo
  • Ordered List
  • Unordered List
  • Indent
  • Outdent
  • Insert Image
  • Insert Link
  • Text Color
  • Text Background Color

Installation

Cocoapods

If you have Cocoapods installed, you can use Cocoapods to include RichEditorView into your project. Add the following to your Podfile:

pod "RichEditorView"
use_frameworks!

Note: the use_frameworks! is required for pods made in Swift.

Carthage

Add the following to your Cartfile:

github 'cjwirth/RichEditorView'

Using RichEditorView

RichEditorView makes no assumptions about how you want to use it in your app. It is a plain UIView subclass, so you are free to use it wherever, however you want.

Most basic use:

editor = RichEditorView(frame: self.view.bounds)
editor.html = "<h1>My Awesome Editor</h1>Now I am editing in <em>style.</em>"
self.view.addSubview(editor)

Editing Text

To change the styles of the currently selected text, you just call methods directly on the RichEditorView:

editor.bold()
editor.italic()
editor.setTextColor(.red)

If you want to show the editing toolbar RichEditorToolbar, you will need to handle displaying it (KeyboardManager.swift in the sample project is a good start). But configuring it is as easy as telling it which options you want to enable, and telling it which RichEditorView to work on.

let toolbar = RichEditorToolbar(frame: CGRect(x: 0, y: 0, width: 320, height: 44))
toolbar.options = RichEditorDefaultOption.all
toolbar.editor = editor // Previously instantiated RichEditorView

Some actions require user feedback (such as select an image, choose a color, etc). In this cases you can conform to the RichEditorToolbarDelegate and react to these actions, and maybe display some custom UI. For example, from the sample project, we just select a random color:

private func randomColor() -> UIColor {
    let colors: [UIColor] = [
        .red, .orange, .yellow,
        .green, .blue, .purple
    ]

    let color = colors[Int(arc4random_uniform(UInt32(colors.count)))]
    return color
}

func richEditorToolbarChangeTextColor(toolbar: RichEditorToolbar) {
    let color = randomColor()
    toolbar.editor?.setTextColor(color)
}

Advanced Editing

If you need even more flexibility with your options, you can add completely custom actions, by either making an object that conforms the the RichEditorOption protocol, or configuring a RichEditorOptionItem object, and adding it to the toolbar's options:

let clearAllItem = RichEditorOptionItem(image: UIImage(named: "clear"), title: "Clear") { toolbar in
    toolbar?.editor?.html = ""
    return
}
toolbar.options = [clearAllItem]

Author

Caesar Wirth - [email protected]

@cjwirth on Twitter @cjwirth

Acknowledgements

License

RichEditorView is released under the BSD 3-Clause License. See LICENSE.md for details.

GitHub

https://github.com/cjwirth/RichEditorView
Comments
  • 1. Scroll cursor back into view when it goes out of bounds

    Fix #3

    • Add JS method to calculate the caret position within the RichEditorView
    • Set scrollView contentSize.height based on html content height
    • Change scrollView's contentOffset if caret is outside of RichEditorView's bounds
    Reviewed by jesiegel1 at 2016-03-16 03:58
  • 2. Implement the getSelectedHref method

    To add a bit of context, you want a method like this if you select an existing link in your richtext editor and want to edit it. This method allows us to pre-fill out the textfield in the "edit link" view controller.

    Reviewed by mfrawley at 2016-01-13 10:24
  • 3. run the RichEditorViewSample ,but not working to the simulator

    1.run the RichEditorViewSample ,but not working to the simulator 2.I writed the same codes as your RichEditorViewSample in swift ,but i got a error where focus on "editorView.delegate = self " can you tell me the reasons? thanks

    Reviewed by Gavinhhy at 2016-05-26 06:49
  • 4. Find new way to hide default keyboard toolbar

    The relatively common technique of hiding UIWebView's input accessory view that we are using in CJWWebView+HackishAccessoryHiding.m is most definitely a horrible piece of code. Not only that but recently it has been getting apps rejected from the app store which is an outcome nobody wants.

    Look into seeing if there is a better way to hide and/or cover up the input accessory view. Maybe this means upgrading to WKWebView, I don't really know.

    This is a bad, brittle, dangerous piece of code, and I would really like to get it out of the codebase.

    Reviewed by cjwirth at 2016-03-19 09:34
  • 5. editor view's web view doesn't retrieve image file from Documents folder

    Hi, this might not be directly related to this framework, but maybe someone can give me a hint to the right direction to take for solving this problem.

    When I try to insert an image like so: toolbar.editor!.insertImage(fileURL.absoluteString, alt: "new image")

    all works fine.

    The image data is written to a file in the documents folder and then the refreshed html contains the image tag with the image path.

    However, after I stop the simulator and restart it, the image can't be loaded into the html of the editor's web view properly.

    See the screenshots below. The image tag in the html looks like this image

    I have checked in the finder that the file is there... it has been saved indeed. doesn't matter if I convert the ui image to jpg or to png. The weird thing is that when creating the the file, the web view has to update as well and retrieve the file from the documents folder. Otherwise it wouldn't show.... the html string is properly retrieved from core data, otherwise there would not be any text with html text attributes.

    screen shot 2016-05-13 at 17 10 06

    screen shot 2016-05-13 at 17 08 37

    Reviewed by DominikButz at 2016-05-13 09:23
  • 6. Toolbar isn't a proper accessory

    Since the RichEditorToolbar isn't an accessory view to UIWebView (a really annoying problem; "Hacking Accessory Hiding" reference), the toolbar will overlap onto the editing view.

    Reviewed by AWDerh at 2015-08-05 23:19
  • 7. Editor does not scroll when cursor is placed offscreen

    When the cursor goes offscreen, and/or when text is typed offscreen, the editor does not move. This doesn't seem like an easy one to solve because of the difficulty of interfacing between the view and the HTML, but wanted to open this to think about potential solutions.

    scroll

    Reviewed by markbao at 2016-07-18 20:59
  • 8. Strange `underline`

    https://www.dropbox.com/s/x743tqtm3yfobec/UnderLine.mov?dl=0

    When I set/unset underline editor strange.

    I input Underline(1st line) after click underline. And tried unset underline and input new line (2nd line). At that time editor insert line breaks without return key.

    Reviewed by Ying1986 at 2016-05-26 11:26
  • 9. When i run the sample,it got errors from the keyboardManager ,i am not good at swift ,how should i tackle with it ?

    NSNotificationCenter.defaultCenter().addObserver(self, selector: #selector(KeyboardManager.keyboardWillShowOrHide(_:)), name: UIKeyboardWillShowNotification, object: nil)

    error: missing argument for parameter 'selector' in call

    Reviewed by KKKiller at 2016-04-18 03:14
  • 10. Focus RichEditorView when view is tapped

    How can I take a focus when I click on the REV window? For now, I can write to REV input view only if I click on the first row. I want to take a focus (start writing) after I click anywhere on the input view of REV.

    Thanks for help.

    Reviewed by Jirka1111 at 2015-10-19 15:18
  • 11. Subscript/superscript buttons do not remove formatting when calling it again

    Problem can be solved by removing in normalize.css these lines:

    sub,
    sup {
      font-size: 75%;
      line-height: 0;
      position: relative;
      vertical-align: baseline;
    }
    
    Reviewed by romanilchyshyn at 2016-06-24 15:47
  • 12. Added done option on toolbar so that we can remove the keyboard directly

    Hi There was an small issue for removing keyboard once we are done with editing we have to tap on another field than only after we can remove the Keyboard

    I have added just 2 line of code and given an option for keyboard dismiss on done button

    Reviewed by veerChauhan at 2021-08-24 09:12
  • 13. editorview Y is offset when content more large

    62621625404593_  #pic_hd

    The height of the textview on the surface layer is lengthened with the increase of the content. However, editorview is the actual height of the red part. Then the entire textview on the surface layer can be moved, and its Y axis will also change to block the view on it. Is there any good solution

    Reviewed by ljssafe at 2021-07-04 13:24
Related tags
Powerful text framework for iOS to display and edit rich text.
Powerful text framework for iOS to display and edit rich text.

YYText Powerful text framework for iOS to display and edit rich text. (It's a component of YYKit) Features UILabel and UITextView API compatible High

Aug 2, 2022
A standalone, flexible API that provides a full-featured rich text editor for iOS applications.
A standalone, flexible API that provides a full-featured rich text editor for iOS applications.

Twitter Text Editor A standalone, flexible API that provides a full featured rich text editor for iOS applications. This provides a robust text attrib

Aug 5, 2022
A rich-text editor for iOS

DTRichTextEditor This project aims to provide a replacement for Apple's severely limited UITextView and to allow for editing attributed strings. It co

Jul 26, 2022
A beautiful rich text WYSIWYG editor for iOS with a syntax highlighted source view
A beautiful rich text WYSIWYG editor for iOS with a syntax highlighted source view

ZSSRichTextEditor The Editor ZSSRichTextEditor is a beautiful Rich Text WYSIWYG Editor for iOS. It includes all of the standard editor tools one would

Jul 28, 2022
Convert text with HTML tags, links, hashtags, mentions into NSAttributedString. Make them clickable with UILabel drop-in replacement.
Convert text with HTML tags, links, hashtags, mentions into NSAttributedString. Make them clickable with UILabel drop-in replacement.

Atributika is an easy and painless way to build NSAttributedString. It is able to detect HTML-like tags, links, phone numbers, hashtags, any regex or

Aug 9, 2022
An iOS app to turn typed text into images of handwritten text in your own handwriting style.
An iOS app to turn typed text into images of handwritten text in your own handwriting style.

Text-to-Handwritting © 2021 by Daniel Christopher Long An iOS app to turn typed text into images of handwritten text in your own handwriting style. ht

Jul 1, 2022
Twitter Text Libraries. This code is used at Twitter to tokenize and parse text to meet the expectations for what can be used on the platform.

twitter-text This repository is a collection of libraries and conformance tests to standardize parsing of Tweet text. It synchronizes development, tes

Aug 10, 2022
Swift String Validator. Simple lib for ios to validate string and UITextFields text for some criterias

Swift String validator About Library for easy and fastest string validation based on сciterias. Instalation KKStringValidator is available through Coc

Dec 21, 2019
Fully open source text editor for iOS written in Swift.
Fully open source text editor for iOS written in Swift.

Edhita Fully open source text editor for iOS written in Swift. http://edhita.bornneet.com/ What Edhita means? Edhita (Romaji) == エディタ (Katakana) == Ed

Jul 30, 2022
Like a SwiftUI ViewBuilder, but for Text
Like a SwiftUI ViewBuilder, but for Text

TextBuilder Introduction Text composition in SwiftUI can often be cumbersome, especially when there's logic affecting its format and content. TextBuil

Aug 9, 2022
Get any text on your screen into your clipboard.
Get any text on your screen into your clipboard.

macOCR macOCR is a command line app that enables you to turn any text on your screen into text on your clipboard. When you envoke the ocr command, a "

Aug 4, 2022
A lightning fast, native SwiftUI scratchpad/text editor.

Sedit A lightning fast, native SwiftUI scratchpad/text editor. Sedit (Swift Edit, as in the language and as in fast) is a lightning fast basic text ed

Jan 28, 2022
Automatic summarizer text in Swift
Automatic summarizer text in Swift

Overview Reductio is a tool used to extract keywords and phrases using an implementation of the algorithm TextRank. Installation Swift Package Manager

Jun 29, 2022
Magnifying glass for text fields

Loupe Magnifying glass for text fields. Apple removed the maginifying glass when selecting texts since iOS 13, this tweak will brings it back. Compati

Dec 19, 2021
More powerful label, attributed string builder and text parser.

DDText More powerful label, attributed string builder and text parser. DDLabel More powerful label than UILabel, using TextKit. It supports features b

Oct 16, 2021
Acčento is an easy-to-use tool for adding Czech diacritics to copied text.
Acčento is an easy-to-use tool for adding Czech diacritics to copied text.

Acčento is an easy-to-use tool for adding Czech diacritics to copied text. The app lives in the menu bar and is activated using a global hot key.

Sep 16, 2021
A small utility to paste text to the clipboard on a jailbroken iPhone

pbpaste allows you to paste text from your iPhone's terminal app to the clipboard. How to use pbpaste Download the file in the binary folder. Copy the

Sep 22, 2021
Paranoid text spacing in Objective-C

Pangu.objective-c Paranoid text spacing for good readability, to automatically insert whitespace between CJK (Chinese, Japanese, Korean), half-width E

Mar 10, 2021
Lightweight library to set an Image as text background. Written in swift.
Lightweight library to set an Image as text background. Written in swift.

![](https://img.shields.io/badge/Swift 2-compatible-4BC51D.svg?style=flat-square) Simple and light weight UIView that animate text with an image. Demo

Aug 1, 2022