显示动画,隐式动画、关键帧动画

概要

一些简单的动画代理学习例子,包括显示、隐式、关键帧、关键帧路径四类动画。(感觉这个动画太复杂,学习简单的例子没继续了)

结果展示

流程概要

见代码

主要代码

//
//  ViewController.m
//  Animation
//
//  Created by arbboter on 14/12/20.
//  Copyright (c) 2014年 arbboter. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic, retain) UIImageView* head;
@property (nonatomic, retain) UIButton* implicitAnimation;
@property (nonatomic, retain) UIButton* explicitAnimation;
@property (nonatomic, retain) UIButton* keyFrameAnimation;
@property (nonatomic, retain) UIButton* resetHeatState;
@end

@implementation ViewController

- (void)resetHead
{
    [_head removeFromSuperview];
    [_head release];
    _head = nil;

    _head = [[UIImageView alloc] init];
    _head.image = [UIImage imageNamed:@"head.png"];
    _head.contentMode = UIViewContentModeScaleAspectFit;
    [self.view addSubview:_head];

    /** 设置初始值小且半透明 */
    _head.frame = CGRectMake(10, 20, _head.image.size.width, _head.image.size.height);
    _head.transform = CGAffineTransformMakeScale(0.1, 0.1);
    _head.center = CGPointMake(self.view.center.x, _head.frame.size.height/2+20);
    _head.alpha = 0.03;
}

