Markdown syntax highlighter for iOS

Matteo Gavagnin

Last update: Dec 29, 2022

Related tags

Text Marklight

Overview

Marklight

Markdown syntax highlighter for iOS and macOS.

Description

Marklight is a drop in component to easily add realtime Markdown syntax highlight on any user editable text view in iOS and macOS applications. Marklight doesn't include HTML generation from Markdown, but you can use one of the many other components available like Markingbird.

Regular expressions are taken from Markingbird, a Markdown parser and html generator.

Features

Requirements

iOS 8.0+
Xcode 9.3+
macOS 10.11+

Installation

CocoaPods

CocoaPods is a dependency manager for Cocoa projects. You can install it with the following command:

$ gem install cocoapods

CocoaPods 1.0.0+ is required to build Marklight.

To integrate Marklight into your Xcode project using CocoaPods, specify it in your Podfile:

source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'
use_frameworks!

pod 'Marklight'

Then, run the following command:

$ pod install

Carthage

Carthage is a decentralized dependency manager that builds your dependencies and provides you with binary frameworks.

You can install Carthage with Homebrew using the following command:

$ brew update
$ brew install carthage

To integrate Marklight into your Xcode project using Carthage, specify it in your Cartfile:

github "macteo/Marklight"

Run carthage update --platform iOS to build the framework and drag the built Marklight.framework into your Xcode project.

Manually

Add the Marklight Xcode project to your own. Then add the Marklight framework as desired to the embedded binaries of your app's target.

Usage

In this repository you can find a sample project with few lines of code in the ViewController class for a jumpstart.

Sample code is written in Swift but Objective-C should be supported too, if you find an incompatibility please open an issue.

Integration

The easiest way to crete a user editable UITextView with markdown syntax highlight is to use the provided MarklightTextStorage class as NSTextStorage and add the UITextView's textLayout to the MarklightTextStorage text storage.

Import Marklight modules into your Swift class

import Marklight

or if you are writing in Objective-C

#import <Marklight/Marklight-Swift.h>

Keep in mind the you have to let the project generate the Bridging Header otherwise the integration may fail.

In your UIViewController subclass keep a strong instance of the this MarklightTextStorage class.

let textStorage = MarklightTextStorage()

Customize the appearance as desired:

Dynamic text style.
Markdown syntax color.
Code's font and color.
Quotes' font and color.

As per Apple's documentation it should be enough to assign the UITextView's NSLayoutManager to the NSTextStorage subclass, in our case MarklightTextStorage.

 textStorage.addLayoutManager(textView.layoutManager)

However I'm experiencing some crashes if I want to preload some text instead of letting the user start from scratch with a new text. A workaround is proposed below.

For simplicity we assume you have a String to be highlighted inside an editable UITextView loaded from a storyboard.

let string = "# My awesome markdown string"

Convert string to an NSAttributedString

let attributedString = NSAttributedString(string: string)

Set the loaded string to the UITextView

textView.attributedText = attributedString

Append the loaded string to the NSTextStorage

textStorage.appendAttributedString(attributedString)

Enjoy.

Acknowledgements

Matteo Gavagnin – @macteo
Christian Tietze (macOS Port) - @ctietze, GitHub

Marklight is heavily based on Markingbird, so many thanks to Kristopher Johnson and every previous contribution on which Markingbird is based upon.

License

Marklight is released under the MIT license. See LICENSE for details.

Comments

It crashes when trying to set the textView content

When I try to set the content the application crashes. This is how I set it:

internal func setBody(body: String) {
        let attributed = NSAttributedString(string: body)
        self.bodyTextView.attributedText = attributed
        self.textStorage.appendAttributedString(attributed)
}

Before I've initialized the MarklightTextStorage and add the layout manager. This is the crash I got:

