UIView

来源:互联网 发布:路面弯沉计算软件 编辑:程序博客网 时间:2024/06/03 13:20

1~UIView的Animation效果


所谓动画效果,就是会动的画,到iOS App中来说的话,就是各种UIView的移动。 想想看,如果我们自己来实现所有UIView的动画效果,需要考虑些什么东西呢? 

* 该UIView现在在哪儿? 
* 该UIView最后会动到哪儿? 
* 该UIView以什么样的方式移动到那儿? 
* 该动画持续多长时间? 
* 每次移动的最小时间间隔? 
* 每次最小时间间隔的移动的应该移动到哪儿? 
* …. 

想想这是一个多么杀脑细胞的过程,尤其是每一次的动画过程都要重复这一折磨的过程。 

还好,现实比想象的美好, 苹果公司为开发者思考了上面的问题,通过使用UIKit提供的动画支持,开发者只需要简单的几行代码就能实现各种各样的动画效果。在UIKit中,所有的动画效果支持的方法都在UIView类中。 

首先,在UIView中有很多属性用以描述一个UIView的状态,而动画就是让UIView从一个状态平滑的过渡到另外一个状态的过程。这些属性有: 
属性名         作用                                          frame         控制UIView的大小和该UIView在superview中的相对位置。bounds        控制UIView的大小center        控制UIView的位置transform     控制UIView的缩放,旋转角度等固定好中心位置之后的变化alpha         控制UIView的透明度backgroundColor控制UIView的背景色contentStretch控制UIView的拉伸方式
通过设置这些属性,基本上就解决了动画中的移动到哪儿的问题。 

接着,苹果公司在UIView中加入很多方法来方便家控制动画的移动时间,以及移动的方式。iOS3.0及之前,UIView支持的Animation方法有如下这么多: 
Object-c代码  收藏代码
  1. @interface UIView(UIViewAnimation)  
  2.   
  3. + (void)beginAnimations:(NSString *)animationID context:(void *)context;  // additional context info passed to will start/did stop selectors. begin/commit can be nested  
  4. + (void)commitAnimations;                                                 // starts up any animations when the top level animation is commited  
  5.   
  6. // no getters. if called outside animation block, these setters have no effect.  
  7. + (void)setAnimationDelegate:(id)delegate;                          // default = nil  
  8. + (void)setAnimationWillStartSelector:(SEL)selector;                // default = NULL. -animationWillStart:(NSString *)animationID context:(void *)context  
  9. + (void)setAnimationDidStopSelector:(SEL)selector;                  // default = NULL. -animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context  
  10. + (void)setAnimationDuration:(NSTimeInterval)duration;              // default = 0.2  
  11. + (void)setAnimationDelay:(NSTimeInterval)delay;                    // default = 0.0  
  12. + (void)setAnimationStartDate:(NSDate *)startDate;                  // default = now ([NSDate date])  
  13. + (void)setAnimationCurve:(UIViewAnimationCurve)curve;              // default = UIViewAnimationCurveEaseInOut  
  14. + (void)setAnimationRepeatCount:(float)repeatCount;                 // default = 0.0.  May be fractional  
  15. + (void)setAnimationRepeatAutoreverses:(BOOL)repeatAutoreverses;    // default = NO. used if repeat count is non-zero  
  16. + (void)setAnimationBeginsFromCurrentState:(BOOL)fromCurrentState;  // default = NO. If YES, the current view position is always used for new animations -- allowing animations to "pile up" on each other. Otherwise, the last end state is used for the animation (the default).  
  17.   
  18. + (void)setAnimationTransition:(UIViewAnimationTransition)transition forView:(UIView *)view cache:(BOOL)cache;  // current limitation - only one per begin/commit block  
  19.   
  20. + (void)setAnimationsEnabled:(BOOL)enabled;                         // ignore any attribute changes while set.  
  21. + (BOOL)areAnimationsEnabled;  
  22.   
  23. @end  

