iOS开发UI篇—CAlayer层的属性

简介: iOS开发UI篇—CAlayer层的属性 一、position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property CGPoint position; 用来设置CALayer在父层中的位置 以父层的左上角...

iOS开发UI篇—CAlayer层的属性

一、position和anchorPoint

1.简单介绍

CALayer有2个非常重要的属性:position和anchorPoint

@property CGPoint position;

用来设置CALayer在父层中的位置

以父层的左上角为原点(0, 0)

 

@property CGPoint anchorPoint;

称为“定位点”、“锚点”

决定着CALayer身上的哪个点会在position属性所指的位置

以自己的左上角为原点(0, 0)

它的x、y取值范围都是0~1,默认值为(0.5, 0.5)

2.图示

anchorPoint

它的取值为0~1

 

红色图层的anchorPoint为(0,0)

红色图层的anchorPoint为(0.5,0.5)

红色图层的anchorPoint为(1,1)

红色图层的anchorPoint为(0.5,0)

position和anchorPoint

添加一个红色图层到绿色图层上,红色图层显示到什么位置,由position属性决定

假设红色图层的position是(100,100)

  到底把红色图层的哪个点移动到(100,100)的坐标位置,锚点。

  红色图层的锚点是(0,0)

红色图层的锚点是(0.5,0.5)

红色图层的锚点是(1,1)

红色图层的锚点是(0.5,0)

3.代码示例

(1)没有设置锚点。默认的锚点位置为(0.5,0.5)

 1 //
 2 //  YYViewController.m
 3 //  03-锚点等属性
 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     CALayer *layer=[CALayer layer];
22     //设置图层的属性
23     layer.backgroundColor=[UIColor redColor].CGColor;
24     layer.bounds=CGRectMake(0, 0, 100, 100);
25     //添加图层
26     [self.view.layer addSublayer:layer];
27     
28 }
29 
30 @end

显示效果:

         

(1)设置锚点位置为(0,0)

 1 - (void)viewDidLoad
 2 {
 3     [super viewDidLoad];
 4     //创建图层
 5     CALayer *layer=[CALayer layer];
 6     //设置图层的属性
 7     layer.backgroundColor=[UIColor redColor].CGColor;
 8     layer.bounds=CGRectMake(0, 0, 100, 100);
 9     //设置锚点为(0,0)
10     layer.anchorPoint=CGPointZero;
11     //添加图层
12     [self.view.layer addSublayer:layer];
13 }
14 @end

显示效果:

二、隐式动画

1.简单说明

每一个UIView内部都默认关联着一个CALayer,我们可用称这个Layer为Root Layer(根层)

所有的非Root Layer,也就是手动创建的CALayer对象,都存在着隐式动画

什么是隐式动画?

当对非Root Layer的部分属性进行修改时,默认会自动产生一些动画效果

而这些属性称为Animatable Properties(可动画属性)

 

列举几个常见的Animatable Properties:

bounds:用于设置CALayer的宽度和高度。修改这个属性会产生缩放动画

backgroundColor:用于设置CALayer的背景色。修改这个属性会产生背景色的渐变动画

position:用于设置CALayer的位置。修改这个属性会产生平移动画

2.代码示例

 1 //
 2 //  YYViewController.m
 3 //  04-隐式动画
 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 @property(nonatomic,strong)CALayer *layer;
13 @end
14 
15 @implementation YYViewController
16 
17 - (void)viewDidLoad
18 {
19     [super viewDidLoad];
20     //创建图层
21     CALayer *mylayer=[CALayer layer];
22     //设置图层属性
23     mylayer.backgroundColor=[UIColor brownColor].CGColor;
24     mylayer.bounds=CGRectMake(0, 0, 150, 100);
25     //显示位置
26     mylayer.position=CGPointMake(100, 100);
27     mylayer.anchorPoint=CGPointZero;
28     mylayer.cornerRadius=20;
29     //添加图层
30     [self.view.layer addSublayer:mylayer];
31     self.layer=mylayer;
32 }
33 
34 -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
35 {
36     //隐式动画
37     self.layer.bounds=CGRectMake(0, 0, 200, 60);
38     self.layer.backgroundColor=[UIColor yellowColor].CGColor;
39 }
40 @end

效果:

        

关闭隐式动画:

1     [CATransaction begin];
2     [CATransaction setDisableActions:YES];
3     //隐式动画
4     self.layer.bounds=CGRectMake(0, 0, 200, 60);
5     self.layer.backgroundColor=[UIColor yellowColor].CGColor;
6     [CATransaction commit];