2016-05-21 10:49:24.892 Gitdo[49591:2764396] *** Terminating app due to uncaught exception 'NSRangeException', reason: '*** -[__NSCFConstantString _getBlockStart:end:contentsEnd:forRange:stopAtLineSeparators:]: Range {0, 53} out of bounds; string length 0'
*** First throw call stack:
(
    0   CoreFoundation                      0x000000010e85cf45 __exceptionPreprocess + 165
    1   libobjc.A.dylib                     0x000000011386ddeb objc_exception_throw + 48
    2   CoreFoundation                      0x000000010e85ce7d +[NSException raise:format:] + 205
    3   Foundation                          0x000000010f37c977 -[NSString _getBlockStart:end:contentsEnd:forRange:stopAtLineSeparators:] + 229
    4   Foundation                          0x000000010f37c88b -[NSString getParagraphStart:end:contentsEnd:forRange:] + 41
    5   UIFoundation                        0x0000000114d2cade _NSFastFillAllLayoutHolesForGlyphRange + 1266
    6   UIFoundation                        0x0000000114d2a14e -[NSLayoutManager(NSPrivate) _rectArrayForRange:withinSelectionRange:rangeIsCharRange:singleRectOnly:fullLineRectsOnly:inTextContainer:rectCount:rangeWithinContainer:glyphsDrawOutsideLines:rectArray:rectArrayCapacity:] + 822
    7   UIFoundation                        0x0000000114d2d5bc -[NSLayoutManager(NSPrivate) _rectArrayForRange:withinSelectionRange:rangeIsCharRange:singleRectOnly:fullLineRectsOnly:inTextContainer:rectCount:rangeWithinContainer:glyphsDrawOutsideLines:] + 117
    8   UIFoundation                        0x0000000114d65fa0 -[NSLayoutManager rectArrayForCharacterRange:withinSelectedCharacterRange:inTextContainer:rectCount:] + 80
    9   UIKit                               0x000000011250669d -[_UITextContainerView updateInsertionPointStateAndRestartTimer:] + 311
    10  UIFoundation                        0x0000000114d31ee3 -[NSLayoutManager(NSPrivate) _invalidateLayoutForExtendedCharacterRange:isSoft:invalidateUsage:] + 2118
    11  UIFoundation                        0x0000000114d61fea -[NSLayoutManager textStorage:edited:range:changeInLength:invalidatedRange:] + 219
    12  UIFoundation                        0x0000000114d622d2 -[NSLayoutManager processEditingForTextStorage:edited:range:changeInLength:invalidatedRange:] + 47
    13  UIFoundation                        0x0000000114d89a76 -[NSTextStorage _notifyEdited:range:changeInLength:invalidatedRange:] + 152
    14  UIFoundation                        0x0000000114d89591 -[NSTextStorage processEditing] + 349
    15  UIFoundation                        0x0000000114d891eb -[NSTextStorage endEditing] + 82
    16  UIKit                               0x00000001124eff2c -[UITextView setAttributedText:] + 250
    17  Gitdo                               0x000000010c87a842 _TFC5Gitdo10EditorView7setBodyfSST_ + 146
    18  Gitdo                               0x000000010c8072ea _TFC5Gitdo15EditorPresenter9viewReadyfT_T_ + 170
    19  Gitdo                               0x000000010c87a5e5 _TFC5Gitdo10EditorView11viewDidLoadfT_T_ + 613
    20  Gitdo                               0x000000010c87a792 _TToFC5Gitdo10EditorView11viewDidLoadfT_T_ + 34
    21  UIKit                               0x0000000111ceccc4 -[UIViewController loadViewIfRequired] + 1198
    22  UIKit                               0x0000000111cf2c7b -[UIViewController __viewWillAppear:] + 120
    23  UIKit                               0x0000000111d22a37 -[UINavigationController _startCustomTransition:] + 1203
    24  UIKit                               0x0000000111d32cdb -[UINavigationController _startDeferredTransitionIfNeeded:] + 712
    25  UIKit                               0x0000000111d33cea -[UINavigationController __viewWillLayoutSubviews] + 57
    26  UIKit                               0x0000000111ed9c85 -[UILayoutContainerView layoutSubviews] + 248
    27  UIKit                               0x0000000111c0ee40 -[UIView(CALayerDelegate) layoutSublayersOfLayer:] + 710
    28  QuartzCore                          0x000000011054259a -[CALayer layoutSublayers] + 146
    29  QuartzCore                          0x0000000110536e70 _ZN2CA5Layer16layout_if_neededEPNS_11TransactionE + 366
    30  QuartzCore                          0x0000000110536cee _ZN2CA5Layer28layout_and_display_if_neededEPNS_11TransactionE + 24
    31  QuartzCore                          0x000000011052b475 _ZN2CA7Context18commit_transactionEPNS_11TransactionE + 277
    32  QuartzCore                          0x0000000110558c0a _ZN2CA11Transaction6commitEv + 486
    33  UIKit                               0x0000000111b54ca4 _UIApplicationHandleEventQueue + 7329
    34  CoreFoundation                      0x000000010e789011 __CFRUNLOOP_IS_CALLING_OUT_TO_A_SOURCE0_PERFORM_FUNCTION__ + 17
    35  CoreFoundation                      0x000000010e77ef3c __CFRunLoopDoSources0 + 556
    36  CoreFoundation                      0x000000010e77e3f3 __CFRunLoopRun + 867
    37  CoreFoundation                      0x000000010e77de08 CFRunLoopRunSpecific + 488
    38  GraphicsServices                    0x000000011595ead2 GSEventRunModal + 161
    39  UIKit                               0x0000000111b5a30d UIApplicationMain + 171
    40  Gitdo                               0x000000010c7c8a72 main + 114
    41  libdyld.dylib                       0x00000001149b892d start + 1
)
libc++abi.dylib: terminating with uncaught exception of type NSException

