添加自定义的CALayer

2024-06-24 10:58
文章标签 自定义 calayer

本文主要是介绍添加自定义的CALayer,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

iOS开发UI篇—CAlayer(创建图层)

一、添加一个图层

添加图层的步骤:

1.创建layer
2.设置layer的属性(设置了颜色,bounds才能显示出来)
3.将layer添加到界面上(控制器view的layer上) 
复制代码
 1 //
 2 //  YYViewController.m
 3 //  01-创建一个简单的图层
 4 //
 5 //  Created by apple on 14-6-21.
 6 //  Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8 
 9 #import "YYViewController.h"
10 
11 @interface YYViewController ()
12 
13 @end
14 
15 @implementation YYViewController
16 
17 - (void)viewDidLoad
18 {
19     [super viewDidLoad];
20     
21     //1.创建一个layer
22     //    使用对象方法创建
23    //    CALayer *layer=[[CALayer alloc]init];
24     //使用类方法创建
25     CALayer *layer=[CALayer layer];
26     
27     //2.设置layer的属性(一定要设置位置,颜色属性才能显示出来)
28     layer.backgroundColor=[UIColor brownColor].CGColor;
29     layer.bounds=CGRectMake(0, 0, 200, 200);
30     layer.position=CGPointMake(100, 100);
31     
32     //3.把layer添加到界面上
33     [self.view.layer addSublayer:layer];
34 }
35 
36 @end
复制代码

  

 

二、添加一个显示图片的图层

  代码示例:

复制代码
 1 //
 2 //  YYViewController.m
 3 //  02-添加一个显示图片的图层
 4 //
 5 //  Created by apple on 14-6-21.
 6 //  Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8 
 9 #import "YYViewController.h"
10 
11 @interface YYViewController ()
12 
13 @end
14 
15 @implementation YYViewController
16 
17 - (void)viewDidLoad
18 {
19     [super viewDidLoad];
20     //创建一个layer
21     CALayer *Mylayer=[CALayer layer];
22     //设置layer的属性
23     Mylayer.bounds=CGRectMake(100, 100, 100, 100);
24     Mylayer.position=CGPointMake(100, 100);
25     
26     //设置需要显示的图片
27     Mylayer.contents=(id)[UIImage imageNamed:@"me"].CGImage;
28     //设置圆角半径为10
29     Mylayer.cornerRadius=10;
30     //如果设置了图片,那么需要设置这个属性为YES才能显示圆角效果
31     Mylayer.masksToBounds=YES;
32     //设置边框
33     Mylayer.borderWidth=3;
34     Mylayer.borderColor=[UIColor brownColor].CGColor;
35     
36     //把layer添加到界面上
37     [self.view.layer addSublayer:Mylayer];
38 }
39 @end
复制代码

执行效果:

说明:在第27行设置需要显示的图片,注意,这里用的是UIImage的CGImage属性,是一种CGImageRef类型的数据

 

三、CGColorRef和CGImageRef数据类型

1.简单说明

CALayer是定义在QuartzCore框架中的;CGImageRef、CGColorRef两种数据类型是定义在CoreGraphics框架中的;UIColor、UIImage是定义在UIKit框架中的

其次,QuartzCore框架和CoreGraphics框架是可以跨平台使用的,在iOS和Mac OS X上都能使用,但是UIKit只能在iOS中使用

因此,为了保证可移植性,QuartzCore不能使用UIImage、UIColor,只能使用CGImageRef、CGColorRef

不过很多情况下,可以通过UIKit对象的特定方法,得到CoreGraphics对象,比如UIImage的CGImage方法可以返回一个CGImageRef

2.导入QuartzCore框架

在xcode5中不再需要我们自己导入这个框架,如果是在ios6和xcode4以前,需要导入框架

(1) 点击项目名称,然后点击右边TARGETS下面的target

(2)点击Build Pases后,展开Link Binary....,添加 + 号

(3) 在搜索框中输入"Quartz",选中QuartzCore.framework,最后add添加

(4)添加完毕后,这个框架就会出现在项目文件夹中

  

