iOS动画Animation-4-1:CALayer

首先说明:这是一系列文章,参考本专题下其他的文章有助于你对本文的理解。

一、CALayer简介

CALayer作为动画主要的依托对象,想要深入的了解动画,必须先理解CALayer。CALayer包含在QuartzCore框架中,这是一个跨平台的框架,既可以用在iOS中又可以用在Mac OS X中。在使用Core Animation开发动画的本质就是将CALayer中的内容转化为位图从而供硬件操作。

在iOS中CALayer的设计主要是了为了内容展示和动画操作,CALayer本身并不包含在UIKit中,它不能响应事件。由于CALayer在设计之初就考虑它的动画操作功能,CALayer很多属性在修改时都能形成动画效果,这种属性称为“隐式动画属性”。但是对于UIView的根图层而言属性的修改并不形成动画效果,因为很多情况下根图层更多的充当容器的做用,如果它的属性变动形成动画效果会直接影响子图层。另外,UIView的根图层创建工作完全由iOS负责完成,无法重新创建,但是可以往根图层中添加子图层或移除子图层。

二、CALayer常见属性

下面表格中是CALayer的常见的属性:

1.隐式属性动画的本质是这些属性的变动默认隐含了CABasicAnimation动画实现,详情大家可以参照Xcode帮助文档中“Animatable Properties”一节。

2.在CALayer中很少使用frame属性,因为frame本身不支持动画效果,通常使用bounds和position代替。

3.CALayer中透明度使用opacity表示而不是alpha;中心点使用position表示而不是center。

4.anchorPoint属性是图层的锚点,范围在(0~1,0~1)表示在x、y轴的比例,这个点永远可以同position(中心点)重合,当图层中心点固定后,调整anchorPoint即可达到调整图层显示位置的作用(因为它永远和position重合)

为了进一步说明anchorPoint的作用,假设有一个层大小100*100,现在中心点位置(50,50),由此可以得出frame(0,0,100,100)。上面说过anchorPoint默认为(0.5,0.5),同中心点position重合,此时使用图形描述如图1;当修改anchorPoint为(0,0),此时锚点处于图层左上角,但是中心点poition并不会改变,因此图层会向右下角移动,如图2;然后修改anchorPoint为(1,1,),position还是保持位置不变,锚点处于图层右下角,此时图层如图

我也顺手写了一个Demo来帮助大家了解一下其中一部分属性的作用。

代码

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var viewForLayer: UIView!
    var myLayer: CALayer{
        return viewForLayer.layer
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        setUpLayer()
        // Do any additional setup after loading the view, typically from a nib.
    }
    func setUpLayer(){
        myLayer.backgroundColor = UIColor.blueColor().CGColor
        myLayer.borderWidth = 100
        myLayer.borderColor = UIColor.redColor().CGColor
        myLayer.shadowRadius = 3
        myLayer.shadowOffset = CGSize(width: 0, height: 3)
        myLayer.shadowOpacity = 0.7
        myLayer.contents = UIImage(named: "star")?.CGImage
        myLayer.contentsGravity = kCAGravityCenter
        myLayer.magnificationFilter = kCAFilterTrilinear
        myLayer.geometryFlipped = false
    }

    @IBAction func tap(sender: AnyObject) {
        myLayer.shadowOpacity = myLayer.shadowOpacity == 0.7 ? 0.0 : 0.7
    }
    @IBAction func pinch(sender: UIPinchGestureRecognizer) {
        let offset: CGFloat = sender.scale < 1 ? 5.0 : -5.0
        let oldFrame = myLayer.frame
        let oldOrgin = oldFrame.origin
        let newSize = CGSize(width: oldFrame.width + (offset * -2.0), height: oldFrame.height + (offset * -2.0))
        let newOrgin = CGPoint(x: oldOrgin.x + offset, y: oldOrgin.y + offset)
        let newFrame = CGRect(origin: newOrgin, size: newSize)
        if newFrame.width >= 100.0 && newFrame.width < 300 {
            myLayer.borderWidth -= offset
            myLayer.cornerRadius += offset / 2.0
            myLayer.frame = newFrame
        }
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

}

效果图

时间: 2024-10-09 06:15:25

iOS动画Animation-4-1:CALayer的相关文章

iOS 动画Animation - 5:UIBezier

首先说明:这是一系列文章,參考本专题下其它的文章有助于你对本文的理解. 在之前的bolg中大家会发现总是会出现UIBezier,可是我也没有做过多介绍,今天就集中介绍一下UIBezier.首先.UIBezier的内容比較多,我今天介绍的也不是UIBezier的所有,可是大部分经常使用到的我都会介绍一下.至于其它的,请大家參考官方文档. 由于今天的内容比較多.也可能有些地方不是非常easy理解,我会尽量的把他介绍的看起来简单一些,方便学习. 首先上一张图,你就会看到今天要讲到的内容 这就是今天要讲