这些方法非常的不直观,开发者还是需要花很多时间去思考怎么组合这些方法。但是自从iOS4.0提供块语法支持之后,苹果公司把动画效果的实现封装了一下,效果立杆见影,直观了许多,因此大家完全可以不用去看上面的那些方法,重点关注如下的方法:
Object-c代码  收藏代码
  1. @interface UIView(UIViewAnimationWithBlocks)  
  2.   
  3. + (void)animateWithDuration:(NSTimeInterval)duration   
  4.                       delay:(NSTimeInterval)delay   
  5.                       options:(UIViewAnimationOptions)options   
  6.                       animations:(void (^)(void))animations   
  7.                       completion:(void (^)(BOOL finished))completion;  
  8.   
  9. + (void)animateWithDuration:(NSTimeInterval)duration   
  10.                   animations:(void (^)(void))animations   
  11.                   completion:(void (^)(BOOL finished))completion   
  12.                   NS_AVAILABLE_IOS(4_0); // delay = 0.0, options = 0  
  13.   
  14. + (void)animateWithDuration:(NSTimeInterval)duration   
  15.                   animations:(void (^)(void))animations  
  16.                   NS_AVAILABLE_IOS(4_0); // delay = 0.0, options = 0, completion = NULL  
  17.   
  18. + (void)transitionWithView:(UIView *)view   
  19.                    duration:(NSTimeIntervl)duration   
  20.                    options:(UIViewAnimationOptins)options   
  21.                    animations:(void (^)(void)animations   
  22.                    completion:(void (^)(BOOL finished)                 completion   
  23.                    NS_AVAILABLE_IOS(4_0);  
  24.   
  25. + (void)transitionFromView:(UIView *)fromView   
  26.                      toView:(UIView *)toView   
  27.                      duration:(NSTimeInterval)duration   
  28.                      options:(UIViewAnimationOptions)options   
  29.                      completion:(void (^)(BOOL finished))completion  
  30.                      NS_AVAILABLE_IOS(4_0); // toView added to fromView.superview, fromView removed from its superview  
  31.   
  32. @end  

上面的几个方法从名字上看就非常直观。前三个方法都可以按如下的方式直译,只是后两个使用了一些默认参数而已: 

Java代码  收藏代码
  1. 做一个动画效果,持续时间为duration,   
  2.                 延迟delay秒开始执行 ,  
  3.                 以options指定的方式运行这个动画,  
  4.                 animations块中指定哪些UIView会参加本次动画效果,以及动画效果完成时这些UIView会是一个什么状态,                
  5.                 动画完成之后,执行completion块进行收尾。  

有了这3个方法,开发者只需要思考,初始值,结果值,持续时间,运行方式就行了,具体的细节移动都交给类库。 

后2个方法是用于UIView相互之间转换的,个人觉得用处不大,因为用上面的三个方法同样可以做到这些效果,因此略过。 

关于UIView的动画效果支持,有2点值得一提 
* 上面所有的方法都是类方法,当调用这些方法之后,系统会新起线程执行动画效果,不会阻塞主线程的执行。 
* UIView的Animation效果只支持一些简单的2D动画效果,复杂的大家还得研究Core Animation。 

一个实战例子 
在我写的一个小游戏的主机界面中,我使用了一点动画的效果,主界面的设计图如下: 


动画后的效果图如下: 


我想要的效果就是,加载主界面后,图片缓缓的展开成扇形,然后游戏的菜单显示供玩家点击。 
代码如下: 
首先,准备动画前状态,让想展示的UIView不可见: 
Object-c代码  收藏代码
  1. -(void) prepareForIntroAnimation  
  2. {  
  3.     self.sImageView.hidden=YES;  
  4.     self.nImageView.hidden=YES;  
  5.     self.aImageView.hidden=YES;  
  6.     self.pImageView.hidden=YES;  
  7.     self.jokerImageView.hidden=YES;  
  8.       
  9.     self.hostGameButton.alpha=0.0f;  
  10.     self.joinGameButton.alpha=0.0f;  
  11.     self.singlePlayerGameButton.alpha=0.0f;  
  12.     self.helpButton.alpha=0.0f;  
  13.     _buttonsEnabled = NO;  
  14. }  

然后,展示动画效果: 
Object-c代码  收藏代码
  1. -(void) performAnimation  
  2. {  
  3.     //显示UIView  
  4.     self.sImageView.hidden=NO;  
  5.     self.nImageView.hidden=NO;  
  6.     self.aImageView.hidden=NO;  
  7.     self.pImageView.hidden=NO;  
  8.     self.jokerImageView.hidden=NO;  
  9.       
  10.     [UIView animateWithDuration:0.65f  
  11.                           delay:0.5f  
  12.                         options:UIViewAnimationOptionCurveEaseIn  
  13.                      animations:^  
  14.      {  
  15.           //确定UIView的的中心位置和偏转角度  
  16.          self.sImageView.center = CGPointMake(80.0f, 108.0f);  
  17.          self.sImageView.transform = CGAffineTransformMakeRotation(-0.22f);  
  18.            
  19.          self.nImageView.center = CGPointMake(160.0f, 93.0f);  
  20.          self.nImageView.transform = CGAffineTransformMakeRotation(-0.1f);  
  21.            
  22.          self.aImageView.center = CGPointMake(240.0f, 88.0f);  
  23.            
  24.          self.pImageView.center = CGPointMake(320.0f, 93.0f);  
  25.          self.pImageView.transform = CGAffineTransformMakeRotation(0.1f);  
  26.            
  27.          self.jokerImageView.center = CGPointMake(400.0f, 108.0f);  
  28.          self.jokerImageView.transform = CGAffineTransformMakeRotation(0.22f);  
  29.      }  
  30.                      completion:nil];  
  31.                        
  32.     [UIView animateWithDuration:0.5f  
  33.                           delay:1.0f  
  34.                         options:UIViewAnimationOptionCurveEaseOut  
  35.                      animations:^  
  36.      {  
  37.          //透明度设置为1,显示游戏菜单。  
  38.          self.hostGameButton.alpha = 1.0f;  
  39.          self.joinGameButton.alpha = 1.0f;  
  40.          self.singlePlayerGameButton.alpha = 1.0f;  
  41.          self.helpButton.alpha = 1.0f;  
  42.      }  
  43.                      completion:^(BOOL finished)  
  44.      {  
  45.          _buttonsEnabled = YES;  
  46.      }];  
  47.       
  48. }  

另外,动画效果还可以使用completion的回调块做连接,完成多个动画效果的连接。

ypedef enum {
    UIViewContentModeScaleToFill,
    UIViewContentModeScaleAspectFit,      // contents scaled to fit with fixed aspect. remainder is transparent
    UIViewContentModeScaleAspectFill,     // contents scaled to fill with fixed aspect. some portion of content may be clipped.
    UIViewContentModeRedraw,              // redraw on bounds change (calls -setNeedsDisplay)
    UIViewContentModeCenter,              // contents remain same size. positioned adjusted.
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
} UIViewContentMode;

 

 


0 0
原创粉丝点击