天天看点

iOS-NSAttributedString属性关键字

1.获取系统字体

var dataArray:[String] = UIFont.familyNames()

中文字体没效果

iOS-NSAttributedString属性关键字

fontName.jpg

2.关键字

NSAttributedString中的关键字:

key value 说明
NSFontAttributeName UIFont 字体名称,大小
NSParagraphStyleAttributeName NSParagraphStyle 段落样式
NSForegroundColorAttributeName UIColor 前景色
NSBackgroundColorAttributeName UIColor 背景色
NSLigatureAttributeName NSNumber(integer) 连体
NSKernAttributeName NSNumber(float) 字符间距
NSStrikethroughStyleAttributeName NSNumber(integer) 删除线
NSStrikethroughColorAttributeName UIColor 删除线颜色
NSUnderlineStyleAttributeName NSNumber(integer) 下划线
NSStrokeColorAttributeName UIColor 描边颜色
NSStrokeWidthAttributeName NSNumber(float) 描边宽度
NSShadowAttributeName NSShadow 阴影
NSTextEffectAttributeName NSString 特殊效果
NSAttachmentAttributeName NSTextAttachment 用于图文混排
NSLinkAttributeName NSURL 链接
NSBaselineOffsetAttributeName NSNumber(float) 上下偏移
NSObliquenessAttributeName NSNumber(float) 倾斜
NSExpansionAttributeName NSNumber(float) 拉伸
NSWritingDirectionAttributeName NSArray of NSNumbers 顺序
NSVerticalGlyphFormAttributeName NSNumber 排版

3.例子

UILabel,UITextField,UITextView

attributedText

属性,这里使用

UITextView

来举例

当UITextView添加到UINavigationView时, UITextView顶部会有一段64px偏移,继承于UIScrollView是控件都有这个偏移,需要设置:

或者在storyboard中,去掉属性勾选

iOS-NSAttributedString属性关键字

font18.png

@IBOutlet weak var fontTextView: UITextView!
           

1.字体名称大小,前景,背景

NSFontAttributeName
NSForegroundColorAttributeName
NSBackgroundColorAttributeName
           
let originString = "NSAttributedString 文本属性关键字"
let font = UIFont(name: "Marker Felt", size: )!
let attr = [NSFontAttributeName:font, NSForegroundColorAttributeName:UIColor.redColor(), NSBackgroundColorAttributeName:UIColor.yellowColor()]
let attrString = NSAttributedString(string: originString, attributes: attr)
           
iOS-NSAttributedString属性关键字

font01.png

2.字符间距

NSKernAttributeName
           
let originString = "NSAttributedString 文本属性关键"
let attr = [NSKernAttributeName:]
let attrString = NSAttributedString(string: originString, attributes: attire)
           
iOS-NSAttributedString属性关键字

font02.png

3.删除线,下划线

删除线

NSStrikethroughStyleAttributeName
NSStrikethroughColorAttributeName
           
let originString = "NSAttributedString 文本属性关键字"
let attr = [NSStrikethroughStyleAttributeName:, NSStrikethroughColorAttributeName:UIColor.purpleColor()]
let attrString = NSAttributedString(string: originString, attributes: attr)
           

NSStrikethroughStyleAttributeName的value:

1~7单线,依次加粗

9~15:双线,依次加粗

iOS-NSAttributedString属性关键字

font03.png

iOS-NSAttributedString属性关键字

font04.png

iOS-NSAttributedString属性关键字

font05.png 下划线

NSUnderlineStyleAttributeName
NSUnderlineColorAttributeName
           

1~7单线,依次加粗

9~15:双线,依次加粗

let originString = "NSAttributedString 文本属性关键字"
let attr = [NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor()]
let attrString = NSAttributedString(string: originString, attributes: attr)
           
iOS-NSAttributedString属性关键字

font06.png

4.阴影

NSShadowAttributeName
           