Am I doing anything wrong? Thanks!

question

opened by pepicrft 8

macOS Framework (Work in Progress)
After the announcement in #5, here's the nearly finished macOS library version.

[x] Test Carthage install

[ ] Test CocoaPods install outside the sample project

I have performed a few changes.

Setex underlines are not hidden anymore, because that was super weird.

Not using removeWholeAttributes anymore; that does not produce the same result as on iOS.

Not posting edited messages as often because they change the caret location on macOS.

removeWholeAttributes() Problem

Here is the removeWholeAttributes() evidence :)

Before:

After typing, removing the styles:
opened by DivineDominion 7
make Marklight processing pluggable

While the MarklightTextStorage subclass works nice, if you have another external NSTextStorage subclass already, you cannot combine the two. This PR attempts to minimize the work you need to perform in your NSTextStorage subclass through delegation to a MarklightTextProcessor service instead of through inheritance.

(Works a bit towards #8 already, putting the style configuration in the MarklightTextProcessor and out of the text storage, where a style object can be extracted from later.)

I am not 100% happy with the name of the types I came up with, especially MarklightStyleApplier as a protocol that takes the minimum from NSMutableAttributesString, intending to make writing test doubles easier.

opened by DivineDominion 6
Dynamic height view
Marklight looks great, fantastic work!

When using a plain UITextView, as I type the size of the view changes to fit the content/text of the view. When enabling Marklight, this behaviour seems to stop. Do you know what could be causing this?

Only constraints for the view in question are (using PureLayout):

view.autoPinEdge(.top, to: .bottom, of: previousView, withOffset: 8) view.autoPinEdge(toSuperviewEdge: .left, withInset: 8) view.autoPinEdge(toSuperviewEdge: .right, withInset: 8)
opened by Dan2552 3
Change default text color

Hello.

I have been trying to change the UITextView textColor while using MarklightTextStorage() and I cannot achieve that.

The textView's default color keeps swapping itself to black, even if I force it to be a specific color.

I'm wondering that this might me something within the textStorage.marklightTextProcessor properties.

Can I get some help on how to achieve this please?

Thanks.

opened by ivancantarino 1
macOS Framework

Hey,

I'm beginning to work on making the code universal and provide both 2 platforms for Carthage and CocoaPods. I may need some help with configuring the podspec in the end because I'm not an avid CocoaPods user, though. :)

PR will follow when the first batch of changes is done and the Mac target compiles.

