容易忽略的那些小点总结 (六) —— CALayer相关(五)

版本记录

版本号 时间
V1.0 2018.01.22

前言

在苹果的API文档中,有很多属性和方法我们用的不是很多,所以很容易忽略和出错,下面我就用这一个专题专门说一些不常用的API接口,下面开始。感兴趣的可以参考前面几篇文章。
1. 容易忽略的那些小点总结 (一) —— UIView UIViewTintAdjustmentMode相关(一)
2. 容易忽略的那些小点总结 (二) —— CALayer相关(一)
3. 容易忽略的那些小点总结 (三) —— CALayer相关(二)
4. 容易忽略的那些小点总结 (四) —— CALayer相关(三)
5. 容易忽略的那些小点总结 (五) —— CALayer相关(四)

edgeAntialiasingMask

位掩码用于定义接收器边缘如何光栅化,还是先看一下其API文档。

/* Defines how the edges of the layer are rasterized. For each of the
 * four edges (left, right, bottom, top) if the corresponding bit is
 * set the edge will be antialiased. Typically this property is used to
 * disable antialiasing for edges that abut edges of other layers, to
 * eliminate the seams that would otherwise occur. The default value is
 * for all edges to be antialiased. */

定义图层的边缘如何被光栅化。 对于四个边(左,右,下,上)中的每一个,如果相应的
位被设置,边将被反锯齿。 通常,此属性用于禁用对邻接其他图层边缘的边缘进行抗锯齿,
以消除否则会出现的接缝。 默认值是所有的边缘都是反锯齿的。

@property CAEdgeAntialiasingMask edgeAntialiasingMask;

这个是一个枚举,我们看看都可以取哪些值。

/* Bit definitions for `edgeAntialiasingMask' property. */

typedef NS_OPTIONS (unsigned int, CAEdgeAntialiasingMask)
{
  kCALayerLeftEdge      = 1U << 0,      /* Minimum X edge. */
  kCALayerRightEdge     = 1U << 1,      /* Maximum X edge. */
  kCALayerBottomEdge    = 1U << 2,      /* Minimum Y edge. */
  kCALayerTopEdge       = 1U << 3,      /* Maximum Y edge. */
};

还可以这么理解:

  • 此属性指定图层的哪些边是反锯齿的,并且是CAEdgeAntialiasingMask中定义的常量的组合。 您可以分别为每个边(顶部,左侧,底部,右侧)启用或禁用抗锯齿功能。 默认情况下,对所有边缘启用反锯齿。

  • 通常情况下,您将使用此属性来禁用与其他图层边缘邻接的抗锯齿功能,以消除否则会出现的接缝。

  • Layer的edgeAntialiasingMask属性并不能有效抗锯齿,只需要在图片边缘加入1个像素的透明区域就可以完美实现图片抗锯齿了。


allowsEdgeAntialiasing

这是一个布尔值,指示是否允许图层执行边缘抗锯齿。在使用view的缩放的时候,layer.border.width随着view的放大,会出现锯齿化的问题,解决这个问题需要设置这个属性。self.layer.allowsEdgeAntialiasing = YES;还是先看一下API文档。

/* When true this layer is allowed to antialias its edges, as requested
 * by the value of the edgeAntialiasingMask property.
 *
 * The default value is read from the boolean UIViewEdgeAntialiasing
 * property in the main bundle's Info.plist. If no value is found in
 * the Info.plist the default value is NO. */

如果为true,则允许按照edgeAntialiasingMask属性值的要求对该图层进行抗锯齿处理。 
默认值是从主包的Info.plist中的布尔值UIViewEdgeAuthoriasing属性中读取的。 如果在
Info.plist中找不到值,则默认值为NO。

@property BOOL allowsEdgeAntialiasing;

还有几个问题:

  • 在这个属性allowsEdgeAntialiasing出现之前,是如何抗锯齿的呢,一般是添加一个像素的透明边。具体代码可以参考。
- (UIImage *)antiAlias
{
    CGFloat border = 1.0f;
    CGRect rect = CGRectMake(border, border, self.size.width-2*border, self.size.height-2*border);
    UIImage *img = nil;
     
    UIGraphicsBeginImageContext(CGSizeMake(rect.size.width,rect.size.height));
    [self drawInRect:CGRectMake(-1, -1, self.size.width, self.size.height)];
    img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
     
    UIGraphicsBeginImageContext(self.size);
    [img drawInRect:rect];
    UIImage* antiImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
     
    return antiImage;
}

具体效果如下所示

  • 下面对比一下不做任何处理、透明边处理和属性allowsEdgeAntialiasing设置三种情况下性能的差别。

上图结果表明,allowsEdgeAntialiasing的性能还是比透明边的方式要差一点。


maskedCorners

这是一个枚举值,是iOS11.0新出的属性

看一下API文档

/* Defines which of the four corners receives the masking when using
 * `cornerRadius' property. Defaults to all four corners. */

当使用cornerRadius属性时,定义四个角中的哪一个接收到遮罩。 默认为全部四个角落。

@property CACornerMask maskedCorners
  CA_AVAILABLE_STARTING (10.13, 11.0, 11.0, 4.0);

下面我们就看一下这个枚举值都可以取哪些值

/* Bit definitions for `maskedCorners' property. */

typedef NS_OPTIONS (NSUInteger, CACornerMask)
{
  kCALayerMinXMinYCorner = 1U << 0,
  kCALayerMaxXMinYCorner = 1U << 1,
  kCALayerMinXMaxYCorner = 1U << 2,
  kCALayerMaxXMaxYCorner = 1U << 3,
};

下面我们看一个例子

    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(100.0, 200.0, 200.0, 100.0)];
    view.layer.backgroundColor = [UIColor blueColor].CGColor;
    view.layer.cornerRadius = 50.0;
    view.layer.maskedCorners = kCALayerMinXMinYCorner | kCALayerMaxXMinYCorner;
    [self.view addSubview:view];

看一下效果示意图

这个还是可动画的,下面还是看代码

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(100.0, 200.0, 200.0, 100.0)];
view.layer.backgroundColor = [UIColor blueColor].CGColor;
view.layer.cornerRadius = 50.0;
view.layer.maskedCorners = kCALayerMinXMinYCorner | kCALayerMaxXMinYCorner;
[self.view addSubview:view];

[UIView animateWithDuration:7 delay:1.0 options:UIViewAnimationOptionCurveLinear animations:^{
    view.layer.cornerRadius = 0;
} completion:nil];

在iOS11.0之前圆角是不支持动画的。

参考文章

1. 图片变形的抗锯齿处理方法
2. iOS11新特性——改善view圆角

后记

本篇已结束,后面更精彩~~~

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,287评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,346评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,277评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,132评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,147评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,106评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,019评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,862评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,301评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,521评论 2 332
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,682评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,405评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,996评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,651评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,803评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,674评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,563评论 2 352

推荐阅读更多精彩内容