博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CoreText进阶(五)- 文字排版样式和效果
阅读量:6485 次
发布时间:2019-06-23

本文共 5642 字,大约阅读时间需要 18 分钟。

hot3.png

本文的内容主要是文字的排版样式的文本的绘制效果,排版样式会涉及到内容的水平对其、行间距、段间距相关的讨论;绘制效果会涉及到文本内容的字体、颜色、阴影的相关讨论

其它文章:

效果

Demo:

以下是四张设置了不同属性的效果图

  • 第一个设置了文字颜色为红色,字体为16号
  • 第二个设置了文字颜色为灰色,字体为16号,对其为居中
  • 第三个设置了文字颜色为灰色,字体为14号,对其为居中,行间距为10
  • 第四个设置了阴影效果

效果图

实现的代码如下:

CGRect frame = CGRectMake(0, 20, self.view.bounds.size.width, 100);    YTDrawView *textDrawView = [[YTDrawView alloc] initWithFrame:frame];    textDrawView.backgroundColor = [UIColor whiteColor];    textDrawView.text = @"color:red font:16\n这是一个最好的时代,也是一个最坏的时代;这是明智的时代,这是愚昧的时代;这是信任的纪元,这是怀疑的纪元;这是光明的季节,这是黑暗的季节;这是希望的春日,这是失望的冬日;我们面前应有尽有,我们面前一无所有;我们都将直上天堂,我们都将直下地狱。";    textDrawView.textColor = [UIColor redColor];    textDrawView.font = [UIFont systemFontOfSize:16];    [self.view addSubview:textDrawView];        frame = CGRectMake(0, 140, self.view.bounds.size.width, 100);    textDrawView = [[YTDrawView alloc] initWithFrame:frame];    textDrawView.backgroundColor = [UIColor whiteColor];    textDrawView.text = @"color:gray font:16 align:center\n这是一个最好的时代,也是一个最坏的时代;这是明智的时代,这是愚昧的时代;这是信任的纪元,这是怀疑的纪元;这是光明的季节,这是黑暗的季节;这是希望的春日,这是失望的冬日;我们面前应有尽有,我们面前一无所有;我们都将直上天堂,我们都将直下地狱。";    textDrawView.textColor = [UIColor darkGrayColor];    textDrawView.font = [UIFont systemFontOfSize:16];    textDrawView.textAlignment = kCTTextAlignmentCenter;    [self.view addSubview:textDrawView];        frame = CGRectMake(0, 260, self.view.bounds.size.width, 100);    textDrawView = [[YTDrawView alloc] initWithFrame:frame];    textDrawView.backgroundColor = [UIColor whiteColor];    textDrawView.text = @"color:gray font:14 align:center lineSpacing:10\n这是一个最好的时代,也是一个最坏的时代;这是明智的时代,这是愚昧的时代;这是信任的纪元,这是怀疑的纪元;这是光明的季节,这是黑暗的季节;这是希望的春日,这是失望的冬日;我们面前应有尽有,我们面前一无所有;我们都将直上天堂,我们都将直下地狱。";    textDrawView.textColor = [UIColor darkGrayColor];    textDrawView.font = [UIFont systemFontOfSize:14];    textDrawView.textAlignment = kCTTextAlignmentCenter;    textDrawView.lineSpacing = 10;    [self.view addSubview:textDrawView];        frame = CGRectMake(0, 380, self.view.bounds.size.width, 100);    textDrawView = [[YTDrawView alloc] initWithFrame:frame];    textDrawView.backgroundColor = [UIColor whiteColor];    textDrawView.text = @"color:gray font:14 align:center lineSpacing:10\n这是一个最好的时代,也是一个最坏的时代;这是明智的时代,这是愚昧的时代;这是信任的纪元,这是怀疑的纪元;这是光明的季节,这是黑暗的季节;这是希望的春日,这是失望的冬日;我们面前应有尽有,我们面前一无所有;我们都将直上天堂,我们都将直下地狱。";    textDrawView.textColor = [UIColor cyanColor];    textDrawView.font = [UIFont systemFontOfSize:20];    textDrawView.textAlignment = kCTTextAlignmentCenter;    textDrawView.lineSpacing = 10;    textDrawView.shadowColor = [UIColor blackColor];    textDrawView.shadowOffset = CGSizeMake(2, 2);    textDrawView.shadowAlpha = 1.0;    [self.view addSubview:textDrawView];

全局排版效果

全局排版效果有以下几种

  • 字体
  • 颜色
  • 阴影
  • 行间距
  • 对其
  • 段间距

全局的排版效果是针对全部内容的进行设置的,本质上都是设置NSMutableAttributedString的属性,特别地

  • 行间距对其段间距行高是段落属性,使用kCTParagraphStyleAttributeNamekey设置对应的属性
  • 阴影使用需要使用CoreGraphics的API CGContextSetShadowWithColor 进行设置的
  • 字体使用kCTFontAttributeName进行设置;颜色使用kCTForegroundColorAttributeName进行设置