Here'd be a good place for additional wishes 🎁

opened by DivineDominion 1
Xcode 8.2 requires conversion to Swift 3

I just updated to Xcode 8.2 and have been using Marklight as a Cocoapod. Upon running Xcode it requires any Swift code to be updated to Swift 3 syntax. Previously Swift 2.3 was allowed, which did not require any changes. When converting to Swift 3 the wizard will recommend many changes and the end result is that there will be many errors.

Could you please update the code for Swift 3?
enhancement

opened by tylerjames 1
refactoring: extracting Style or Theme

Hey,

as I was extracting the iOS specific text stuff that doesn't work on macOS, I found there's no need to make the Marklight struct a container of global values. The MarklightTextStorage duplicates all these settings again and acts as a façade.

To prepare user-cusomizable theming, I was thinking about moving all the visual settings (fonts, colors, ...) into a MarklightStyle struct that the text storage consumes. It then passes the settings on to the regex processor. This will get rid of global library state and make the processor a pure function, which may turn out to make testing easier.

What do you think @macteo?

opened by DivineDominion 0
Custom attributes

Do we have any insight on how to customize the highlightning for custom attributes? say I want to add something called "user mention" like: [user][username], is this possible? if not out of the box then maybe guide me to the correct classes to implement it myself

opened by SolorzanoJose 0
autolink pattern matches closing paren in links

