您的位置:首页 > 移动开发 > IOS开发

iOS使用NSMutableAttributedString 实现富文本(不同颜色字体、下划线等)

2016-01-06 18:06 686 查看
在iOS开发中,常常会有一段文字显示不同的颜色和字体,或者给某几个文字加删除线或下划线的需求。之前在网上找了一些资料,有的是重绘UILabel的textLayer,有的是用html5实现的,都比较麻烦,而且很多UILabel的属性也不起作用了,效果都不理想。后来了解到NSMuttableAttstring(带属性的字符串),上面的一些需求都可以很简便的实现。

1. 实例化方法和使用方法

实例化方法:

使用字符串初始化

- (id)initWithString:(NSString *)str;

例:

NSMutableAttributedString *AttributedStr = [[NSMutableAttributedStringalloc]initWithString:@"今天天气不错呀"];

- (id)initWithString:(NSString *)str attributes:(NSDictionary *)attrs;

字典中存放一些属性名和属性值,如:

NSDictionary *attributeDict = [NSDictionarydictionaryWithObjectsAndKeys:

[UIFontsystemFontOfSize:15.0],NSFontAttributeName,

[UIColorredColor],NSForegroundColorAttributeName,

NSUnderlineStyleAttributeName,NSUnderlineStyleSingle,nil];

NSMutableAttributedString *AttributedStr = [[NSMutableAttributedStringalloc]initWithString:@"今天天气不错呀" attributes:attributeDict];

- (id)initWithAttributedString:(NSAttributedString *)attester;

使用NSAttributedString初始化,跟NSMutableString,NSString类似

使用方法:

为某一范围内文字设置多个属性

- (void)setAttributes:(NSDictionary *)attrs range:(NSRange)range;

为某一范围内文字添加某个属性

- (void)addAttribute:(NSString *)name value:(id)value
range:(NSRange)range;

为某一范围内文字添加多个属性

- (void)addAttributes:(NSDictionary *)attrs range:(NSRange)range;

移除某范围内的某个属性

- (void)removeAttribute:(NSString *)name range:(NSRange)range;

2. 常见的属性及说明

NSFontAttributeName 字体

NSParagraphStyleAttributeName 段落格式

NSForegroundColorAttributeName 字体颜色

NSBackgroundColorAttributeName 背景颜色

NSStrikethroughStyleAttributeName删除线格式

NSUnderlineStyleAttributeName 下划线格式

NSStrokeColorAttributeName 删除线颜色

NSStrokeWidthAttributeName删除线宽度

NSShadowAttributeName 阴影

更多方法和属性说明详见苹果官方说明文档:

https://developer.apple.com/library/ios/documentation/Cocoa/Reference/Foundation/Classes/NSMutableAttributedString_Class/Reference/Reference.html#//apple_ref/doc/uid/TP40003689