行间距、对其、段间距、行高 的设置

使用kCTParagraphStyleAttributeNamekey设置NSMutableAttributedString的属性,属性的值是一个CTParagraphStyleRef对象,使用CTParagraphStyleCreate方法创建CTParagraphStyleRef对象,第一个参数是CTParagraphStyleSetting的指针,第二个参数是设置CTParagraphStyleSetting的个数,可以设置一个或者多个的CTParagraphStyleSetting属性

/** 设置排版样式 */- (void)setStyleToAttributeString:(NSMutableAttributedString *)attributeString {    CTParagraphStyleSetting settings[] =    {        {kCTParagraphStyleSpecifierAlignment,sizeof(self.textAlignment),&_textAlignment},        {kCTParagraphStyleSpecifierMaximumLineSpacing,sizeof(self.lineSpacing),&_lineSpacing},        {kCTParagraphStyleSpecifierMinimumLineSpacing,sizeof(self.lineSpacing),&_lineSpacing},        {kCTParagraphStyleSpecifierParagraphSpacing,sizeof(self.paragraphSpacing),&_paragraphSpacing},    };    CTParagraphStyleRef paragraphStyle = CTParagraphStyleCreate(settings, sizeof(settings) / sizeof(settings[0]));    [attributeString addAttribute:(id)kCTParagraphStyleAttributeName                       value:(__bridge id)paragraphStyle                       range:NSMakeRange(0, [attributeString length])];    CFRelease(paragraphStyle);}

阴影的处理

使用CGContextSetShadowWithColor方法进行绘制阴影,参数需要传入阴影的颜色、阴影的偏移、阴影的透明度,这里有个注意点:绘制阴影的代码需要在绘制文字之前先调用,否则会没哟效果

/** 绘制阴影 */- (void)drawShadowInContext:(CGContextRef)context {    if (self.data.shadowColor == nil        || CGSizeEqualToSize(self.data.shadowOffset, CGSizeZero)) {        return;    }    CGContextSetShadowWithColor(context, self.data.shadowOffset, self.data.shadowAlpha, self.data.shadowColor.CGColor);}- (void)drawRect:(CGRect)rect {    [super drawRect:rect];    CGContextRef context = UIGraphicsGetCurrentContext();    CGContextSetTextMatrix(context, CGAffineTransformIdentity);    CGContextTranslateCTM(context, 0, self.bounds.size.height);    CGContextScaleCTM(context, 1, -1);        // 处理数据    [self.data composeDataToDrawWithBounds:self.bounds];        // 绘制阴影    [self drawShadowInContext:context];        // 绘制文字    [self drawTextInContext:context];        // 绘制图片    [self drawImagesInContext:context];}

字体和颜色的处理

字体颜色的处理其实就是设置NSAttributedString的属性,yt_setFont方法和yt_setTextColor方法是定义在分类中的两个方法,方便设置NSAttributedString的属性

- (void)setText:(NSString *)text {    _text = text;    [self.attributeString appendAttributedString:[[NSAttributedString alloc] initWithString:_text attributes:nil]];    [self.attributeString yt_setFont:_font];    [self.attributeString yt_setTextColor:_textColor];}- (void)setTextColor:(UIColor *)textColor {    _textColor = textColor;    [self.attributeString yt_setTextColor:_textColor];}- (void)setFont:(UIFont *)font {    _font = font;    [self.attributeString yt_setFont:_font];}

转载于:https://my.oschina.net/FEEDFACF/blog/1858441

你可能感兴趣的文章
ajax上传plupload的使用
查看>>
TPFanControl v0.62 + 汉化补丁
查看>>
marin 初学LINUX之路
查看>>
用shell打印下面这句话中字母数小于6的单词
查看>>
我的友情链接
查看>>
教你如何做出一份报表:流程分析之报表模板
查看>>
JVM 垃圾回收机制
查看>>
linux 网桥的管理和搭建
查看>>
基于SDN的应用定义安全方案
查看>>
ERP问题解决
查看>>
SAP CRM 使用Javascript触发SAP Server Event
查看>>
运维学习之进程的定义及其命令的使用
查看>>
数据库时间字段条件操作善用TO_DAYS函数等
查看>>
CPU 硬盘性能到底相差多少
查看>>
11.14PMP试题每日一题
查看>>
思科 IPSec ***配置2:
查看>>
转-Multicast server and client in Python
查看>>
开机故障中的MBR引导故障的排查
查看>>
迎合人工智能时代 码教授开设Python课程
查看>>
如果发现服务器负载压力大可以看以下的日志
查看>>