let originString = "NSAttributedString 文本属性关键字"
let shadow = NSShadow()
shadow.shadowColor = UIColor.purpleColor()
shadow.shadowOffset = CGSizeMake(, )
shadow.shadowBlurRadius = 
let attr = [NSShadowAttributeName:shadow, NSFontAttributeName: UIFont.systemFontOfSize()]
let attrString = NSAttributedString(string: originString, attributes: attr)
fontTextView.attributedText = attrString;
           
iOS-NSAttributedString属性关键字

font07.png

5.链接

NSLinkAttributeName
           
var originString = "www.google.cn"
let attr = [NSLinkAttributeName: NSURL(string: "http://www.google.cn", NSFontAttributeName: UIFont.systemFontOfSize()]
let attrString = NSAttributedString(string: originString, attributes: attr)
fontTextView.attributedText = attrString;
           
iOS-NSAttributedString属性关键字

font09.png

此时链接还不可以点击,在Storyboard中设置fontTextView属性:

iOS-NSAttributedString属性关键字

font08.png

6.上下偏移

NSBaselineOffsetAttributeName
           
let originString = "String文本  "
let attrString = NSMutableAttributedString()
let attr01 = [NSBaselineOffsetAttributeName:, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.redColor()]
let attrString01 = NSAttributedString(string: originString, attributes: attr01)
let attr02 = [NSBaselineOffsetAttributeName:, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.yellowColor()]
let attrString02 = NSAttributedString(string: originString, attributes: attr02)
let attr03 = [NSBaselineOffsetAttributeName:-, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.greenColor()]
let attrString03 = NSAttributedString(string: originString, attributes: attr03)
attrString.appendAttributedString(attrString01)
attrString.appendAttributedString(attrString02)
attrString.appendAttributedString(attrString03)
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font10.png

7.倾斜

NSObliquenessAttributeName
           

正值右倾,负值左倾

let originString = "String文本  "
let attrString = NSMutableAttributedString()
let attr01 = [NSObliquenessAttributeName:-, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.redColor()]
let attrString01 = NSAttributedString(string: originString, attributes: attr01)
let attr02 = [NSObliquenessAttributeName:, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.yellowColor()]
let attrString02 = NSAttributedString(string: originString, attributes: attr02)
let attr03 = [NSObliquenessAttributeName:, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.greenColor()]
let attrString03 = NSAttributedString(string: originString, attributes: attr03)
attrString.appendAttributedString(attrString01)
attrString.appendAttributedString(attrString02)
attrString.appendAttributedString(attrString03)
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font11.png

8.拉伸

NSExpansionAttributeName
           
let originString = "String文本  "
let attrString = NSMutableAttributedString()
let attr01 = [NSExpansionAttributeName:-, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.redColor()]
let attrString01 = NSAttributedString(string: originString, attributes: attr01)
let attr02 = [NSExpansionAttributeName:, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.yellowColor()]
let attrString02 = NSAttributedString(string: originString, attributes: attr02)
let attr03 = [NSExpansionAttributeName:, NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.greenColor()]
let attrString03 = NSAttributedString(string: originString, attributes: attr03)
attrString.appendAttributedString(attrString01)
attrString.appendAttributedString(attrString02)
attrString.appendAttributedString(attrString03)
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font12.png

9.顺序

NSWritingDirectionAttributeName
           

值有四种组合

let a1 = [NSWritingDirection.LeftToRight.rawValue|NSWritingDirectionFormatType.Override.rawValue]
let a2 = [NSWritingDirection.LeftToRight.rawValue|NSWritingDirectionFormatType.Embedding.rawValue]
let a3 = [NSWritingDirection.RightToLeft.rawValue|NSWritingDirectionFormatType.Override.rawValue]
let a4 = [NSWritingDirection.RightToLeft.rawValue|NSWritingDirectionFormatType.Embedding.rawValue]
           

测试后,只有

a3

将文本顺序倒序了

其他三个可能在和其他属性一起用时有效果,还没有验证.

let originString = "String文本  "
let attr = [NSWritingDirectionAttributeName:a3]
let attrString = NSAttributedString(string: originString, attributes: attr)
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font13.png

10.描边

NSStrokeColorAttributeName
NSStrokeWidthAttributeName //正值中间为镂空效果,负值中间为填充效果
           
let originString = "String文本\n"
let attrString = NSMutableAttributedString()
let attr01 = [NSStrokeWidthAttributeName:-, NSStrokeColorAttributeName:UIColor.purpleColor(), NSUnderlineColorAttributeName:UIColor.yellowColor(),NSFontAttributeName:UIFont.systemFontOfSize(), NSForegroundColorAttributeName:UIColor.greenColor(),NSBackgroundColorAttributeName:UIColor.yellowColor()]
let attrString01 = NSAttributedString(string: originString, attributes: attr01)
let attr02 = [NSStrokeWidthAttributeName:, NSStrokeColorAttributeName:UIColor.purpleColor(), NSUnderlineColorAttributeName:UIColor.yellowColor(),NSFontAttributeName:UIFont.systemFontOfSize(),NSForegroundColorAttributeName:UIColor.greenColor()]
let attrString02 = NSAttributedString(string: originString, attributes: attr02)
let attr03 = [NSStrokeWidthAttributeName:, NSStrokeColorAttributeName:UIColor.purpleColor(), NSUnderlineColorAttributeName:UIColor.greenColor(),NSFontAttributeName:UIFont.systemFontOfSize(),NSForegroundColorAttributeName:UIColor.greenColor(), NSBackgroundColorAttributeName:UIColor.yellowColor()]
let attrString03 = NSAttributedString(string: originString, attributes: attr03)
attrString.appendAttributedString(attrString01)
attrString.appendAttributedString(attrString02)
attrString.appendAttributedString(attrString03)
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font14.png

11.图文混排

方法一:

let originString01 = "String"
let originString02 = "文本"
let attrString = NSMutableAttributedString()
let attrString01 = NSAttributedString(string: originString01, attributes: [NSFontAttributeName:UIFont.systemFontOfSize()])
let attachment = NSTextAttachment()
attachment.image = UIImage(named: "123.jpg")
attachment.bounds = CGRectMake(, , , )
let attrString02 = NSAttributedString(attachment: attachment)
let attrString03 = NSAttributedString(string: originString02, attributes: [NSFontAttributeName:UIFont.systemFontOfSize()])
attrString.appendAttributedString(attrString01)
attrString.appendAttributedString(attrString02)
attrString.appendAttributedString(attrString03)
fontTextView.attributedText = attrString
           

方法二

let originString = "String文本"
let attrString = NSMutableAttributedString(string: originString)
let attachment = NSTextAttachment()
attachment.image = UIImage(named: "123.jpg")
attachment.bounds = CGRectMake(, , , )
attrString.addAttributes([NSFontAttributeName:UIFont.systemFontOfSize()], range: NSMakeRange(, originString.characters.count))
let pic = NSAttributedString(attachment: attachment)
attrString.insertAttributedString(pic, atIndex: )
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font15.png

12.连体

NSLigatureAttributeName
           

不是所有字符之间都有连体效果,少数几种字体有.

如 Heiti SC 的 fl 和fi之间

0无连体效果,1连体效果

let originString = "fl  fi\n"
let attrString = NSMutableAttributedString()
let font = UIFont(name: "Heiti SC", size: )!
let attrStr01 = NSAttributedString(string: originString, attributes: [NSLigatureAttributeName:, NSFontAttributeName:font])
let attrStr02 = NSAttributedString(string: originString, attributes: [NSLigatureAttributeName:, NSFontAttributeName:font])
attrString.appendAttributedString(attrStr01)
attrString.appendAttributedString(attrStr02)
fontTextView.attributedText = attrString
           
iOS-NSAttributedString属性关键字

font16.png

13.特效

NSTextEffectAttributeName
           
let originString = "String文本\n"
let attrString = NSMutableAttributedString()
let font = UIFont.systemFontOfSize()
let attrStr01 = NSAttributedString(string: originString, attributes: [ NSFontAttributeName:font])
let attrStr02 = NSAttributedString(string: originString, attributes: [NSTextEffectAttributeName:NSTextEffectLetterpressStyle, NSFontAttributeName:font])
attrString.appendAttributedString(attrStr01)
attrString.appendAttributedString(attrStr02)
fontTextView.attributedText = attrString
           

下面的是添加了特效的,对比起来还是有点区别

iOS-NSAttributedString属性关键字

font17.png

14.段落

可以类比word中的段落属性来理解

以下例子中,文字加颜色和下划线是为了更好的表示文字边界

1.行间距,首行缩进

lineSpacing //行间距
firstLineHeadIndent //首行缩进
           
let path = NSBundle.mainBundle().pathForResource("hupan", ofType: "txt")!
let originString = try? NSString(contentsOfFile: path, encoding: NSUTF8StringEncoding) as String
let paragraphStyle01 = NSMutableParagraphStyle()
paragraphStyle01.lineSpacing = -
paragraphStyle01.firstLineHeadIndent =  //默认0
let attr01 = [NSParagraphStyleAttributeName:paragraphStyle01, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString01 = NSAttributedString(string: originString!, attributes: attr01)
fontTextView01.attributedText = attrString01;
//++++++++++++++++++++++++++++++
let paragraphStyle02 = NSMutableParagraphStyle()
paragraphStyle02.lineSpacing = - //负值无效果
paragraphStyle02.firstLineHeadIndent = 
let attr02 = [NSParagraphStyleAttributeName:paragraphStyle02, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString02 = NSAttributedString(string: originString!, attributes: attr02)
fontTextView02.attributedText = attrString02;
//++++++++++++++++++++++++++++++
let paragraphStyle03 = NSMutableParagraphStyle()
paragraphStyle03.lineSpacing =  //行间距
paragraphStyle03.firstLineHeadIndent = 
let attr03 = [NSParagraphStyleAttributeName:paragraphStyle03, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString03 = NSAttributedString(string: originString!, attributes: attr03)
fontTextView03.attributedText = attrString03;
           
iOS-NSAttributedString属性关键字

font19_MarkMan.png 2.除首行外缩进,文本区域宽度

headIndent//直接翻译是"文本区域边缘到段落起始位置的距离",对首行无效
tailIndent//直接翻译是"文本区域边缘到段落结束位置的距离"
           
let path = NSBundle.mainBundle().pathForResource("hupan", ofType: "txt")!
let originString = try? NSString(contentsOfFile: path, encoding: NSUTF8StringEncoding) as String
let paragraphStyle01 = NSMutableParagraphStyle()
paragraphStyle01.headIndent = //除首行缩进
paragraphStyle01.tailIndent =  //文本区域宽度
let attr01 = [NSParagraphStyleAttributeName:paragraphStyle01, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString01 = NSAttributedString(string: originString!, attributes: attr01)
fontTextView01.attributedText = attrString01;
//++++++++++++++++++++++++++++++
let paragraphStyle02 = NSMutableParagraphStyle()
paragraphStyle02.headIndent = //除首行缩进
paragraphStyle02.tailIndent = 
let attr02 = [NSParagraphStyleAttributeName:paragraphStyle02, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString02 = NSAttributedString(string: originString!, attributes: attr02)
fontTextView02.attributedText = attrString02;
//++++++++++++++++++++++++++++++
let paragraphStyle03 = NSMutableParagraphStyle()
paragraphStyle03.headIndent = //除首行缩进
paragraphStyle03.tailIndent = //默认全部宽度
let attr03 = [NSParagraphStyleAttributeName:paragraphStyle03, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString03 = NSAttributedString(string: originString!, attributes: attr03)
fontTextView03.attributedText = attrString03;
           
iOS-NSAttributedString属性关键字

font20_MarkMan.png 3.段间距

paragraphSpacing
paragraphSpacingBefore
           
let path = NSBundle.mainBundle().pathForResource("hupan", ofType: "txt")!
let originString = try? NSString(contentsOfFile: path, encoding: NSUTF8StringEncoding) as String
let paragraphStyle01 = NSMutableParagraphStyle()
paragraphStyle01.paragraphSpacing = 
paragraphStyle01.firstLineHeadIndent = 
paragraphStyle01.paragraphSpacingBefore = 
let attr01 = [NSParagraphStyleAttributeName:paragraphStyle01, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString01 = NSAttributedString(string: originString!, attributes: attr01)
fontTextView01.attributedText = attrString01;
//++++++++++++++++++++++++++++++
let paragraphStyle02 = NSMutableParagraphStyle()
paragraphStyle02.lineSpacing = 
paragraphStyle02.paragraphSpacing = -
paragraphStyle02.firstLineHeadIndent = 
paragraphStyle02.paragraphSpacingBefore = 
let attr02 = [NSParagraphStyleAttributeName:paragraphStyle02, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString02 = NSAttributedString(string: originString!, attributes: attr02)
fontTextView02.attributedText = attrString02;
//++++++++++++++++++++++++++++++
let paragraphStyle03 = NSMutableParagraphStyle()
paragraphStyle03.paragraphSpacing = 
paragraphStyle03.firstLineHeadIndent = 
paragraphStyle03.paragraphSpacingBefore = 
let attr03 = [NSParagraphStyleAttributeName:paragraphStyle03, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString03 = NSAttributedString(string: originString!, attributes: attr03)
fontTextView03.attributedText = attrString03;
           
iOS-NSAttributedString属性关键字

font21_MarkMan.png 4.排版方向

let path = NSBundle.mainBundle().pathForResource("hupan", ofType: "txt")!
let originString = try? NSString(contentsOfFile: path, encoding: NSUTF8StringEncoding) as String
let paragraphStyle01 = NSMutableParagraphStyle()
paragraphStyle01.firstLineHeadIndent = 
paragraphStyle01.baseWritingDirection = .LeftToRight
let attr01 = [NSParagraphStyleAttributeName:paragraphStyle01, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString01 = NSAttributedString(string: originString!, attributes: attr01)
fontTextView01.attributedText = attrString01;
//++++++++++++++++++++++++++++++
let paragraphStyle02 = NSMutableParagraphStyle()
paragraphStyle02.firstLineHeadIndent = 
paragraphStyle02.baseWritingDirection = .Natural
let attr02 = [NSParagraphStyleAttributeName:paragraphStyle02, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString02 = NSAttributedString(string: originString!, attributes: attr02)
fontTextView02.attributedText = attrString02;
//++++++++++++++++++++++++++++++
let paragraphStyle03 = NSMutableParagraphStyle()
paragraphStyle03.firstLineHeadIndent = 
paragraphStyle03.baseWritingDirection = .RightToLeft
let attr03 = [NSParagraphStyleAttributeName:paragraphStyle03, NSBackgroundColorAttributeName:UIColor.cyanColor(), NSUnderlineStyleAttributeName:, NSUnderlineColorAttributeName:UIColor.purpleColor(), NSFontAttributeName:UIFont.systemFontOfSize()]
let attrString03 = NSAttributedString(string: originString!, attributes: attr03)
fontTextView03.attributedText = attrString03;
           
iOS-NSAttributedString属性关键字

font22_MarkMan.png 5.对齐方式

alignment
           

对应的是以下几种

iOS-NSAttributedString属性关键字

font23.png 6.打断方式

lineBreakMode
           

与UILabel的属性类似

7.几倍行高,最大行高.最小行高

lineHeightMultiple //类比word
maximumLineHeight //最大行高.值小于默认行高,实际行高为最大行高;值大于默认行高,实际行高为默认行高
minimumLineHeight //最小行高.值大于默认行高,实际行高为最小行高;值小于默认行高,实际行高为默认行高
           

4.玩出花的富文本轮子

研究透一个肯定会提高很多

YYText:https://github.com/ibireme/YYText

TTTAttributedLabel:https://github.com/TTTAttributedLabel/TTTAttributedLabel

SlackTextViewController:https://github.com/slackhq/SlackTextViewController

JVFloatLabeledTextField:https://github.com/jverdi/JVFloatLabeledTextField

TOMSMorphingLabel:https://github.com/tomknig/TOMSMorphingLabel

ZSSRichTextEditor:https://github.com/nnhubbard/ZSSRichTextEditor

jot:https://github.com/IFTTT/jot