- (void)viewDidLoad
{
    [super viewDidLoad];

    [self resetHead];

    UIButton* btn = nil;
    /** 重置按钮 */
    btn = [[UIButton alloc] initWithFrame:CGRectMake(10, self.view.frame.size.height-40, 80, 30)];
    [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [btn setTitle:@"重置动画" forState:UIControlStateNormal];
    btn.layer.borderWidth = 1;
    btn.layer.cornerRadius = 10;
    [btn addTarget:self action:@selector(onAnimate:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
    _resetHeatState = btn;

    /** 隐式动画按钮 */
    btn = [[UIButton alloc] initWithFrame:CGRectMake(_resetHeatState.frame.origin.x + _resetHeatState.frame.size.width + 10, self.view.frame.size.height-40, 80, 30)];
    [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [btn setTitle:@"隐式动画" forState:UIControlStateNormal];
    btn.layer.borderWidth = 1;
    btn.layer.cornerRadius = 10;
    [btn addTarget:self action:@selector(onAnimate:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
    _implicitAnimation = btn;

    /** 显示动画按钮 */
    btn = [[UIButton alloc] initWithFrame:CGRectMake(_implicitAnimation.frame.origin.x + _implicitAnimation.frame.size.width + 10, self.view.frame.size.height-40, 80, 30)];
    [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [btn setTitle:@"显示动画" forState:UIControlStateNormal];
    btn.layer.borderWidth = 1;
    btn.layer.cornerRadius = 10;
    [btn addTarget:self action:@selector(onAnimate:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
    _explicitAnimation = btn;

    /** 关键帧动画按钮 */
    btn = [[UIButton alloc] initWithFrame:CGRectMake(_explicitAnimation.frame.origin.x + _explicitAnimation.frame.size.width + 10, self.view.frame.size.height-40, 80, 30)];
    [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [btn setTitle:@"关键帧" forState:UIControlStateNormal];
    btn.layer.borderWidth = 1;
    btn.layer.cornerRadius = 10;
    [btn addTarget:self action:@selector(onAnimate:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
    _keyFrameAnimation = btn;
}

-(void)onAnimate:(id)sender
{
    CGPoint headCenter = _head.center;
    CGPoint viewCenter = self.view.center;
    if (sender == _implicitAnimation)
    {
        /** 隐式动画 */
        [UIView beginAnimations:nil context:NULL];
        _head.layer.affineTransform = CGAffineTransformMakeTranslation(0, viewCenter.y*3/2-headCenter.y);
        _head.layer.affineTransform = CGAffineTransformScale(_head.layer.affineTransform, 1, 1);
        _head.layer.opacity = 1;
        [UIView commitAnimations];
    }
    else if(sender == _explicitAnimation)
    {
        /** 显示动画 */

        /** 添加第一个动画【由透明渐变为清晰】 使用内置动画效果:opacity */
        CABasicAnimation *opAnim = [CABasicAnimation animationWithKeyPath:@"opacity"];
        opAnim.duration = 5.0;
        opAnim.fromValue = [NSNumber numberWithFloat:0.1];
        opAnim.toValue= [NSNumber numberWithFloat:1.0];
        //opAnim.cumulative = YES;
        opAnim.repeatCount = 1;
        [_head.layer addAnimation:opAnim forKey:@"animateOpacity"];

        /** 添加第二个动画 平移而且变大 使用内置动画效果:transform */
        CGAffineTransform t = CGAffineTransformMakeTranslation(0, viewCenter.y*3/2-headCenter.y);
        t = CGAffineTransformScale(t, 1.5, 1.5);
        CABasicAnimation *animatation = [CABasicAnimation animationWithKeyPath:@"transform"];
        animatation.duration = opAnim.duration;
        animatation.toValue= [NSValue valueWithCATransform3D:
                           CATransform3DMakeAffineTransform(t)];
        [_head.layer addAnimation:animatation forKey:@"animateTransform"];
    }
    else if(sender == _keyFrameAnimation)
    {
        /** 关键帧动画 */

        if(arc4random()%2)
        {
            CAKeyframeAnimation *opAnim = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
            opAnim.duration = 6.0;
            opAnim.values =[NSArray arrayWithObjects:
                            [NSNumber numberWithFloat:0.0],
                            [NSNumber numberWithFloat:0.1],
                            [NSNumber numberWithFloat:0.3],
                            [NSNumber numberWithFloat:1.0],
                            nil];
            opAnim.keyTimes = [ NSArray arrayWithObjects:
                               [NSNumber numberWithFloat:0.0],
                               [NSNumber numberWithFloat:0.3],
                               [NSNumber numberWithFloat:0.6],
                               [NSNumber numberWithFloat:1.0],
                               nil];

            [_head.layer addAnimation:opAnim forKey:@"keyAnimateOpacity"];

            CGAffineTransform t = CGAffineTransformMakeTranslation(0, viewCenter.y*3/2-headCenter.y);
            t = CGAffineTransformScale(t, 1.5, 1.5);
            CABasicAnimation *animatation = [CABasicAnimation animationWithKeyPath:@"transform"];
            animatation.duration = opAnim.duration;
            animatation.toValue= [NSValue valueWithCATransform3D:
                                  CATransform3DMakeAffineTransform(t)];
            [_head.layer addAnimation:animatation forKey:@"keyAnimateTransform"];

        }
        else
        {
            _head.alpha = 1.0;
            /** 关键帧之路径动画 */
            NSInteger x = self.view.frame.size.width;
            NSInteger y = self.view.frame.size.height;
            int n = 4;
            CGMutablePathRef path = CGPathCreateMutable();

            CGPathMoveToPoint(path, NULL, headCenter.x, headCenter.y);
            for (int i=0; i<n; i++)
            {
                CGPathAddLineToPoint(path, NULL, 0, arc4random()%y);
                CGPathAddLineToPoint(path, NULL, x, arc4random()%y);
            }
            CGPathCloseSubpath(path);

            CAKeyframeAnimation *animation = nil;
            animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
            [animation setDuration:n*5];
            [animation setDelegate:self];
            [animation setPath:path];
            CFRelease(path);
            path = nil;
            [[_head layer] addAnimation:animation forKey:@"position"];
        }
    }
    else if(sender == _resetHeatState)
    {
        [self resetHead];
    }
}

- (void)dealloc
{
    [_head release];
    [_implicitAnimation release];
    [_explicitAnimation release];
    [_resetHeatState release];
    [super dealloc];
}

@end

项目工程

时间: 2024-10-11 19:26:41

显示动画,隐式动画、关键帧动画的相关文章

WPF中的动画——(五)关键帧动画(转)

WPF中的动画——(五)关键帧动画 与 From/To/By 动画类似,关键帧动画以也可以以动画形式显示目标属性值. 和From/To/By 动画不同的是, From/To/By 动画只能控制在两个状态之间变化,而关键帧动画则可以在多个状态之间变化,例如,对于前面那个改变按钮宽度的例子,如果我们要实现如下效果: 在2秒时将宽度从 0变为350 在7秒时将宽度变为50 在9秒的时候将其宽度变为200 虽然我们可以用三个From/To/By 动画组合实现类似效果,但是这样一来麻烦,二来要感知动画完成

Intent 显示意图 隐式意图

//显式意图  :必须指定要激活的组件的完整包名和类名 (应用程序之间耦合在一起) // 一般激活自己应用的组件的时候 采用显示意图  //隐式意图: 只需要指定要动作和数据就可以 ( 好处应用程序之间没有耦合) //激活别人写的应用  隐式意图, 不需要关心对方的包名和类名    public void enter(View view){  String name = et_name.getText().toString().trim();  if(TextUtils.isEmpty(name

【黑马Android】(07)多线程下载的原理/开源项目xutils/显示意图/隐式意图/人品计算器/开启activity获取返回值

多线程下载的原理 司马光砸缸,多开几个小水管,抢救小朋友. import java.io.BufferedReader; import java.io.File; import java.io.FileInputStream; import java.io.InputStream; import java.io.InputStreamReader; import java.io.RandomAccessFile; import java.net.HttpURLConnection; import

IOS动画隐式,显式,翻页

//  ViewController.m //  IOS动画0817 // //  Created by 张艳锋 on 15/8/17. //  Copyright (c) 2015年 张艳锋. All rights reserved. // #import "ViewController.h" @interface ViewController () @property (weak, nonatomic) IBOutlet UIImageView *imageview; - (IBA

WPF中的动画——(五)关键帧动画

与 From/To/By 动画类似,关键帧动画以也可以以动画形式显示目标属性值. 和From/To/By 动画不同的是, From/To/By 动画只能控制在两个状态之间变化,而关键帧动画则可以在多个状态之间变化,例如,对于前面那个改变按钮宽度的例子,如果我们要实现如下效果: 在2秒时将宽度从 0变为350 在7秒时将宽度变为50 在9秒的时候将其宽度变为200 虽然我们可以用三个From/To/By 动画组合实现类似效果,但是这样一来麻烦,二来要感知动画完成事件,不方便在XAML中使用.此时我

iOS block-base 动画简单用法+关键帧动画设置线性变化速度的问题

本文转载至 http://www.tuicool.com/articles/aANBF3m 时间 2014-12-07 20:13:37  segmentfault-博客原文  http://segmentfault.com/blog/alan/1190000002411296 iOS的各种动画相漂亮,相信这是吸引很多人买iPhone的原因之一.不仅如此,这还是吸引我做iOS开发的一大原因,因为在iOS上给界面实现一些像样的动画实在是太轻松了! 这里就介绍一下iOS的block-based an

IOS动画(3)关键帧动画

关键帧动画中的时间系统,模型树和呈现树与基础动画一致,这里主要介绍关键帧动画的用法 CAKeyframeAnimation - (void)viewDidLoad { [super viewDidLoad]; CALayer *layer = [CALayer layer]; layer.bounds = CGRectMake(0, 0, 120, 120); layer.position = CGPointMake(100, 300); layer.cornerRadius = 60; lay

Core Animation 动画的使用:关键帧动画、基础动画、动画组

效果如下: ViewController.h 1 #import <UIKit/UIKit.h> 2 3 @interface ViewController : UIViewController 4 @property (strong, nonatomic) IBOutlet UIImageView *imgVAnimation; 5 @property (strong, nonatomic) IBOutlet UIButton *btnAnimation1; 6 @property (str

【Selenium】显示、隐式等待

显示等待 WebDriverWait 超时抛出TimeOutException,默认500毫秒 public class WaitToReturnElement { /* * 设置超时时间为5秒,返回指定xpath的WebElement * */ public static WebElement waitForByXpath(final WebDriver driver,final String xpath) { WebDriverWait wait = new WebDriverWait(dr

Android中显示和隐式Intent的使用

显示启动activity                                                                                                                   这个很简单,下面是代码示例:为了看着方便,所以就把layout直接截图了,里面的代码只是一些简单的布局.activity_login.xml: activity_main.xml: 下面是Manifest.xml中的代码 1 <?xml vers