iOS开发iOS_小蟹专题iOSer 的自我修养

iOS富文本(NSAttributedString)---尽力弄

2016-07-06  本文已影响17023人  简单也好

最近浮躁,毛线都没写,不断有人关注点赞我,必须总结点干货了。

项目上要加载html格式的文本,学习一下富文本相关内容。

1.加载HTML标签文本

因为解析的数据里面有html标签,就使用下面的代码把字符串转换成data,初始化时再用HTML类型,转换为富文本。

 NSMutableAttributedString * attrStr = [[NSMutableAttributedString alloc] initWithData:[str dataUsingEncoding:NSUnicodeStringEncoding] options:@{ NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType } documentAttributes:nil error:nil];

参数options里面的字典有三对key value

文档类型NSDocumentTypeDocumentAttribute
 NSPlainTextDocumentType  // 普通文本
 NSRTFTextDocumentType   //  富文本
 NSRTFDTextDocumentType   // 带附件的富文本
 NSHTMLTextDocumentType  // 这个可以加载HTML格式的文本
编码格式NSCharacterEncodingDocumentAttribute
 [NSNumber numberWithInt:NSUTF8StringEncoding]; // 不再一一列举
默认NSDefaultAttributesDocumentAttribute

这个不知道对应的value是什么

2.富文本总结

这是富文本的所有属性
属性Name 干啥的 类型
NSFontAttributeName 字号 UIFont 默认12
NSParagraphStyleAttributeName 段落样式 NSParagraphStyle
NSForegroundColorAttributeName 前景色 UIColor
NSBackgroundColorAttributeName 背景色 UIColor
NSObliquenessAttributeName 字体倾斜 NSNumber
NSExpansionAttributeName 字体加粗 NSNumber 比例 0就是不变 1增加一倍
NSKernAttributeName 字间距 CGFloat
NSUnderlineStyleAttributeName 下划线 1或0
NSUnderlineColorAttributeName 下划线颜色 UIColor
NSStrikethroughStyleAttributeName 删除线 1或0
NSStrikethroughColorAttributeName 删除线颜色 UIColor
NSStrokeColorAttributeName same as ForegroundColor UIColor
NSStrokeWidthAttributeName 字体描边 CGFloat
NSLigatureAttributeName 连笔字 没看出效果 1或0
NSShadowAttributeName 阴影 NSShawdow
NSTextEffectAttributeName 设置文本特殊效果,目前只有图版印刷效果可用 NSString
NSAttachmentAttributeName 设置文本附件,常用插入图片 NSTextAttachment
NSLinkAttributeName 链接 NSURL (preferred) or NSString
NSBaselineOffsetAttributeName 基准线偏移 NSNumber
NSWritingDirectionAttributeName 文字方向 分别代表不同的文字出现方向等等,我想你一定用不到它 - - @[@(1),@(2)]
NSVerticalGlyphFormAttributeName 水平或者竖直文本 在iOS没卵用,不支持竖版 1竖直 0水平

解释一下其中的三个类型

段落样式

段落样式主要改行距、段距、首行缩进、最大最小行高、多倍行距等十几个属性,把这些总结了你就比我更全..


    NSMutableParagraphStyle *muParagraph = [[NSMutableParagraphStyle alloc]init];
    muParagraph.lineSpacing = 10; // 行距
    muParagraph.paragraphSpacing = 20; // 段距
    muParagraph.firstLineHeadIndent = 30; // 首行缩进
阴影

就三属性,不用解释了

    NSShadow *shadow = [[NSShadow alloc]init];
    shadow.shadowOffset = CGSizeMake(2, 2);
    shadow.shadowColor = [UIColor orangeColor];
    shadow.shadowBlurRadius = 1;

附件

这个我的也没显示出来,想钻研的看这里http://www.jianshu.com/p/5babe8b7983e

    NSTextAttachment *attachment=[[NSTextAttachment alloc] initWithData:nil ofType:nil];
    UIImage *img=[UIImage imageNamed:@"test.png"];
    attachment.image=img;
    attachment.bounds=CGRectMake(0, 0, 20, 20);