最后,还需要在项目代码中导入框架的主头文件。

#import <QuartzCore/QuartzCore.h>

 

四、UIView和CALayer的选择

可以发现,前面的2个效果不仅可以通过添加层来实现,还可以通过添加UIView来实现。如显示图片的层可以用一个UIImageView来实现。 既然CALayer和UIView都能实现相同的显示效果,那究竟该选择谁好呢?

其实,对比CALayer,UIView多了一个事件处理的功能。也就是说,CALayer不能处理用户的触摸事件,而UIView可以。

所以,在选择的过程中,需要考虑到实际的情况,如果显示出来的东西需要跟用户进行交互的话,用UIView;如果不需要跟用户进行交互,用UIView或者CALayer都可以

当然,CALayer的性能会高一些,因为它少了事件处理的功能,更加轻量级 

五、补充说明

1.添加子layer

复制代码
 1 #import "YYViewController.h"
 2 
 3 @interface YYViewController ()
 4 
 5 @end
 6 
 7 @implementation YYViewController
 8 
 9 - (void)viewDidLoad
10 {
11     [super viewDidLoad];
12     
13     NSLog(@"star-%@",self.view.layer.sublayers);
14     //1.创建一个layer
15     //    使用对象方法创建
16    //    CALayer *layer=[[CALayer alloc]init];
17     //使用类方法创建
18     CALayer *layer=[CALayer layer];
19     
20     //2.设置layer的属性(一定要设置位置,颜色属性才能显示出来)
21     layer.backgroundColor=[UIColor brownColor].CGColor;
22     layer.bounds=CGRectMake(0, 0, 200, 200);
23     layer.position=CGPointMake(100, 100);
24     
25     //3.把layer添加到界面上
26     [self.view.layer addSublayer:layer];
27     
28     NSLog(@"end-%@",self.view.layer.sublayers);
29 }
复制代码

打印结果如下:

说明:在添加layer之前,控制器view上layer又两个子layer,添加之后,有三个子layer。

2.访问层

复制代码
 1 - (void)viewDidLoad
 2 {
 3     [super viewDidLoad];
 4     
 5     CALayer *layer=[CALayer layer];
 6     layer.backgroundColor=[UIColor brownColor].CGColor;
 7     layer.bounds=CGRectMake(0, 0, 200, 200);
 8     layer.position=CGPointMake(100, 100);
 9     
10     [self.view.layer addSublayer:layer];
11     //CALayer通过sublayers属性访问所有的子层
12     NSLog(@"%@",self.view.layer.sublayers[2]);
13     NSLog(@"%@",layer);
14     
15     //CALayer也可以通过superlayer属性访问父层
16     NSLog(@"%@",layer.superlayer);
17     NSLog(@"%@",self.view.layer);
18 }
复制代码

  UIView可以通过subviews属性访问所有的子视图,类似地,CALayer也可以通过sublayers属性访问所有的子层

    UIView可以通过superview属性访问父视图,类似地,CALayer也可以通过superlayer属性访问父层

3.注意

  在storyboard中,向界面上拖一个button按钮,打印查看子layer的个数。

复制代码
 1 - (void)viewDidLoad
 2 {
 3     [super viewDidLoad];
 4     
 5     CALayer *layer=[CALayer layer];
 6     layer.backgroundColor=[UIColor brownColor].CGColor;
 7     layer.bounds=CGRectMake(0, 0, 200, 200);
 8     layer.position=CGPointMake(100, 100);
 9     
10     [self.view.layer addSublayer:layer];
11     //打印所有的layer
12     NSLog(@"%@",self.view.layer.sublayers);
13 }
复制代码

打印结果如下:

特别注意:如果一个控件是另外一个控件的子控件,那么这个控件的layer也是另一个控件的子layer。

这篇关于添加自定义的CALayer的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1089955

相关文章

ROS话题通信流程自定义数据格式

ROS话题通信流程自定义数据格式 需求流程实现步骤定义msg文件编辑配置文件编译 在 ROS 通信协议中,数据载体是一个较为重要组成部分,ROS 中通过 std_msgs 封装了一些原生的数据类型,比如:String、Int32、Int64、Char、Bool、Empty… 但是,这些数据一般只包含一个 data 字段,结构的单一意味着功能上的局限性,当传输一些复杂的数据,比如:

