AttributedTextView
创建支持多个链接和 HTML 的 attributed UITextView 的最简单方式。
查看演示应用程序和游乐场,了解如何使用 AttributedTextView 的详细信息。
要求
- iOS 8.0+
- Xcode 8.0+
使用
一般用法
在界面构建器中,将 UITextView 放置在画布上,将基类设置为 AttributedTextView,并为视图控制器中的属性创建引用输出。以下示例中,此属性名为 textView1。设置属性时,始终分配给属性。
段落样式
请注意,段落功能仅在调用过 .paragraphApplyStyling 函数后才会应用。一开始,段落样式将使用默认样式。每次范围改变(在 .all、.match* 或 .append 后发生)后,样式将重置为默认。
活动范围
样式始终应用于活动范围。在执行字符串函数时,则该整个字符串将成为活动范围。如果你使用 .append 添加其他字符串,则最新字符串将成为活动范围。使用加号时,则会在两个 Attributer 对象上进行替换。在执行 append 之前,将首先执行那些对象的函数。所以如果你执行 .all,则仍只有一个字符串是活动范围。你可以使用括号来影响执行顺序。
例如,这里所有文本的大小将是 20
("red".red + "blue".blue).all.size(20)
这里只有文本 "blue" 的大小将是 20
"red".red + "blue".blue.all.size(20)
这样所有文本的大小将是 20
"red".red.append("blue").blue.all.size(20)
可点击链接
当使用 AttributedTextView 并使用 .makeInteract 创建链接时,请注意它还会自动设置以下属性,这些属性对于链接的正常工作是必需的。
isUserInteractionEnabled = true
isSelectable = true
isEditable = false
样例代码
这里是一些基本函数的示例
textView1.attributer =
"1. ".red
.append("This is the first test. ").green
.append("Click on ").black
.append("evict.nl").makeInteract { _ in
UIApplication.shared.open(URL(string: "http://evict.nl")!, options: [:], completionHandler: { completed in })
}.underline
.append(" for testing links. ").black
.append("Next test").underline.makeInteract { _ in
print("NEXT")
}
.all.font(UIFont(name: "SourceSansPro-Regular", size: 16))
.setLinkColor(UIColor.purple)
一些更多属性,现在使用 + 而不是 .append
textView1.attributer =
"2. red, ".red.underline.underline(0x00ff00)
+ "green, ".green.fontName("Helvetica").size(30)
+ "cyan, ".cyan.size(22)
+ "orange, ".orange.kern(10)
+ "blue, ".blue.strikethrough(3).baselineOffset(8)
+ "black.".shadow(color: UIColor.gray, offset: CGSize(width: 2, height: 3), blurRadius: 3.0)
一个 match 和 matchAll 示例
textView1.attributer = "It is this or it is that where the word is is selected".size(20)
.match("is").underline.underline(UIColor.red)
.matchAll("is").strikethrough(4)
一个标签和提及的示例
textView1.attributer = "@test: What #hashtags do we have in @evermeer #AtributedTextView library"
.matchHashtags.underline
.matchMentions
.makeInteract { link in
UIApplication.shared.open(URL(string: "https://twitter.com\(link.replacingOccurrences(of: "@", with: ""))")!, options: [:], completionHandler: { completed in })
}
一个 HTML 示例
textView1.attributer = "My name is: <b>Edwin</b><br/>With a bulet list<br/><ul><li>item 1</li><li>item 2</li></ul>".html
一些其他文本格式化示例
textView1.attributer = (
"test stroke".strokeWidth(2).strokeColor(UIColor.red)
+ "test stroke 2\n".strokeWidth(2).strokeColor(UIColor.blue)
+ "test strikethrough".strikethrough(2).strikethroughColor(UIColor.red)
+ " test strikethrough 2\n".strikethrough(2).strikethroughColor(UIColor.yellow)
+ "letterpress ".letterpress
+ " obliquenes\n".obliqueness(0.4).backgroundColor(UIColor.cyan)
+ "expansion\n".expansion(0.8)
).all.size(24)
段落格式化
textView1.attributer = (
"The quick brown fox jumps over the lazy dog.\nPack my box with five dozen liquor jugs.\nSeveral fabulous dixieland jazz groups played with quick tempo."
.paragraphLineHeightMultiple(5)
.paragraphLineSpacing(6)
.paragraphMinimumLineHeight(15)
.paragraphMaximumLineHeight(50)
.paragraphLineSpacing(10)
.paragraphLineBreakModeWordWrapping
.paragraphFirstLineHeadIndent(20)
.paragraphApplyStyling
).all.size(12)
在 UILabel 上使用 attributedText 功能
您还可以在您的 UILabel 上使用 Attributer。您不能使用 makeInteract 函数。
let myUILabel = UILabel()
myUILabel.attributedText = ("Just ".red + "some ".green + "text.".orange).attributedText
扩展 AttributedTextView
在示例应用中,您可以看到如何通过自定义属性/函数扩展 AttributedTextView 以执行多个操作。这里有一个简单的示例,展示了如何创建一个 myTitle 属性,它可以设置多个属性
extension Attributer {
open var myTitle: Attributer {
get {
return self.fontName("Arial").size(28).color(0xffaa66).kern(5)
}
}
}
public extension String {
var myTitle: Attributer {
get {
return attributer.myTitle
}
}
}
装饰 Attributed 对象
在示例应用中,还有一个小示例,展示了您如何装饰 Attributed 对象以应用默认样式。
attributedTextView.attributer = decorate(4) { content in return content
+ "This is our custom title".myTitle
}
装饰函数可能看起来像这样
func decorate(_ id: Int, _ builder: ((_ content: Attributer) -> Attributer)) -> Attributer {
var b = "Sample \(id + 1):\n\n".red
b = builder(b) // Now add the content
return b
}
创建自己的自定义标签
还有一个 AttributedLabel 类,它继承自 UILabel,使得创建包含界面构建支持的自定义控件变得容易。如果您在界面构建中将标签的类设置为您的子类(以下示例中的 AttributedLabelSubclassDemo),那么您将根据在 configureAttributedLabel 函数中实现的内容看到界面构建中的文本格式。以下是一个添加了 highlightText 属性的示例,以使部分文本突出显示。
import AttributedTextView
import UIKit
@IBDesignable open class AttributedLabelSubclassDemo: AttributedLabel {
// Add this field in interfacebuilder and make sure the interface is updated after changes
@IBInspectable var highlightText: String? {
didSet { configureAttributedLabel() }
}
// Configure our custom styling.
override open func configureAttributedLabel() {
self.numberOfLines = 0
if let highlightText = self.highlightText {
self.attributedText = self.text?.green.match(highlightText).red.attributedText
} else {
self.attributedText = self.text?.green.attributedText
}
layoutIfNeeded()
}
}
您可以在以下位置找到代码:图标列表代码
创建自己的自定义文本视图
您可以使用 AttributedTextView 做和标签一样的事情(见上一段)。在下面的示例中,在 interfacebuilder 中设置了两个属性,linkText 是将被点击的文本部分,而 linkUrl 将是要打开的网页。
import AttributedTextView
import UIKit
@IBDesignable class AttributedTextViewSubclassDemo: AttributedTextView {
// Add this field in interfacebuilder and make sure the interface is updated after changes
@IBInspectable var linkText: String? {
didSet { configureAttributedTextView() }
}
// Add this field in interfacebuilder and make sure the interface is updated after changes
@IBInspectable var linkUrl: String? {
didSet { configureAttributedTextView() }
}
// Configure our custom styling.
override func configureAttributedTextView() {
if let text = self.text, let linkText = self.linkText, let linkUrl = self.linkUrl {
self.attributer = text.green.match(linkText).makeInteract { _ in
UIApplication.shared.open(URL(string: linkUrl)!, options: [:], completionHandler: { completed in })
}
} else {
self.attributer = (self.text ?? "").green
}
layoutIfNeeded()
}
}
安装
CocoaPods
CocoaPods 是 Cocoa 项目的依赖管理器。您可以使用以下命令安装它:
$ gem install cocoapods
使用 CocoaPods 1.1.0+ 来构建 AttributedTextView 0.1.0+ 所需。
要将 AttributedTextView 集成到您的 Xcode 项目中并使用 CocoaPods,请在您的 Podfile
中指定它。
source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'
use_frameworks!
pod 'AttributedTextView', '~> 0.5.1'
然后运行以下命令:
$ pod install
Carthage
Carthage 是一款分散式依赖管理器,用于自动将框架添加到您的 Cocoa 应用中。
您可以使用 Homebrew 安装 Carthage,命令如下:
$ brew update
$ brew install carthage
要将 AttributedTextView 集成到您的 Xcode 项目中并使用 Carthage,请在您的 Cartfile
中指定它。
github "evermeer/AttributedTextView" ~> 0.5.1
Swift 包管理器
要将AttributedTextView用作Swift包管理器包,只需在Package.swift文件中添加以下内容。
import PackageDescription
let package = Package(
name: "HelloAttributedTextView",
dependencies: [
.Package(url: "https://github.com/evermeer/AttributedTextView.git", "0.5.1")
]
)
手动
如果您不想使用上述依赖项管理器中的任何一个,可以手动将AttributedTextView整合到项目中。
Git子模块
- 打开终端,
cd
到您的顶级项目目录,并运行以下命令“如果”您的项目未初始化为Git仓库
$ git init
- 通过运行以下命令将AttributedTextView作为git 子模块添加
$ git submodule add https://github.com/evermeer/AttributedTextView.git
$ git submodule update --init --recursive
- 打开新的
AttributedTextView
文件夹,并将AttributedTextView.xcodeproj
拖放到您应用Xcode项目的项目导航器中。
它应该嵌套在您的应用蓝色项目图标下面。它在所有其他Xcode组之上或之下并不重要。
- 在项目导航器中选中
AttributedTextView.xcodeproj
,并验证部署目标与您的应用程序目标匹配。 - 接下来,在项目导航器中选择您的应用程序项目(蓝色项目图标),导航到目标配置窗口,并在侧边栏的“目标”标题下选择应用程序目标。
- 在该窗口的标签栏中,打开“通用”面板。
- 在“已嵌入的二进制文件”部分下点击
+
按钮。 - 您将看到两个不同的
AttributedTextView.xcodeproj
文件夹,每个文件夹内部都有一个Products
文件夹,包含两个不同版本的AttributedTextView.framework
。
您可以选择哪一个
Products
文件夹并不重要。
-
选择
AttributedTextView.framework
。 -
这就完成了!
AttributedTextView.framework
将自动添加为目标依赖项,链接框架和嵌入框架,并在复制文件构建阶段进行链接,这正是您在模拟器和设备上构建所需的内容。
嵌入二进制文件
- 从https://github.com/evermeer/AttributedTextView/releases下载最新版本
- 接下来,在项目导航器中选择您的应用程序项目(蓝色项目图标),导航到目标配置窗口,并在侧边栏的“目标”标题下选择应用程序目标。
- 在该窗口的标签栏中,打开“通用”面板。
- 在“已嵌入的二进制文件”部分下点击
+
按钮。 - 添加下载的
AttributedTextView.framework
。 - 这就完成了!
许可
AttributedTextView遵循MIT许可证发布。详情请见LICENSE。
我的其他库
另外,请参考我的其他公开源码iOS库
- EVReflection - 基于反射(字典、CKRecord、JSON和XML)的对象映射,支持Alamofire和Moya扩展,使用RxSwift或ReactiveSwift
- EVCloudKitDao - 简捷访问Apple的CloudKit
- EVFaceTracker - 计算你的设备相对于人脸的距离和角度,以模拟3D效果
- EVURLCache - 为处理所有使用NSURLReques的Web请求而设计的NSURLCache子类
- AlamofireOauth2 - 使用Alamofire实现的OAuth2
- EVWordPressAPI - 使用AlamofireOauth2、AlomofireJsonToObjects和EVReflection(进行中)实现的WordPress(Jetpack)API
- PassportScanner - 扫描护照的MRZ代码,并提取姓、名、护照号码、国籍、出生日期、到期日期和个人编号。
- AttributedTextView - 创建支持多种链接(URL、标签、提及)的属性UITextView的最简单方法。