下面是我的富文本代码,可以copy过去直接试

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor grayColor];
    [self.view addSubview:self.attTV];
  
    //NSFontAttributeName   字号 UIFont 默认12
    //NSParagraphStyleAttributeName    段落样式  NSParagraphStyle
    //NSForegroundColorAttributeName    前景色   UIColor
    //NSBackgroundColorAttributeName    背景色   UIColor
    //NSObliquenessAttributeName        字体倾斜     NSNumber
    //NSExpansionAttributeName          字体加粗     NSNumber  比例 0就是不变 1增加一倍
    //NSKernAttributeName               字间距   CGFloat
    //NSUnderlineStyleAttributeName     下划线     1或0
    //NSUnderlineColorAttributeName     下划线颜色
    //NSStrikethroughStyleAttributeName 删除线   1或0
    //NSStrikethroughColorAttributeName 某种颜色
    //NSStrokeColorAttributeName        same as ForegroundColor
    //NSStrokeWidthAttributeName        CGFloat
    //NSLigatureAttributeName           连笔字  1或0  没看出效果
    //NSShadowAttributeName             阴影    NSShawdow
    //NSTextEffectAttributeName          设置文本特殊效果,取值为 NSString 对象,目前只有图版印刷效果可用:
    //NSAttachmentAttributeName         NSTextAttachment  设置文本附件,常用插入图片
    //NSLinkAttributeName               链接  NSURL (preferred) or NSString
    //NSBaselineOffsetAttributeName     基准线偏移   NSNumber
   
    //NSWritingDirectionAttributeName   文字方向     @[@(1),@(2)]  分别代表不同的文字出现方向等等,我想你一定用不到它 - -
    //NSVerticalGlyphFormAttributeName  水平或者竖直文本  1竖直 0水平 在iOS没卵用,不支持竖版
    
    NSParagraphStyle *paragraph = [[NSParagraphStyle alloc]init];
    NSMutableParagraphStyle *muParagraph = [[NSMutableParagraphStyle alloc]init];
    muParagraph.lineSpacing = 10; // 行距
    muParagraph.paragraphSpacing = 20; // 段距
    muParagraph.firstLineHeadIndent = 30; // 首行缩进
    
    
    NSMutableAttributedString * attrStr = [[NSMutableAttributedString alloc] initWithData:[@"asdasdflhjlfsaiollzislooa" dataUsingEncoding:NSUnicodeStringEncoding] options:@{ NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType } documentAttributes:nil error:nil];
    
    
    NSRange range = NSMakeRange(0, attrStr.length);
    // 设置字体大小
    [attrStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:30] range:range];
    //字间距
    [attrStr addAttribute:NSKernAttributeName value:@(2) range:range];
    // 字体倾斜
    [attrStr addAttribute:NSObliquenessAttributeName value:@(1) range:range];
    // 字体加粗
    [attrStr addAttribute:NSExpansionAttributeName value:@(0.5) range:range];
    // 下划线
    [attrStr addAttribute:NSUnderlineStyleAttributeName value:@(1) range:range];
    [attrStr addAttribute:NSUnderlineColorAttributeName value:[UIColor blueColor] range:range];
    // 删除线
    [attrStr addAttribute:NSStrikethroughStyleAttributeName value:@(1) range:range];
    [attrStr addAttribute:NSStrikethroughColorAttributeName value:[UIColor greenColor] range:range];

    // 连体字
    [attrStr addAttribute:NSLigatureAttributeName value:@(1) range:range];
    
    
    // 设置颜色
    [attrStr addAttribute:NSForegroundColorAttributeName value:[UIColor colorWithRed:0.942 green:0.611 blue:0.771 alpha:1.000] range:range];
    // 背景色
    [attrStr addAttribute:NSBackgroundColorAttributeName value:[UIColor colorWithRed:0.475 green:0.482 blue:0.942 alpha:1.000] range:range];
    
    // stroke
    [attrStr addAttribute:NSStrokeColorAttributeName value:[UIColor blueColor] range:range];
    [attrStr addAttribute:NSStrokeWidthAttributeName value:@(2) range:range];
    
    // 设置段落样式
    [attrStr addAttribute:NSParagraphStyleAttributeName value:muParagraph range:range];
    
    // 文本方向
    [attrStr addAttribute:NSVerticalGlyphFormAttributeName value:@(1) range:range];
    [attrStr addAttribute:NSWritingDirectionAttributeName value:@[@(2),@(3)] range:range];
    
    
    // 阴影
    NSShadow *shadow = [[NSShadow alloc]init];
    shadow.shadowOffset = CGSizeMake(2, 2);
    shadow.shadowColor = [UIColor orangeColor];
    shadow.shadowBlurRadius = 1;
    [attrStr addAttribute:NSShadowAttributeName value:shadow range:range];
    
    // 链接
    [attrStr addAttribute:NSLinkAttributeName value:[NSURL URLWithString:@"http://www.jianshu.com/p/8f49c9c99b21"] range:range];
    
    // 文字中加图片
    NSTextAttachment *attachment=[[NSTextAttachment alloc] initWithData:nil ofType:nil];
    
    UIImage *img=[UIImage imageNamed:@"test.png"];
    attachment.image=img;
    attachment.bounds=CGRectMake(0, 0, 20, 20);
    [attrStr addAttribute:NSAttachmentAttributeName value:attachment range:range];
    
    // 基准线偏移
    [attrStr addAttribute:NSBaselineOffsetAttributeName value:@(50) range:range];
    
    self.attTV.attributedText = attrStr;
}

我的效果图很磕馋

3DE57450-A7BE-41AC-9684-FC230539DED7.png

3.TextView行距字间距的问题

同时遇到一个需求,TextView输入的内容的行距字间距进行调整,这样输入一大段字会清楚一点。
网上的方法是在- (void)textViewDidChange:(UITextView *)textView代理方法中根据text生成对应格式的attributedText

- (void)textViewDidChange:(UITextView *)textView{
    NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
    
    paragraphStyle.lineSpacing = 16;// 字体的行间距
    
    NSDictionary *attributes = @{
                                 
                                 NSFontAttributeName:[UIFont systemFontOfSize:17],
                                 
                                 NSParagraphStyleAttributeName:paragraphStyle,
                                 
                                 NSKernAttributeName : @(1.4f)
                                 };
    
    textView.attributedText = [[NSAttributedString alloc] initWithString:textView.text attributes:attributes];
}

但是中文输入法的时候就会懵逼,会同时打出英文

最后没办法,改成可视化的textView,调整行距的属性,字间距就没办法了,谁有好办法可以教教我


结束... 看在苦劳点个赞😢

上一篇下一篇

猜你喜欢

热点阅读