#CALayer 上一期中咱们简单的了解了CALayer的简单建立和简单的设置,那么今天咱们就一块儿来看看CALayer视图的一些实际性的应用吧 ##1、CALayer3D转换 ###一、3D转换的基本设置 想要实现CALayer的3D转换咱们须要先建立好CALayer视图,至于怎么建立CALayer视图在上一个篇章中咱们已经给你们详细介绍过了,这里我就再也不啰嗦。下面咱们来看看怎么实现CALayer视图的3D转换。 实现CALayer视图的3D转换有多种方法,可是其实质仍是设置好CALayer视图的transform属性和方法,下面咱们就先来看看怎么设置。 eg:
git
- (void)transform { layer.transform = CATransform3DTranslate(layer.transform, 0, 0, 100); layer.transform = CATransform3DScale(layer.transform, 1, 1, 1.5); layer.transform = CATransform3DRotate(layer.transform, M_PI_4, 0, 0, 1); }
上面就是CALayer的transform属性的三个基本设置,只须要设置好着三个属性就能够实现CALayer视图的3D转换了。github
###二、3D转换的transform方法 在上面的示例代码中咱们能够看出来CALayer视图的3D转换视图transform是一个方法,在这个方法中设置视图的属性,当咱们须要使用方法来实现3D转化时,调用不是直接在主方法viewDidLoad
中调用的,而是在一个实现CALayer视图的专属方法中调用的。 eg:
算法
//实现CALayer视图3D转换的调用方法 - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { [self transform]; }
###三、3D转换的多种方法: 上面咱们看见了3D转换的一种最简单的实现方法,那么下面咱们一块儿来看看实现3D转换的其余的方法还有那些呢! ####3.1使用KVC模式实现3D 有时候咱们在实现3D转换时会用到KVC模式来实现3D转换,使用KVC模式来实现3D转换的好处在于咱们设置的3D转换的值的范围是能够经过键值传输来更改的,这样就实现了3D转换中为所欲为的转换幅度! eg:
学习
[layer setValue:@2 forKeyPath:@"transform.scale.x"]; [layer setValue:@2 forKeyPath:@"transform.scale"]; [layer setValue:@100 forKeyPath:@"transform.translation"]; [layer setValue:@100 forKeyPath:@"transform.translation.x"]; [layer setValue:@M_PI_4 forKeyPath:@"transform.rotation"]; [layer setValue:@M_PI_4 forKeyPath:@"transform.rotation.x"];
####3.2使用组合动画来实现3D 其实咱们想要实现CALayer视图的3D还有一个更简单的方法,那就是经过组合动画来实现,可是若是须要组合动画那咱们就须要先设置一个隐式动画,使CALayer视图的属性发生变换时会默认产生动画效果。 隐式动画:
动画
// 隐式动画: 当layer的属性发生变换时会默认产生动画效果,动画时间0.25s layer.opacity = 0.2; layer.cornerRadius = 50;
当咱们设置好隐式动画以后咱们就能够来组合3D视图了, eg:
spa
// 组合 CATransform3D CATransform3D transform_01 = CATransform3DScale(layer.transform, 2, 2, 1); CATransform3D transform_02 = CATransform3DRotate(layer.transform, M_PI_4, 0, 0, 1); layer.transform = CATransform3DConcat(transform_01, transform_02);
上面使咱们设置的3D组合,可是若是咱们直接这样设置使用的话会发现一个问题,就是咱们的3D转换动画是直接启动的,在咱们启动程序时就直接启动了,没有造成一个动画效果,这时若是咱们想要改变这个状况,那就须要去设置一个延迟调用的方法了。 eg:
code
//延迟一秒调用 dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ layer.opacity = 1; layer.cornerRadius = 0; layer.transform = CATransform3DIdentity; });
#2、示例Demo 上面学习和咱们以前学习的相结合,咱们已经将CALayer视图的一些基础学完了,那咱们一块儿来作一个简单的示例Demo把。 这个Demo的内容是这样的:利用咱们全部的CALayer来实现一个3D的时钟,这个时钟的时间须要与现实时间进行同步,切秒针每秒走一下,分针每分钟走一下,时针每小时走一下。 这个Demo中有两个难点,接下来我将这两个难点分别在下面解释出来,但愿能对你们有所帮助。component
// 指定日历的算法 NSCalendarIdentifierGregorian,NSGregorianCalendar NSCalendar * calendar = [[NSCalendar alloc] initWithCalendarIdentifier:NSGregorianCalendar]; // NSDateComponent 能够得到日期的详细信息,即日期的组成 self.comps = [calendar components:NSYearCalendarUnit|NSMonthCalendarUnit|NSDayCalendarUnit|NSHourCalendarUnit|NSMinuteCalendarUnit|NSSecondCalendarUnit|NSWeekCalendarUnit|NSWeekdayCalendarUnit fromDate:[NSDate date]];
layer_1.transform = CATransform3DRotate(layer_1.transform, (M_PI/30), 0, 0, 1); layer_3.transform = CATransform3DRotate(layer_3.transform, (M_PI/360), 0, 0, 1); layer_2.transform = CATransform3DRotate(layer_2.transform, (M_PI/30), 0, 0, 1);
除去这个两个难点之外,这个Demo就没有什么别的难点了,你们均可以根据CALayer视图的两个文档本身写出来,这个是我本身写的3D时钟Demo,你们均可以点去看看,但愿能对各位有所帮助!orm