码迷,mamicode.com
首页 > 其他好文 > 详细

动画的几种实现方式

时间:2015-02-18 01:00:10      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:

15.1 动画介绍

在iOS中动画实现技术主要是:Core Animation。 Core Animation负责所有的滚动、旋转、缩小和放大以及所有的iOS动画效果。其中UIKit类通常都有animated:参数部分,它可以允许是否使用动画。

Core Animation还与Quartz紧密结合在一起,每个UIView都关联到一个CALayer对象,CALayer是Core Animation中的图层。

15.2 Core Animation基础

Core Animation创建动画时候会修改CALayer属性,然后让这些属性流畅地变化。Core Animation相关知识点:

图层,图层是动画发生的地方,CALayer总是与UIView关联,通过layer属性访问。

隐式动画,这是一种最简单的动画,不用设置定时器,不用考虑线程或者重画。

显式动画,是一种使用CABasicAnimation创建的动画,通过CABasicAnimation,可以更明确地定义属性如何改变动 画。

关键帧动画,这是一种更复杂的显式动画类型,这里可以定义动画的起点和终点,还可以定义某些帧之间的动画。

15.3 隐式动画

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>

@interface ianimateViewController : UIViewController {

    IBOutlet UIImageView *plane;
}

-(IBAction)movePlane:(id)sender;

@end

//--m
-(IBAction)movePlane:(id)sender {
    
    [UIView beginAnimations:nil context:NULL];
    CGAffineTransform moveTransform = CGAffineTransformMakeTranslation(180, 200);
    plane.layer.affineTransform=moveTransform;
    plane.layer.opacity = 1;
    [UIView commitAnimations];

}

15.4 显式动画

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>

@interface eanimateViewController : UIViewController {
    IBOutlet UIImageView *plane;
}
-(IBAction)movePlane:(id)sender;
@end

//--m



-(IBAction)movePlane:(id)sender {
    
    CABasicAnimation *opAnim = [CABasicAnimation animationWithKeyPath:@"opacity"];
    opAnim.duration = 3.0;
    opAnim.fromValue = [NSNumber numberWithFloat:.25];
    opAnim.toValue= [NSNumber numberWithFloat:1.0];
    opAnim.cumulative = YES;
    opAnim.repeatCount = 2;
    [plane.layer addAnimation:opAnim forKey:@"animateOpacity"];
    
    CGAffineTransform moveTransform = CGAffineTransformMakeTranslation(180, 200);
    CABasicAnimation *moveAnim = [CABasicAnimation animationWithKeyPath:@"transform"];
    moveAnim.duration = 6.0;
    moveAnim.toValue= [NSValue valueWithCATransform3D:
        CATransform3DMakeAffineTransform(moveTransform)];
    [plane.layer addAnimation:moveAnim forKey:@"animateTransform"];

}

显式动画时候,不必定义CALayer的变化,也不必执行它们,而是通过CABasicAnimation逐个定义动画。其中每个动画都含有各自的duration、repeatCount等属性。然后,使用addAnimation:forKey:方法分别将每个动画应用到层中。

[CABasicAnimation animationWithKeyPath:@“opacity”]获得透明度动画对象,@“transform”是指定转换动画。

opAnim.cumulative 属性是指定累计

opAnim.repeatCount 重复执行次数

CATransform3DMakeAffineTransform函数是将仿射变换矩阵变成Core Animation使用的Transform3D类型的矩阵。

15.5 关键帧显式动画

eanimate_keyFrame关键代码:

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>
@interface eanimateViewController : UIViewController {
    IBOutlet UIImageView *plane;
}
-(IBAction)movePlane:(id)sender;

@end


//-m
-(IBAction)movePlane:(id)sender {
    
    CAKeyframeAnimation *opAnim = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
    opAnim.duration = 6.0;
    opAnim.values =[NSArray arrayWithObjects: 
                    [NSNumber numberWithFloat:0.25],  
                    [NSNumber numberWithFloat:0.75], 
                    [NSNumber numberWithFloat:1.0],
                    nil]; 
    opAnim.keyTimes = [NSArray arrayWithObjects:
                       [NSNumber numberWithFloat:0.0], 
                       [NSNumber numberWithFloat:0.5], 
                       [NSNumber numberWithFloat:1.0], nil];
    
    [plane.layer addAnimation:opAnim forKey:@"animateOpacity"];
    
    CGAffineTransform moveTransform = CGAffineTransformMakeTranslation(180, 200);
    CABasicAnimation *moveAnim = [CABasicAnimation animationWithKeyPath:@"transform"];
    moveAnim.duration = 6.0;
    moveAnim.toValue= [NSValue valueWithCATransform3D:
                       CATransform3DMakeAffineTransform(moveTransform)];
    [plane.layer addAnimation:moveAnim forKey:@"animateTransform"];
    
}

