前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >UI篇-CATextLayer和 富文本的交融

UI篇-CATextLayer和 富文本的交融

作者头像
進无尽
发布2018-09-12 18:35:20
2.5K0
发布2018-09-12 18:35:20
举报
文章被收录于专栏:進无尽的文章

前言

CATextLayer适用于IOS或者MAC,比UIlablel 和 NSTextView 能做的事很多,可以这样说UIlablel是通过CATextLayer实现的,身为CALayer的三大子类之一,它的功能远比 UIlablel 强大的多的多,其最主要的特点是CATextLayer可以被NSMutableAttributedString直接附值。而NSMutableAttributedString有可以最自己内容作出颜色以及大小的调整,这样结合起来使用的话,就远比UILabel 灵活的多,效果也酷炫的多,也许CATextLayer就是为了NSMutableAttributedString而生的,(哈哈,开个玩笑)。下面就简要介绍下CATextLayer 的常规使用,不足之处,还望朋友们下面留言补充,不胜感谢。 苹果官网给出CATextLayer的API解释


初始化一个CATextLayer

代码语言:javascript
复制
CATextLayer *lary =[CATextLayer layer];   
lary.string = @"dasfasa";    
lary.bounds = CGRectMake(0, 0, 320, 20);      
lary.font = @"HiraKakuProN-W3";//字体的名字 不是 UIFont   
lary.fontSize = 12.f;//字体的大小      
lary.alignmentMode = kCAAlignmentCenter;//字体的对齐方式    
lary.position = CGPointMake(160, 410);     
lary.foregroundColor =[UIColor redColor].CGColor;//字体的颜色  
[self.view.layer addSublayer:lary];
/*
 @property CGFloat contentsScale; 使用CATextLayer设置文本,可能会产生模糊状态,因为该默认的分辨率不是retina,设置如下代码即可:
*/
  • CATextLayer与 CAGradientLayer(渐变图层)结合,[金闪闪动画字体]

字.gif

  • CATextLayer与CAShapeLayer(波浪)

波浪.gif

这里只提供思路 具体代码地址

富文本AttributedString

AttributedString可以分为NSAttributedString和NSMutableAttributedString两种。在使用中通过将AttributedString赋值给控件的 attributedText 属性来添加文字样式。有属性的控件有UILabel、UITextField和UITextView。

  • 使用方式一 初始化一个NSMutableAttributedString,然后向里面添加文字样式,将其赋给控件的 *attributedText*属性。 NSString *str = @"相看两不厌,唯有敬亭山"; //创建NSMutableAttributedString NSMutableAttributedString *attrStr = [[NSMutableAttributedString alloc]initWithString:str]; //设置字体和设置字体的范围 [attrStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:30.0f] range:NSMakeRange(0, 3)]; //添加文字颜色 [attrStr addAttribute:NSForegroundColorAttributeName value:[UIColor redColor] range:NSMakeRange(17, 7)]; UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(60, 100, 200, 0)]; label.backgroundColor = [UIColor greenColor]; //自动换行 label.numberOfLines = 0; //设置label的富文本 label.attributedText = attrStr; //label高度自适应 [label sizeToFit]; [self.view addSubview:label];
  • 使用方式二 创建属性字典,并将各种属性初始化。赋值, 并利用方法appendAttributedString: 添加入NSMutableAttributedString,将其赋给控件的attributedText属性。** //初始化NSMutableAttributedString NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc]init]; //设置字体格式和大小NSString *str0 = @"设置字体格式和大小"; NSDictionary *dictAttr0 = @{NSFontAttributeName:[UIFont systemFontOfSize:14]}; NSAttributedString *attr0 = [[NSAttributedString alloc]initWithString:str0 attributes:dictAttr0]; [attributedString appendAttributedString:attr0]; //设置字体颜色NSString *str1 = @"\n设置字体颜色\n"; NSDictionary *dictAttr1 = @{NSForegroundColorAttributeName:[UIColor purpleColor]}; NSAttributedString *attr1 = [[NSAttributedString alloc]initWithString:str1 attributes:dictAttr1]; [attributedString appendAttributedString:attr1]; UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(60, 100, 300, 0)]; label.backgroundColor = [UIColor lightGrayColor]; //自动换行 label.numberOfLines = 0; //设置label的富文本 label.attributedText = attributedString; //label高度自适应[label sizeToFit]; [self.view addSubview:label];

文本属性Attributes

1.直接上干货,多个属性可以一同使用

代码语言:javascript
复制
//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没卵用,不支持竖版

2.设置段落样式:段落样式中允许你设置文字与文字之间的行间距、字符间距、以及对齐模式,但是注意的是,在设置段落样式的时候,必须保证控件的

numberofline属性必须为0

代码语言:javascript
复制
NSMutableAttributedString* str2 = [[NSMutableAttributedString alloc]initWithString:@"这是测试段落样式的文字,这是测试段落样式的文字,这是测试段落样式的文字,这是测试段落样式的文字,这是测试段落样式的文字,这是测试段落样式的文字。"];
NSMutableParagraphStyle* paragraphStyle = [[NSMutableParagraphStyle alloc]init];
//对齐模式
//NSTextAlignmentCenter;//居中
//NSTextAlignmentLeft //左对齐
//NSTextAlignmentCenter //居中
//NSTextAlignmentRight //右对齐
//NSTextAlignmentJustified//最后一行自然对齐
//NSTextAlignmentNatural //默认对齐脚本
[paragraphStyle setAlignment:NSTextAlignmentLeft];
//换行裁剪模式
 //NSLineBreakByWordWrapping = 0,//以空格为边界,保留单词
//NSLineBreakByCharWrapping, //保留整个字符
//NSLineBreakByClipping, //简单剪裁,到边界为止
//NSLineBreakByTruncatingHead, //按照"……文字"显示
//NSLineBreakByTruncatingTail, //按照"文字……文字"显示
//NSLineBreakByTruncatingMiddle //按照"文字……"显示
[paragraphStyle setLineBreakMode:NSLineBreakByCharWrapping];
 //行间距
[paragraphStyle setLineSpacing:5.f];
 //字符间距
[paragraphStyle setParagraphSpacing:2.f];
[str2 addAttribute:NSParagraphStyleAttributeName value:paragraphStyle range:NSMakeRange(0, [str2 length])];

**最后,将上面设置**文字**样式,设置**段落**样式的两部分代码分别加入UILable  attributedText 来查看结果:**

设置段落格式示例

代码语言:javascript
复制
    NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
    paragraphStyle.lineSpacing = Scale_Y(7);// 字体的行间距
    paragraphStyle.paragraphSpacing = Scale_Y(3);
    attributes = @{
                                 NSFontAttributeName:[UIFont systemFontOfSize:SMALL_FONT],
                                 NSParagraphStyleAttributeName:paragraphStyle,
                                 NSForegroundColorAttributeName:[UIColor whiteColor]
                                 };
    _textV.attributedText = [[NSAttributedString alloc] initWithString:_textV.text attributes:attributes];
    _textV.textColor = [UIColor whiteColor];

值得注意的地方是 drawAtPoint和drawInRect的区别是后一个可以自动换行,不过代价是 不设置属性,都是默认的属性有时候是无法接受的。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2016.10.25 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
  • 富文本AttributedString
  • 文本属性Attributes
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档