3.如何查看CALayer的某个属性是否支持隐式动画?

  可以查看头文件,看有没有Animatable,如果有则表示支持。

也可以查看官方文档

文档中标明的这些属性都是支持隐式动画的

目录
相关文章
|
2月前
|
开发框架 前端开发 Android开发
安卓与iOS开发中的跨平台策略
在移动应用开发的战场上,安卓和iOS两大阵营各据一方。随着技术的演进,跨平台开发框架成为开发者的新宠,旨在实现一次编码、多平台部署的梦想。本文将探讨跨平台开发的优势与挑战,并分享实用的开发技巧,帮助开发者在安卓和iOS的世界中游刃有余。
|
2月前
|
搜索推荐 Android开发 开发者
探索安卓开发中的自定义视图:打造个性化UI组件
【10月更文挑战第39天】在安卓开发的世界中,自定义视图是实现独特界面设计的关键。本文将引导你理解自定义视图的概念、创建流程,以及如何通过它们增强应用的用户体验。我们将从基础出发,逐步深入,最终让你能够自信地设计和实现专属的UI组件。
|
17天前
|
iOS开发 开发者 MacOS
深入探索iOS开发中的SwiftUI框架
【10月更文挑战第21天】 本文将带领读者深入了解Apple最新推出的SwiftUI框架,这一革命性的用户界面构建工具为iOS开发者提供了一种声明式、高效且直观的方式来创建复杂的用户界面。通过分析SwiftUI的核心概念、主要特性以及在实际项目中的应用示例,我们将展示如何利用SwiftUI简化UI代码,提高开发效率,并保持应用程序的高性能和响应性。无论你是iOS开发的新手还是有经验的开发者,本文都将为你提供宝贵的见解和实用的指导。
108 66
|
9天前
|
移动开发 前端开发 Java
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
JavaFX是Java的下一代图形用户界面工具包。JavaFX是一组图形和媒体API,我们可以用它们来创建和部署富客户端应用程序。 JavaFX允许开发人员快速构建丰富的跨平台应用程序,允许开发人员在单个编程接口中组合图形,动画和UI控件。本文详细介绍了JavaFx的常见用法,相信读完本教程你一定有所收获!
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
|
3天前
|
存储 监控 API
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
|
27天前
|
开发框架 Android开发 iOS开发
安卓与iOS开发中的跨平台策略:一次编码,多平台部署
在移动应用开发的广阔天地中,安卓和iOS两大阵营各占一方。随着技术的发展,跨平台开发框架应运而生,它们承诺着“一次编码,到处运行”的便捷。本文将深入探讨跨平台开发的现状、挑战以及未来趋势,同时通过代码示例揭示跨平台工具的实际运用。
|
28天前
|
XML 搜索推荐 前端开发
安卓开发中的自定义视图:打造个性化UI组件
在安卓应用开发中,自定义视图是一种强大的工具,它允许开发者创造独一无二的用户界面元素,从而提升应用的外观和用户体验。本文将通过一个简单的自定义视图示例,引导你了解如何在安卓项目中实现自定义组件,并探讨其背后的技术原理。我们将从基础的View类讲起,逐步深入到绘图、事件处理以及性能优化等方面。无论你是初学者还是有经验的开发者,这篇文章都将为你提供有价值的见解和技巧。
|
1月前
|
Java 调度 Android开发
安卓与iOS开发中的线程管理差异解析
在移动应用开发的广阔天地中,安卓和iOS两大平台各自拥有独特的魅力。如同东西方文化的差异,它们在处理多线程任务时也展现出不同的哲学。本文将带你穿梭于这两个平台之间,比较它们在线程管理上的核心理念、实现方式及性能考量,助你成为跨平台的编程高手。
|
2月前
|
存储 前端开发 Swift
探索iOS开发:从新手到专家的旅程
本文将带您领略iOS开发的奇妙之旅,从基础概念的理解到高级技巧的掌握,逐步深入iOS的世界。文章不仅分享技术知识,还鼓励读者在编程之路上保持好奇心和创新精神,实现个人成长与技术突破。
|
2月前
|
安全 IDE Swift
探索iOS开发之旅:从初学者到专家
在这篇文章中,我们将一起踏上iOS开发的旅程,从基础概念的理解到深入掌握核心技术。无论你是编程新手还是希望提升技能的开发者,这里都有你需要的指南和启示。我们将通过实际案例和代码示例,展示如何构建一个功能齐全的iOS应用。准备好了吗?让我们一起开始吧!