离屏渲染的基础知识整理

简介

最近在看一些离屏渲染的东西,接触到一些新的名词,轻量级别的 CALayer 代替 UIView ,mask ,bitmap 整理下这部分的内容

UIView

我们先来看看 UIView 的说明

@interface UIView : UIResponder <NSCoding, UIAppearance, UIAppearanceContainer, UIDynamicItem, UITraitEnvironment, UICoordinateSpace, UIFocusItem, CALayerDelegate>

UIView 继承了UIResponder,所以 UIView 可以响应用户的一些操作。而且 UIView 遵循代理 CALayerDelegate 。和 CALayer 有了一点点的联系

layer属性

@property(nonatomic, readonly, strong) CALayer *layer;

Discussion

This property is never nil. The actual class of the object is determined by the value returned in the layerClass property. The view is the layer’s delegate.

Warning
Because the view is the layer’s delegate, never make the view the delegate of another CALayer object. Additionally, never change the delegate of this layer object.

从文档中可以看出的是,每一个 view.layer都不是 nil,而且这个 view 是 layer 的 <CALayerDelegate> delegate。而且永远不要去改变 这个 layer 的代理

CALayer

@interface CALayer : NSObject <NSSecureCoding, CAMediaTiming>

CALayer继承于 NSObject ,无法响应用户的操作。

Overview

A layer’s main job is to manage the visual content that you provide but the layer itself has visual attributes that can be set, such as a background color, border, and shadow. In addition to managing visual content, the layer also maintains information about the geometry of its content (such as its position, size, and transform) that is used to present that content onscreen.
If the layer object was created by a view, the view typically assigns itself as the layer’s delegate automatically, and you should not change that relationship.

从 Overview 中截取了一部分,layer 的首要任务就是管理你提供的那些内容,当然它本身也可以设置一些显示的属性,比如 color、border、shadow 等。当然 layer 也帮助你管理显示在屏幕的内容。像是位置、大小和一些变换的东西

layer 中一些触发离屏渲染的属性

mask

@property(strong) CALayer *mask;

The layer’s alpha channel determines how much of the layer’s content and background shows through. Fully or partially opaque pixels allow the underlying content to show through but fully transparent pixels block that content.

mask 也是一个 CALayer, mask 代表着怎么样的像素能够穿过 mask 被显示出来。你一定写过这样的代码。

 imageView.image.layer.cornerRadius = 5;
 imageView.image.layer.masksToBounds = YES;

我们来分别看看这两行代码代表什么,设置圆角,然后进行裁剪显示出来圆角

1.cornerRadius

Setting the radius to a value greater than 0.0 causes the layer to begin drawing rounded corners on its background. By default, the corner radius does not apply to the image in the layer’s contents property; it applies only to the background color and border of the layer. However, setting the masksToBounds property to YES causes the content to be clipped to the rounded corners.

划重点,在默认情况下,cornerRadius 不会对 layer 的内容是 image 生效的,但是只要你设置 masksToBounds 为 YES,那么这样就是可行的

2.masksToBounds

When the value of this property is YES, Core Animation creates an implicit clipping mask that matches the bounds of the layer and includes any corner radius effects. If a value for the mask property is also specified, the two masks are multiplied to get the final mask value.
如果设置了masksToBounds 为 YES,那么 Core Animation 就会隐式的创建一个 与 layer 的 bounds 相匹配的并且裁切过的 mask,这个 mask 就可以实现圆角的效果

shadow
1. shadowOpacity

The opacity of the layer’s shadow. Animatable.
设置 layer 的不透明度

2.shadowRadius

The blur radius (in points) used to render the layer’s shadow. Animatable.
用来进行阴影半径渲染的模糊半径

3. shadowOffset

The offset (in points) of the layer’s shadow. Animatable.
设置 layer 的阴影偏移量

edgeAntialiasing
edgeAntialiasingMask

This property specifies which edges of the layer are antialiased and is a combination of the constants defined in CAEdgeAntialiasingMask. You can enable or disable antialiasing for each edge (top, left, bottom, right) separately. By default antialiasing is enabled for all edges.
通过这个属性可以对某一个或者某几个边启用或者不启用抗锯齿,当然默认是对所有的生效

allowsEdgeAntialiasing

When the value is YES, the layer is allowed to antialias its edges, as requested by the value in the layer’s edgeAntialiasingMask property. The default value is read from the boolean UIViewEdgeAntialiasing property in the main bundle’s Info.plist file. If no value is found, the default value is NO.
开启了抗锯齿的话,就回去访问edgeAntialiasingMask,看看会有那些边开启抗锯齿

group opacity

allowsGroupOpacity
@property BOOL allowsGroupOpacity;

When the value is YES and the layer’s opacity property value is less than 1.0, the layer is allowed to composite itself as a group separate from its parent. This gives correct results when the layer contains multiple opaque components, but may reduce performance.
如果设置 allowsGroupOpacity为 YES 并且 layer 的opacity小于1,那么该layer将 被允许将其自身合并为一个组,并且是与他的parent分开的。而且需要注意的是,如果这个 layer 还包含很多的不透明的子 layer 的话,那么就会牺牲一些性能。而在 iOS 7+ ,这个属性默认为 YES 。

bitmap

layer 中有个属性 contents

Declaration

@property(strong) id contents;
Discussion

If you are using the layer to display a static image, you can set this property to the CGImageRefcontaining the image you want to display. (In macOS 10.6 and later, you can also set the property to an NSImage Assigning a value to this property causes the layer to use your image rather than create a separate backing store.

contents 可以设置一个静态的图片,传入一个CGImageRef。打开这个CGImageRef会发现这样的一段描述

CGImageRef

Structure
A bitmap image or image mask.

 typedef struct CF_BRIDGED_TYPE(id) CGImage *CGImageRef;

这是个指向 CGImage 结构体的指针

CGImage

A bitmap (or sampled) image is a rectangular array of pixels, with each pixel representing a single sample or data point in a source image.
一个 bitmap image 就是一个矩形像素阵列,每个像素表示源图像中的单个样本或数据点。

总结

最近在接触一些离屏渲染的东西,看到这些陌生的名词。先动手整理了下,方便以后查看。先写到这里,各位大佬轻拍

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