蓝懿 iOS 动画Animation

iOS Animation详解 本篇只要讲解iOS中动画的使用. Animtion主要分为两类:UIView动画和CoreAnimation动画. UIView动画有UIView属性动画,UIViewBlock动画,UIViewTransition动画. 而CoreAnimation动画主要通过CAAnimation和CALayer,常用的有CABasicAnimation,CAKeyframeAnimation,CATransition,CAAnimationGroup. UIView动画 U

[转载] iPhone/iOS Core Animation开发总结(CALayer)

目录[-] 一重要参数 二几何变形Transforming a Layers Geometry 三Layer数层结构Layer-Tree Hierarchy 四提供Layer内容Providing Layer Content 五动画 六CALayer的子类们 一.重要参数 bounds,frame,position属于基本的几何定位,相互之间数值变化会相互影响 anchorPoint:单位参数(0-1)表示,变形(transform)时候的变换源点 zPosition:相当于css中z-inde

IOS动画(1)CALayer

参考博客: http://geeklu.com/2012/09/animation-in-ios/ http://www.cnblogs.com/kenshincui/p/3972100.html#calayer CALayer是CoreAnimation部分的内容,CALayer的概念类似于photoshop中层的概念,每个UIView都有一个根CALayer,每个CALayer又可以添加子CALayer,从结构上来看CALayer是一种树形结构,UIView的绘制工作都交由CALayer完成

iOS 动画Animation - 6 - 3 实战练习之复杂动画拆装

其实我们在看到的每一个复杂的动画都是有许多简单的动画巧妙的拼装出来的,在教给大家学会拼装一个动画,其实我更愿意教会大家如何去拆解一个动画.如果看到一个动画,会去把它拆解成一个个简单的动画,那么实现这个动画就轻而易举了. 先给大家看一张效果图: 动画分析 这个动画其实在实现的时候并不困难,可能很多人怕就怕在没有思路,下面我就将这个动画拆解. 1.先出来一个圆,圆形在水平和竖直方向上被挤压,呈椭圆形状的一个过程,最后恢复成圆形 2.圆形的左下角.右下角和顶部分别按顺序凸出一小部分 3.圆和凸出部分形

简析iOS动画原理及实现——Core Animation

本文转载至 http://www.tuicool.com/articles/e2qaYjA 原文  https://tech.imdada.cn/2016/06/21/ios-core-animation/ 主题 Core Animation 背景 随着达达业务的扩大,越来越多的人开始使用达达客户端,参加到众包物流的行业中.达达客户端分为iOS平台和安卓平台. APP开发也从快速迭代的粗旷性开发转向高可复用,提升用户提现的精细化方向发展.iOS动画交互良好,使用广泛,良好的用户体验离不开流畅的界

iOS Core Animation Advanced Techniques(四):隐式动画和显式动画

隐式动画 按照我的意思去做,而不是我说的. -- 埃德娜,辛普森 我们在第一部分讨论了Core Animation除了动画之外可以做到的任何事情.但是动画师Core Animation库一个非常显著的特性.这一章我们来看看它是怎么做到的.具体来说,我们先来讨论框架自动完成的隐式动画(除非你明确禁用了这个功能). 事务 Core Animation基于一个假设,说屏幕上的任何东西都可以(或者可能)做动画.动画并不需要你在Core Animation中手动打开,相反需要明确地关闭,否则他会一直存在.

iOS Core Animation Advanced Techniques(六): 基于定时器的动画和性能调优

基于定时器的动画 我可以指导你,但是你必须按照我说的做. -- 骇客帝国 在第10章“缓冲”中,我们研究了CAMediaTimingFunction,它是一个通过控制动画缓冲来模拟物理效果例如加速或者减速来增强现实感的东西,那么如果想更加真实地模拟 物理交互或者实时根据用户输入修改动画改怎么办呢?在这一章中,我们将继续探索一种能够允许我们精确地控制一帧一帧展示的基于定时器的动画. 定时帧 动画看起来是用来显示一段连续的运动过程,但实际上当在固定位置上展示像素的时候并不能做到这一点.一般来说这种显

IOS动画(Core Animation)总结 (参考多方文章)

一.简介 iOS 动画主要是指Core Animation框架.官方使用文档地址为:Core Animation Guide. Core Animation是IOS和OS X平台上负责图形渲染与动画的基础框架.Core Animation可以作用与动画视图或者其他可视元素,为你完成了动画所需的大部分绘帧工作.你只需要配置少量的动画参数(如开始点的位置和结束点的位置)即可使用Core Animation的动画效果.Core Animation将大部分实际的绘图任务交给了图形硬件来处理,图形硬件会加