CALayer相关的属性

iOS开发UI篇—CAlayer层的属性 一、position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property CGPoint position; 用来设置CALayer在父层中的位置 以父层的左上角为原点(0, 0)   @property CGPoint anchorPoint; 称为“定位点”、“锚点”

CALayer入门

iOS开发UI篇—CALayer简介 一、简单介绍 在iOS中,你能看得见摸得着的东西基本上都是UIView,比如一个按钮、一个文本标签、一个文本输入框、一个图标等等,这些都是UIView。 其实UIView之所以能显示在屏幕上,完全是因为它内部的一个图层,在创建UIView对象时,UIView内部会自动创建一个图层(即CALayer对象),通过UIView的layer属性可

android自定义View的和FramgentActivity的一个小坑

对于自定义View //加载样式TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.TitleBarView, defStyleAttr, 0);setTitle(typedArray.getString(R.styleable.TitleBarView_main_title));//不能写成

第三十七章 添加和使用自定义标题元素 - 自定义标头的继承

文章目录 第三十七章 添加和使用自定义标题元素 - 自定义标头的继承自定义标头的继承示例 在 `SOAPHEADERS` 参数中指定支持的标头元素自定义标头的继承 第三十七章 添加和使用自定义标题元素 - 自定义标头的继承 自定义标头的继承 如果创建此Web 服务的子类,该子类将继承不特定于方法的标头信息 — 包含在 <request> 或 <response> 元素中的标头信

自定义recyclerView实现时光轴效果

时光轴效果在很多app上都有出现,例如淘宝中快递的跟踪,本文将使用recyclerView实现时光轴效果,我们会到自定义控件,首先先看一下效果图: 接下来是步骤分析 1自定义属性 这个大家应该都了解了,根据我们之前的分析,直接在attrs.xml中进行声明 <declare-styleable name="TimeLine"><attr name="beginLine" f

Android自定义系列——9.Path详细用法

rXxx方法 rXxx方法的坐标使用的是相对位置(基于当前点的位移),而之前方法的坐标是绝对位置(基于当前坐标系的坐标)。 Path path = new Path();path.moveTo(100,100);path.lineTo(100,200);canvas.drawPath(path,mDeafultPaint); 在这个例子中,先移动点到坐标(100,100)处,之后再连接

Android自定义系列——8.Path之贝塞尔曲线

贝塞尔曲线能干什么 贝塞尔曲线作用十分广泛,简单举几个的栗子: QQ小红点拖拽效果一些炫酷的下拉刷新控件阅读软件的翻书效果一些平滑的折线图的制作很多炫酷的动画效果 理解贝塞尔曲线的原理 一阶曲线原理: 一阶曲线是没有控制点的,仅有两个数据点(A 和 B),最终动态过程如下: (本文中贝塞尔曲线相关的动态演示图片来自维基百科)。一阶曲线其实就是前面讲解过的lineTo。 二阶曲线

Android自定义系列——7.Path之基本操作

Path常用方法表 为了兼容性(偷懒) 本表格中去除了部分API21(即安卓版本5.0)以上才添加的方法。 作用相关方法备注移动起点moveTo移动下一次操作的起点位置设置终点setLastPoint重置当前path中最后一个点位置,如果在绘制之前调用,效果和moveTo相同连接直线lineTo添加上一个点到当前点之间的直线到Path闭合路径close连接第一个点连接到最后一个点,形成一个闭合

Android自定义系列——6.PorterDuffXfermode

在用Android中的Canvas进行绘图时,可以通过使用PorterDuffXfermode将所绘制的图形的像素与Canvas中对应位置的像素按照一定规则进行混合,形成新的像素值,从而更新Canvas中最终的像素颜色值,这样会创建很多有趣的效果。当使用PorterDuffXfermode时,需要将将其作为参数传给Paint.setXfermode(Xfermode xfermode)方法,这样在