• 使用Core Animation 完成ipad基本动画(Xcode4)2


         本章,我们将创建一个iPad程序,来演示Core Animation的用法。程序的运行结果将是一个带有颜色方块。当用户触摸屏幕的时候,这个方块将会移动到触控的位置。通过使用affine transformations,方块将旋转180度并移动到新的位置,并改变其大小。如果你没有阅读过上一篇教程,那么建议先去读完后再来看接下来的内容。

    1. Creating the Core Animation Project

      运行xcode,创建一个View-based模板的应用,改名为animate。

    2. Implementing the Interface File

      为了实现需要的效果,我们需要一个UIView来展示蓝色的方块,还需要变量来存储旋转角度和缩放倍数。

      代码如下:

      1 #import <UIKit/UIKit.h>
      2 
      3 @interface animateViewController : UIViewController {
      4         UIView *boxView;
      5         float   scaleFactor;
      6         float   angle;
      7 }
      8 @property (nonatomic, retain) UIView *boxView;
      9 @end
    3. Drawing in the UIView

      进行了一些声明后,我们需要实例化对象,绘制一个蓝色的方块在屏幕上。同时也需要初始化缩放变量和旋转角度变量,然后把boxView作为子view添加到程序的主view中。

      上述这些任务在程序启动后只需要执行一次,所以将上述代码放到loadview方法中是个不错的选择。

      注意:我们也需要合成boxview的存取方法,还有释放内存。

      #import "animateViewController.h"
      
      @implementation animateViewController
      @synthesize boxView;
      .
      .
      // Implement loadView to create a view hierarchy programmatically, without using a nib.
      - (void)loadView {
          [super loadView];
              scaleFactor = 2;
              angle = 180;
              CGRect frameRect = CGRectMake(10, 10, 100, 100);
              boxView = [[UIView alloc] initWithFrame:frameRect];
              boxView.backgroundColor = [UIColor orangeColor];
              [self.view addSubview:boxView];
      }
      .
      .
      - (void)dealloc
      {
          [boxView release];
          [super dealloc];
      }
      .
      .
      - (void)viewDidUnload
      {
          [super viewDidUnload];
          // Release any retained subviews of the main view.
          // e.g. self.myOutlet = nil;
          self.boxView = nil;
      }
      .
      .
      @end
    4. Detecting Screen Touches and Performing the Animation

      当用户触击屏幕时,方块需要从当前位置移动到触击的位置。移动期间将完成旋转180度并改变大小。

      我们的动画需要在用户手指离开屏幕的时候启动,所以我们需要实现touchesEnded方法:

       1 -(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
       2 {
       3    UITouch *touch = [touches anyObject];
       4    CGPoint location = [touch locationInView:self.view];
       5    [UIView beginAnimations:nil context:nil];
       6    [UIView setAnimationDelegate:self];
       7    [UIView setAnimationDuration:2];
       8    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
       9    CGAffineTransform scaleTrans =
      10      CGAffineTransformMakeScale(scaleFactor, scaleFactor);
      11    CGAffineTransform rotateTrans = 
      12      CGAffineTransformMakeRotation(angle * M_PI / 180);
      13    boxView.transform = CGAffineTransformConcat(scaleTrans, rotateTrans);
      14    angle = (angle == 180 ? 360 : 180);
      15    scaleFactor = (scaleFactor == 2 ? 1 : 2);
      16    boxView.center = location;
      17    [UIView commitAnimations];
      18 }

      运行程序之前,需要解释一下上述代码:

      首先,通过touches参数,获取UITouch对象,接着获得触摸的点的坐标。

      UITouch *touch = [touches anyObject];
      CGPoint location = [touch locationInView:self.view];

      接着,定义animation block,将动画委托定义为自己,以便接受动画结束消息;动画时间设定为2秒,动画曲线设置为淡入淡出。

      [UIView beginAnimations:nil context:nil];
      [UIView setAnimationDelegate:self];
      [UIView setAnimationDuration:2];
      [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];

      然后,两个变换,1.缩放 2.旋转180度 ,这两个变换合成到一个单独的变换中,然后被应用到UIView。

      CGAffineTransform scaleTrans =CGAffineTransformMakeScale(scaleFactor, scaleFactor);
      CGAffineTransform rotateTrans = CGAffineTransformMakeRotation(angle * M_PI / 180);
      boxView.transform = CGAffineTransformConcat(scaleTrans, rotateTrans);

      接下来三元操作符,用来为下一次触摸转换大小和角度变量。换一种讲法,也就是,在第一次旋转180度后,第二次,我们需要旋转360;类似的,第一次触摸放大到2倍,那么第二次要缩放回原大小。

      angle = (angle == 180 ? 360 : 180);
      scaleFactor = (scaleFactor == 2 ? 1 : 2);

      最后,将方块的center设置为触摸的点,并提交动画。

      boxView.center = location;
      [UIView commitAnimations];

      运行程序!

      我去,写到这,我发现我运行后,点击没效果.....后两节就不翻译了。我研究研究问题。

      调好了,代码:https://github.com/cokecoffe/ios-demo/tree/master/CoreAnimationBegin

    5. Building and Running the Animation Application

    6. Summary

  • 相关阅读:
    软件工程
    ROR
    全息技术(Holographic technique)
    VR技术、AR技术、MR技术
    人工智能(AI)
    机器学习(Machine Learning)
    hdoj Scaena Felix
    周赛题解
    Good Luck in CET-4 Everybody!(博弈)
    Paths on a Grid(规律)
  • 原文地址:https://www.cnblogs.com/cokecoffe/p/2581744.html
Copyright © 2020-2023  润新知