UIView 的 alpha,hidden,opaque 属性之间的关系影响 图层混用

简介: 前言在看性能优化文章里, 看到不少提到要把相应控件设置成不透明,特别是在滚动页面上,但是没有看到深入说明为什么要这样去做, 如果控件是透明的将会带来什么影响,还有当中涉及到的知识点都没有提出来.

前言

在看性能优化文章里, 看到不少提到要把相应控件设置成不透明,特别是在滚动页面上,但是没有看到深入说明为什么要这样去做, 如果控件是透明的将会带来什么影响,还有当中涉及到的知识点都没有提出来.

我们先来看这三个影响视图显示的属性

alpha

显示器是由一个个点的像素组成,每个像素都是由 RGBA 颜色空间来表示, alpha 即代表 A. 它是一个 CGFloat 浮点值类型, 由 0~1 范围组成, 0表示透明, 1表示不透明.

  • 当我们设置一个 View 为透明时, 其 subView 会受其影响会直接隐藏. 不管其 Alpah值为多少.
  • 当一个 View 为透明时, 其不会具有相应功能,响应链会直接将事件直接传递到其下一个视图。

hidden

其是一个 Bool 值.
当其设置成 No 时, 与 alpha 设置成 0 同理.

opaque

此属性表示不透明, 一般控件此属性默认都是 Yes, 即表示不透明. 但是 UIButton 子类默认是 No, 这个要注意.

如果我们将 View 的 opaque 属性设置成 No, 并不是使其变成透明, 不知道这里是系统对其作了一层处理还是什么原因,总之一个 View 我们将其设置成 No 之后, 其还是正常展示, 估计这个属性设置成No 之后还要看其 Alpha 值来进行渲染. 所以改变此属性并不会使其变成透明.

但是这个属性的作用是什么呢?

图层混用

看到2013 年的文章, 当两个视图相交到一起的时候, 如果将其中一个视图此属性改成 No, 也就是透明, 则会按照此公式来计算混合图层 RGBA

R = S + D * ( 1 – Sa )

通过 GPU 来计算出一个 混合后的颜色值, 然后进行展示, 假如此图层出现在滚动页面中, 则是相对影响性能的,因为屏幕一般滚动起来会涉及到 FPS, 一旦 FPS 过低,很容易就通过肉眼看到卡顿的感觉, FPS理想状态要保持在 60左右. 1S 刷频 60次。

回到图层混用, 但是现在我使用两个相交的 View 其 opaque 属性设置成 No, 显出出来的图层并没有出现图层混用的效果. 猜测系统已经对此属性进行了优化,所以此属性已经不会再造成图层混用。

  • 为什么会出现图层混用,当两个视图相交在一起时,假如上面的视图 alpha 值不为1,的情况下, 就会出现一个混合图层的颜色, 因为其透明的缘故无法完全遮挡住下面的图层, 所以 GPU 会 通过 公式去进行计算,因此有时候会相应的影响性能,
    假设其值为1的话 R = S + D * (1 - 1) 则为 R = S. 即计算会很快。 未必真正计算是通过此公式。可能会更加复杂。
    所以要尽量避免, 特别是在滚动视图。

参考

UIKit性能调优实战讲解

最后

希望此篇文章对您有所帮助,如有不对的地方,希望大家能留言指出纠正。
谢谢!!!!!
学习的路上,与君共勉!!!

本文原创作者:Jersey. 欢迎转载,请注明出处和本文链接

目录
相关文章
|
2月前
|
存储 算法 前端开发
1637. 两点之间不包含任何点的最宽垂直区域
1637. 两点之间不包含任何点的最宽垂直区域
20 0
|
5月前
layer根据内容动态改变窗口高度
layer根据内容动态改变窗口高度
|
6月前
|
数据可视化
R绘图 | 包含/比例关系环图
R绘图 | 包含/比例关系环图
52 0
|
4月前
|
小程序 前端开发
解决小程序 scroll-view 里面的image有间距、小程序里面的图片之间有空隙的问题。
解决小程序 scroll-view 里面的image有间距、小程序里面的图片之间有空隙的问题。
|
4月前
R 问题|如何合并图形并共享同一个图例?
R 问题|如何合并图形并共享同一个图例?
63 0
|
前端开发
现有一块画布上(Canvas)它有如下功能: 定义addShape(Shape s)在画布上新增并绘制出其形状; 定义removeShape(Shape s)删除画布上已存在的形状 定义clone(
现有一块画布上(Canvas)它有如下功能: 定义addShape(Shape s)在画布上新增并绘制出其形状; 定义removeShape(Shape s)删除画布上已存在的形状 定义clone(
169 0
现有一块画布上(Canvas)它有如下功能: 定义addShape(Shape s)在画布上新增并绘制出其形状; 定义removeShape(Shape s)删除画布上已存在的形状 定义clone(
|
存储 Swift
Swift - Cell自适应+代码约束(SnapKit)横竖屏支持平铺+根据URL获取图片size
Swift - Cell自适应+代码约束(SnapKit)横竖屏支持平铺+根据URL获取图片size
179 0
|
Java
剪裁NV21任意一部分的代码
剪裁NV21任意一部分的代码
95 0
关于 操作COM组件的RGB属性只能传递一个int表达COM三色属性rgb 的解决方法
关于 操作COM组件的RGB属性只能传递一个int表达COM三色属性rgb 的解决方法
关于 操作COM组件的RGB属性只能传递一个int表达COM三色属性rgb 的解决方法
SwiftUI—创建两层嵌套的滚动视图
SwiftUI—创建两层嵌套的滚动视图
436 0
SwiftUI—创建两层嵌套的滚动视图