Coder Social home page Coder Social logo

kiransarella / richeditor Goto Github PK

View Code? Open in Web Editor NEW

This project forked from will-lumley/richeditor

0.0 1.0 0.0 769 KB

The macOS RichEditor library allows you to turn a native NSTextView into a full blown WYSIWYG editor.

License: MIT License

Ruby 1.30% Swift 98.70%

richeditor's Introduction

RichEditor: Customisable NSTextview WYSIWYG Editor

RichEditor

CI Status Version Carthage Compatible SPM Compatible Swift 5.0 Platform License Twitter

RichEditor is a WYSIWYG editor written in pure Swift. RichEditor is a direct subclass of NSTextView so you'll feel perfectly comfortable using it.

If you are developing a macOS application that uses an NSTextView and you want your users to be able to format their text, you are forced to use the usesInspectorBar property, which adds a formatting toolbar to your NSTextView.

However if you want to modify the UI or modify functionality at all, you'll soon find a dead-end. This is where RichEditor comes in.

Just drag RichEditor into your UI, and you can use RichEditors functionality to easily programatically control which parts of your text are formatted and how. From bolding and underlining to text alignment and text colour, you have control over your text view. You can create your own UI the way you want and connect your UI to the RichEditor functionality.

However if you want to use a template UI, RichEditor has one last trick up its sleeve for you. Simply call the configureToolbar() from your instance of RichEditor and you will have our pre-made toolbar ready to go!

RichEditor also handles the difficult logic of handling text formatting when a user has already highlighted a piece of text, or when you want to export the text with HTML formatting.

RichEditor allows you to control:

  • Bolding
  • Italics
  • Underlining
  • Font Selection
  • Font Size Selection
  • Text Alignment (Left, Centre, Right, Justified)
  • Text Colour
  • Text Highlight Colour
  • Link Insertion
  • Bullet Points
  • Text Strikethrough
  • Attachment Insertion

To do:

  • Implement better bullet point formatting

You can see the provided RichEditorToolbar in action, as well as the export functionality in the screenshots below. These screenshots are taken from the Example project that you can use in the repository in the Example directory.

Screen Shot 2022-01-25 at 4 00 14 pm

Screen Shot 2022-01-25 at 4 00 23 pm

Usage

RichEditor is a direct subclass of NSTextView and as such, you can drag NSTextView into your storyboard and subclass it there, or you can directly instantiate RichEditor directly in your code using the initialisers from NSTextView.

Exporting

RichEditor allows you to export the content of the RichEditor as a HTML. You can do this as follows.

let html = try richEditor.html()

html() returns an optional String type, and will throw in the event of an error.

Format Types

Below is a walkthrough of formatting that RichEditor allows you to use.


Bold

richEditor.toggleBold()


Italic

richEditor.toggleItalic()


Underline

richEditor.toggleUnderline(.single)

toggleUnderline(_) takes NSUnderlineStyle as an argument, so you can specify which underline style should be applied.


Strikethrough

richEditor.toggleStrikethrough(.single)

toggleStrikethrough(_) takes NSUnderlineStyle as an argument, so you can specify which underline style should be applied with your strikethrough.


Text Colour

richEditor.applyColour(textColour: .green)

applyColour(textColour:) takes NSColor as an argument, so you can specify which colour should be applied.


Text Highlighy Colour

richEditor.applyColour(highlightColour: .green)

applyColour(highlightColour:) takes NSColor as an argument, so you can specify which colour should be applied.


Font

richEditor.apply(font: .systemFont(ofSize: 12))

applyColour(font:) takes NSFont as an argument, so you can specify which font should be applied.


Text Alignment

richEditor.apply(alignment: .left)

applyColour(alignment:) takes NSTextAlignment as an argument, so you can specify which alignment should be applied.


Links

richEditor.insert(link: url, with: name)

insert(link:, with:, at:) takes a URL as an argument, so you can specify which alignment should be applied.

A String is also taken for how you want this link to appear to the user.

An optional Int argument can also be supplied which indicates what index of the NSTextViews string the link should be insert at. If nil, the link will be appended to the end of the string.


Example Project

To run the example project, clone the repo, and run pod install from the Example directory first.

Requirements

FaviconFinder supports iOS 10.0 and above & macOS 10.10 and above.

Installation

Cocoapods

RichEditor is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'RichEditor', '1.0.1'

Carthage

RichEditor is also available through Carthage. To install it, simply add the following line to your RichEditor:

github "will-lumley/RichEditor" == 1.0.1

Swift Package Manager

RichEditor is also available through Swift Package Manager. To install it, simply add the dependency to your Package.Swift file:

...
dependencies: [
    .package(url: "https://github.com/will-lumley/RichEditor.git", from: "1.0.1"),
],
targets: [
    .target( name: "YourTarget", dependencies: ["RichEditor"]),
]
...

Author

William Lumley, [email protected]

License

RichEditor is available under the MIT license. See the LICENSE file for more info.

richeditor's People

Contributors

will-lumley avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.