Welcome to the documentation for DTCoreText, a powerful and flexible text layout engine for iOS and macOS. This library allows you to easily convert HTML and CSS styled text into NSAttributedString, making it simple to display richly formatted text in your application.
Description
DTCoreText provides an intuitive way to convert HTML text and CSS styles into NSAttributedString, which can be rendered in a UITextView or UILabel. It supports inline and block-level styled elements, font customization, text alignment, spacing, lists, links, images, and much more. With DTCoreText, you can easily display richly formatted text in your app while maintaining full control over the layout.
Installation
To install DTCoreText, you can use CocoaPods or manually add it to your project.
CocoaPods
To install DTCoreText using CocoaPods, add the following line to your Podfile:
pod 'DTCoreText'
Then, run the pod install
command in your terminal and import DTCoreText into your project.
Manual Installation
If you prefer manual installation, follow these steps:
- Download the latest version of DTCoreText from the GitHub repository.
- Add the DTCoreText folder to your project.
- Make sure to add the necessary frameworks and libraries to your project:
- CoreText.framework
- CoreGraphics.framework
- QuartzCore.framework
Once you have completed these steps, you are ready to start using DTCoreText in your project.
Basic Usage
To convert HTML text and CSS styles into NSAttributedString, follow these steps:
- Create an instance of DTHTMLAttributedStringBuilder.
- Set the HTML string using the
setHTML:
method. - Set optional configuration options, such as the base URL, text size multiplier, and available fonts.
- Call the
generatedAttributedString
method to obtain the converted NSAttributedString.
Here is an example of basic usage:
DTHTMLAttributedStringBuilder *stringBuilder = [[DTHTMLAttributedStringBuilder alloc] initWithHTML:htmlData options:nil documentAttributes:nil];
NSAttributedString *attributedString = [stringBuilder generatedAttributedString];
Text Formatting
Bold
To apply bold formatting to a text segment, use the <b>
tag or the corresponding CSS selector font-weight:bold;
.
This is <b>bold text</b>.
Italic
To apply italic formatting to a text segment, use the <i>
tag or the corresponding CSS selector font-style:italic;
.
This is <i>italic text</i>.
Underline
To apply underline formatting to a text segment, use the <u>
tag or the corresponding CSS selector text-decoration:underline;
.
This is <u>underlined text</u>.
Strikethrough
To apply strikethrough formatting to a text segment, use the <s>
tag or the corresponding CSS selector text-decoration:line-through;
.
This is <s>strikethrough text</s>.
Text Color
To change the color of the text, apply a CSS style that sets the color
property to the desired color value.
<span style="color: #FF0000">This is red text</span>.
Text Alignment
To align the text, apply a CSS style that sets the text-align
property to one of the following values: left
, right
, center
, or justify
.
<div style="text-align: center">This is centered text</div>
Paragraph Spacing
To add spacing between paragraphs, use the margin-bottom
CSS property. You can specify the desired spacing in pixels.
<p style="margin-bottom: 10px">This is a paragraph with spacing.</p>
Line Spacing
To modify the line spacing, set the line-height
CSS property to adjust the spacing between lines of text. You can use a numerical value or a percentage.
<p style="line-height: 1.5">This paragraph has increased line spacing.</p>
Lists
Unordered List
To create an unordered (bulleted) list, use the <ul>
tag for the list container and the <li>
tags for each list item.
<ul>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ul>
Ordered List
To create an ordered (numbered) list, use the <ol>
tag for the list container and the <li>
tags for each list item.
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
Link
To create a link, use the <a>
tag with the appropriate URL.
<a href="https://example.com">This is a link</a>
Image
To display an image, use the <img>
tag with the image source URL.
<img src="image.jpg" alt="Image description">
Font
Font Family
To change the font family, apply a CSS style that sets the font-family
property to the desired font name.
<p style="font-family: Helvetica, Arial, sans-serif">This is text in a specific font.</p>
Font Size
To change the font size, apply a CSS style that sets the font-size
property to the desired size value. You can use pixels, percentages, or other valid units.
<p style="font-size: 18px">This paragraph has a larger font size.</p>
Font Style
To apply a specific font style, use the font-style
CSS property. The allowed values are normal
, italic
, and oblique
.
<p style="font-style: italic">This is italicized text.</p>
Paragraph Indentation
You can add indentation to a paragraph by adjusting the text-indent
CSS property.
<p style="text-indent: 20px">This paragraph has an indent.</p>
Bullet Type
You can change the bullet type for unordered lists by modifying the CSS list-style-type
property.
<ul style="list-style-type: circle">
<li>List item 1</li>
<li>List item 2</li>
</ul>
Heading Size
You can specify different sizes for headings using the <h1>
to <h6>
tags, where the <h1>
tag has the largest size and the <h6>
tag has the smallest size.
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
Code Blocks
To display code blocks, use the <pre>
tag with the <code>
tag for inline code. This is useful for showcasing code snippets or examples.
<pre>
<code>import UIKit</code>
</pre>
With the information provided in this documentation, you can now leverage the power of DTCoreText to convert your HTML and CSS styled text into beautifully formatted NSAttributedString in your application.