3. 使用实例
<p style="line-height: normal; margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px; font-size: 14px;"><span style="font-family: 'Courier New';"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">   </span><span style="line-height: 24.5px; color: rgb(112, 61, 170);"><span class="typ" style="color: rgb(102, 0, 102);">UILabel</span></span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">*</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">testLabel </span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">=</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">[[</span><span style="line-height: 24.5px; color: rgb(112, 61, 170);"><span class="typ" style="color: rgb(102, 0, 102);">UILabel</span></span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span style="line-height: 24.5px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">alloc</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">]</span><span style="line-height: 24.5px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">initWithFrame</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:</span><span style="line-height: 24.5px; color: rgb(61, 29, 129);"><span class="typ" style="color: rgb(102, 0, 102);">CGRectMake</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">(</span><span style="line-height: 24.5px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">0</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">,</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span style="line-height: 24.5px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">100</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">,</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span style="line-height: 24.5px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">320</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">,</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span style="line-height: 24.5px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">30</span></span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">)];</span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);">   testLabel</span><span class="pun" style="color: rgb(102, 102, 0);">.</span></span><span style="line-height: normal; color: rgb(112, 61, 170); font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">backgroundColor</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">[</span></span><span style="line-height: normal; color: rgb(112, 61, 170); font-size: 14px;"><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">UIColor</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">lightGrayColor</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pun" style="color: rgb(102, 102, 0);">];</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);">   testLabel</span><span class="pun" style="color: rgb(102, 102, 0);">.</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(112, 61, 170);"><span class="pln" style="color: rgb(0, 0, 0);">textAlignment</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span></span><span style="line-height: normal; color: rgb(61, 29, 129); font-size: 14px;"><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">NSTextAlignmentCenter</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pun" style="color: rgb(102, 102, 0);">;</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);">   </span></span><span style="line-height: normal; color: rgb(112, 61, 170); font-size: 14px;"><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">NSMutableAttributedString</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">*</span><span class="typ" style="color: rgb(102, 0, 102);">AttributedStr</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">[[</span></span><span style="line-height: normal; color: rgb(112, 61, 170); font-size: 14px;"><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">NSMutableAttributedString</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">alloc</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pun" style="color: rgb(102, 102, 0);">]</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">initWithString</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pun" style="color: rgb(102, 102, 0);">:</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(209, 47, 27);"><span class="pun" style="color: rgb(102, 102, 0);">@</span><span class="str" style="color: rgb(0, 136, 0);">"</span></span><span style="line-height: normal; font-size: 14px; color: rgb(209, 47, 27);"><span class="str" style="line-height: 24.5px; color: rgb(0, 136, 0);">今天天气不错呀</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(209, 47, 27);"><span class="str" style="color: rgb(0, 136, 0);">"</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pun" style="color: rgb(102, 102, 0);">];</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">   </span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">[</span><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">AttributedStr</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">addAttribute</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(112, 61, 170);"><span class="typ" style="color: rgb(102, 0, 102);">NSFontAttributeName</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">                         </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">value</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:[</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(112, 61, 170);"><span class="typ" style="color: rgb(102, 0, 102);">UIFont</span></span><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">systemFontOfSize</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">16.0</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">]</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">                         </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">range</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="typ" style="color: rgb(102, 0, 102);">NSMakeRange</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">(</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">2</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">,</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">2</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">)];</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: 24.5px; font-size: 14px;"><span class="pln" style="color: rgb(0, 0, 0);">   </span><span class="pun" style="color: rgb(102, 102, 0);">[</span><span class="typ" style="color: rgb(102, 0, 102);">AttributedStr</span><span class="pln" style="color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">addAttribute</span></span><span style="line-height: 24.5px; font-size: 14px;"><span class="pun" style="color: rgb(102, 102, 0);">:</span></span><span style="line-height: normal; color: rgb(112, 61, 170); font-size: 14px;"><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">NSForegroundColorAttributeName</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">                         </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">value</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:[</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(112, 61, 170);"><span class="typ" style="color: rgb(102, 0, 102);">UIColor</span></span><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">redColor</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">]</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">                         </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">range</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="typ" style="color: rgb(102, 0, 102);">NSMakeRange</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">(</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">2</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">,</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(39, 42, 216);"><span class="lit" style="color: rgb(0, 102, 102);">2</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">)];</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">   testLabel</span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">.</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(112, 61, 170);"><span class="pln" style="color: rgb(0, 0, 0);">attributedText</span></span><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">=</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span><span class="typ" style="line-height: 24.5px; color: rgb(102, 0, 102);">AttributedStr</span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">;</span></span></span></p><p style="margin-top: 0px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 0px;"><span style="font-family: 'Courier New';"><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">   </span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">[</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(187, 44, 162);"><span class="kwd" style="color: rgb(0, 0, 136);">self</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">.</span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(112, 61, 170);"><span class="pln" style="color: rgb(0, 0, 0);">view</span></span><span style="line-height: normal; font-size: 14px;"><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);"> </span></span><span style="line-height: 24.5px; font-size: 14px; color: rgb(61, 29, 129);"><span class="pln" style="color: rgb(0, 0, 0);">addSubview</span></span><span style="line-height: normal; font-size: 14px;"><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">:</span><span class="pln" style="line-height: 24.5px; color: rgb(0, 0, 0);">testLabel</span><span class="pun" style="line-height: 24.5px; color: rgb(102, 102, 0);">];</span></span></span></p>


运行效果:



另外,其他可以设置text 的控件(如UIButton,UITextField)也都有该属性,该文章不够详细,只是简单介绍,其他效果的实现参考API中更多的属性及使用方法。

转载自:http://snowyshell.blog.163.com/blog/static/2209140342014475383375/
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: