UI篇-CATextLayer和 富文本的交融

前言

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


初始化一个CATextLayer

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.直接上干货,多个属性可以一同使用

//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

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 来查看结果:**

设置段落格式示例

    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的区别是后一个可以自动换行,不过代价是 不设置属性,都是默认的属性有时候是无法接受的。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏xx_Cc的学习总结专栏

iOS-核心动画详解之CALayer

3076
来自专栏DannyHoo的专栏

iOS开发中让UIButton上的image进行360度旋转

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/...

1041
来自专栏DeveWork

Normalize.css ——CSS Reset的友好替代品

最近才第一次接触这个Normalize.css,之前Jeff 都是采用CSS Reset的,但如今发现现在流行这个Normalize.css 了。自己也查阅了不...

2179
来自专栏mukekeheart的iOS之旅

iOS学习——核心动画之Layer基础

CALayer我们又称它叫做层。在每个UIView内部都有一个layer这样一个属性,UIView之所以能够显示,就是因为它里面有这个layer才具有显示的...

1546
来自专栏進无尽的文章

实践-腾讯新闻图文详情实现

1102
来自专栏技术之路

Qt学习笔记 TableWidget使用说明和增删改操作的实现

看一下效果很简单的一个小功能 ? 先说分部讲一下过程 再给出详细代码  添加数据 MainWindow::MainWindow(QWidget *parent)...

2.2K8
来自专栏IMWeb前端团队

滚动,你真的懂了吗

在业务中,页面滚动的场景十分常见, 因此对于滚动的充分了解,可以让我们提高开发的效率! 滚动的几种场景 只有window窗体滚动 内滚动布局 窗体滚动+DIV内...

2437
来自专栏梧雨北辰的开发录

iOS导航栏使用总结

2922
来自专栏blackheart的专栏

1.[Andriod]之Andriod布局 VS WinPhone布局

0.写在前面的话 近来被HTML+CSS的布局折腾的死去活来,眼巴巴的看着CSS3中的flex,grid等更便捷更高效的的布局方式无法在项目中应用,心里那叫一个...

2388
来自专栏大数据钻研

20款移动开发中很有用的 jQuery 插件

在开发任何移动项目时,要尽可能保持每一种资源尺寸都尽可能的小,以给最终用户提供一个好的体验是非常重要的。在这篇文章中我们已经编制了今年新出炉的 jQuery 移...

2897

扫码关注云+社区

领取腾讯云代金券