15.6 UIView级别动画

除了直接使用Core Animation 层实现动画,我们还有UIView直接实现隐式动画。

@interface MainViewController : UIViewController 
{
  UIImageView *animImageView;
  UIButton *button;
}

@property (assign) IBOutlet UIImageView *animImageView;
@property (assign) IBOutlet UIButton *button;

- (IBAction)action:(id)sender;

@end
//--m
#import "MainViewController.h"

@implementation MainViewController

@synthesize animImageView;
@synthesize button;

- (IBAction)action:(id)sender {
  [UIView beginAnimations:@"Hide Button" context:nil];
  [[self button] setAlpha:0.0];
  [UIView commitAnimations];
  
  [UIView beginAnimations:@"Slide Around" context:nil];
  
  [UIView setAnimationDuration:1.0];
  [UIView setAnimationDelegate:self];
  [UIView setAnimationDidStopSelector:@selector(viewAnimationDone:)];
  [UIView setAnimationRepeatCount:3];
  [UIView setAnimationRepeatAutoreverses:YES];
  
  CGPoint center = [[self animImageView] center];
  center.y += 100;
  
  [[self animImageView] setCenter:center];
  
  [UIView commitAnimations];
}

- (void)viewAnimationDone:(NSString*)name {
  [UIView beginAnimations:@"Show Button" context:nil];
  [[self button] setAlpha:1.0];
  [UIView commitAnimations];
}

@end

UIView中的动画是在动画块中定义的,动画块是UIView beginAnimations:context:开始, 在UIView commitAnimations结束。

首先开始将按钮设置透明度为0的,结果是开始动画时候隐藏了。

然后,又开始新的动画中设置委托事件:

[UIView setAnimationDelegate:self]

[UIView setAnimationDidStopSelector:@selector(viewAnimationDone:)];

当动画结束的时候调用viewAnimationDone:方法

内置UIView动画

UIView具有一个UIViewAnimationTransition属性可以设定动画,这些动画是iOS提供几个常用动画有:

UIViewAnimationTransitionNone

UIViewAnimationTransitionFlipFromLeft

UIViewAnimationTransitionFlipFromRight

UIViewAnimationTransitionCurlUp

UIViewAnimationTransitionCurlDown

实例UIViewAnimation

#import <UIKit/UIKit.h>

@interface UIViewAnimationViewController : UIViewController {

}

- (IBAction)doUIViewAnimation:(id)sender;

@end

//-m
#import "UIViewAnimationViewController.h"

@implementation UIViewAnimationViewController


- (IBAction)doUIViewAnimation:(id)sender{
    [UIView beginAnimations:@"animationID" context:nil];
    [UIView setAnimationDuration:1.5f];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationRepeatAutoreverses:NO];
    UIButton *theButton = (UIButton *)sender;
    switch (theButton.tag) {
        case 1:
            [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.view cache:YES];//oglFlip, fromLeft 
            break;
        case 2:
            [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES];//oglFlip, fromRight      
            break;
        case 3:
            [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.view cache:YES];
            break;
        case 4:
            [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.view cache:YES];
            break;
        default:
            break;
    }
    //[self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0];
    [UIView commitAnimations];
}

- (void)viewDidUnload {
    // Release any retained subviews of the main view.
    // e.g. self.myOutlet = nil;
}

- (void)dealloc {
    [super dealloc];
}

@end

[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]设置动画曲线,动画曲线指定的是动画进入和退出的方式,它也有几个常量:

UIViewAnimationCurveEaseInOut

UIViewAnimationCurveEaseIn

UIViewAnimationCurveEaseOut

UIViewAnimationCurveLinear

setAnimationTransition: forView: cache:方法第一个参数定义动画类型,第二个参数是当前视图对象,第三个参数上使用缓冲区。

   好了,今天就写到这里了,明天还是要继续的啦,时间有限不好意思了各位,说好的答案明天献上啦,晚安了各位,拜拜!

 

动画的几种实现方式

标签:

原文地址:http://www.cnblogs.com/dyx-wx/p/4295594.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!