for example in, [example](http://example.com)

clicking on "example" takes you to the correct destination, but clicking on the link itself takes you to "http://example.com)"

opened by greay 0
Hidden syntax problem

When I set textStorage.marklightTextProcessor.hideSyntax = true, then the "\n" character's font size will be also 0.1! It loos like you start a new line but when markdown is active then it "delete" the line..

Is there any way to not change \n character's font size?

opened by danielmekis 0

Crash when editing text >4096 characters

I can reliably crash my app with the following error if I try to edit a textview containing >4096 characters:

int main(int, char **):17 - Uncaught exception: The index -4097 is invalid
2017-11-06 14:45:18.194 int main(int, char **):18 - Stack trace: (
	0   CoreFoundation                      0x000000010aadf1cb __exceptionPreprocess + 171
	1   libobjc.A.dylib                     0x000000010ba32f41 objc_exception_throw + 48
	2   CoreFoundation                      0x000000010ab53b95 +[NSException raise:format:] + 197
	3   Foundation                          0x0000000109d1665e -[NSString rangeOfComposedCharacterSequenceAtIndex:] + 73
	4   UIFoundation                        0x000000010f9cecd1 _NSFastFillAllGlyphHolesForCharacterRange + 604
	5   UIFoundation                        0x000000010fa0fbd9 -[NSLayoutManager glyphRangeForCharacterRange:actualCharacterRange:] + 64
	6   UIKit                               0x0000000107d8ddc8 __38-[UITextView _rectForScrollToVisible:]_block_invoke + 73
	7   UIFoundation                        0x000000010fa1322c -[NSLayoutManager(TextLocking) coordinateAccess:] + 55
	8   UIKit                               0x0000000107d8db69 -[UITextView _rectForScrollToVisible:] + 281
	9   UIKit                               0x0000000107d89f04 -[UITextView _updateContentSize] + 721
	10  CoreFoundation                      0x000000010aa7b07c __CFNOTIFICATIONCENTER_IS_CALLING_OUT_TO_AN_OBSERVER__ + 12
	11  CoreFoundation                      0x000000010aa7af7a _CFXRegistrationPost + 442
	12  CoreFoundation                      0x000000010aa7acc2 ___CFXNotificationPost_block_invoke + 50
	13  CoreFoundation                      0x000000010aa3ca32 -[_CFXNotificationRegistrar find:object:observer:enumerator:] + 1826
	14  CoreFoundation                      0x000000010aa3bbac _CFXNotificationPost + 652
	15  Foundation                          0x0000000109cbc842 -[NSNotificationCenter postNotificationName:object:userInfo:] + 66
	16  UIKit                               0x0000000107da76cf __64-[_UITextContainerView _setFrameOrBounds:oldRect:settingAction:]_block_invoke.60 + 212
	17  UIKit                               0x0000000107da754c -[_UITextContainerView _setFrameOrBounds:oldRect:settingAction:] + 607
	18  UIKit                               0x0000000107da7a46 -[_UITextContainerView setFrame:] + 225
	19  UIKit                               0x0000000107da7cf0 -[_UITextContainerView setConstrainedFrameSize:] + 542
	20  UIFoundation                        0x000000010f9d14c7 -[NSLayoutManager(NSPrivate) _resizeTextViewForTextContainer:] + 745
	21  UIFoundation                        0x000000010f9d109d -[NSLayoutManager(NSPrivate) _recalculateUsageForTextContainerAtIndex:] + 2232
	22  UIFoundation                        0x000000010fa0801e _enableTextViewResizing + 228
	23  UIFoundation                        0x000000010fa0c556 -[NSLayoutManager textStorage:edited:range:changeInLength:invalidatedRange:] + 584
	24  UIFoundation                        0x000000010fa0c5aa -[NSLayoutManager processEditingForTextStorage:edited:range:changeInLength:invalidatedRange:] + 47
	25  UIFoundation                        0x000000010fa37cb3 -[NSTextStorage _notifyEdited:range:changeInLength:invalidatedRange:] + 168
	26  UIFoundation                        0x000000010fa377f2 -[NSTextStorage processEditing] + 372
	27  Marklight                           0x00000001042fc9d7 _T09Marklight0A11TextStorageC14processEditingyyF + 407
	28  Marklight                           0x00000001042fcb44 _T09Marklight0A11TextStorageC14processEditingyyFTo + 36
	29  UIFoundation                        0x000000010fa3743b -[NSTextStorage endEditing] + 83
	30  UIKit                               0x0000000107df43a9 -[UITextInputController _insertText:fromKeyboard:] + 525
	31  UIKit                               0x0000000107df5e20 -[UITextInputController deleteBackward] + 230
	32  UIKit                               0x0000000107d8d5f7 -[UITextView deleteBackward] + 37
	33  UIKit                               0x00000001073db56d -[UIKeyboardImpl deleteBackwardAndNotify:] + 134
	34  UIKit                               0x00000001073d6c63 -[UIKeyboardImpl performKeyboardOutput:] + 637
	35  UIKit                               0x00000001073d6155 __55-[UIKeyboardImpl handleKeyboardInput:executionContext:]_block_invoke_2 + 270
	36  UIKit                               0x0000000107e3c2f5 -[UIKeyboardTaskQueue continueExecutionOnMainThread] + 374
	37  Foundation                          0x0000000109d1c948 __NSThreadPerformPerform + 334
	38  CoreFoundation                      0x000000010aa822b1 __CFRUNLOOP_IS_CALLING_OUT_TO_A_SOURCE0_PERFORM_FUNCTION__ + 17
	39  CoreFoundation                      0x000000010ab21d31 __CFRunLoopDoSource0 + 81
	40  CoreFoundation                      0x000000010aa66c19 __CFRunLoopDoSources0 + 185
	41  CoreFoundation                      0x000000010aa661ff __CFRunLoopRun + 1279
	42  CoreFoundation                      0x000000010aa65a89 CFRunLoopRunSpecific + 409
	43  GraphicsServices                    0x00000001104f09c6 GSEventRunModal + 62
	44  UIKit                               0x00000001070d7d30 UIApplicationMain + 159
	45  Chime Spaces                        0x0000000102d79e42 main + 66
	46  libdyld.dylib                       0x000000010dcc0d81 start + 1
)

It seems to have a problem processing longer text, the -4097 is suspicious, it makes it look like there is an overflow or something.

In order to achieve this I copied a few paragraphs of text, pasted them into Sublime until I got to 4096 or so, and then pasted them into my text view in the simulator. After pasting things will work fine, but then after typing some more characters or possibly backspacing or dismissing the keyboard the crash will happen. It seems to occur during the processEditing() method

opened by tylerjames 5