zoukankan      html  css  js  c++  java
  • UIView动画

     UIView 动画可以设置的动画属性:
     1、位置变化(frame)
     2、大小变化(bounds)
     3、中心点位置(center)
     4、旋转、缩放等(transform)
     5、透明度(alpha)
     6、背景颜色(backgroundColor)
     7、拉伸内容(contentStretch)

    UIView的Block动画块,为iOS4.0以后增加,提供更简洁的方式来实现动画。

    常用 Block 块函数:

    // 1、最简单的Block动画:包含时间和动画
        [UIView animateWithDuration:3 animations:^{
            // 执行动画
        }];
        
        // 2、带有动画完成回调的Block动画
        [UIView animateWithDuration:3 animations:^{
            // 执行的动画
        } completion:^(BOOL finished) {
            // 动画执行完毕后的操作
        }];
        
        // 3、可设置延迟时间和过渡效果的Block动画
        [UIView animateWithDuration:3 delay:3 options:UIViewAnimationOptionRepeat animations:^{
            // 执行的动画
        } completion:^(BOOL finished) {
            // 动画执行完毕后的操作
        }];
        
        // 4、Spring动画 iOS7.0后新增Spring动画(iOS系统动画大部分采用Spring Animation,适用于所有可被添加动画效果的属性)
        [UIView animateWithDuration:3 // 动画持续时间
                              delay:3 // 动画延迟执行的时间
             usingSpringWithDamping:0.5 // 震动效果(阻尼值),范围0~1,数值越小震动效果越明显
              initialSpringVelocity:0.5 // 初始速度,数值越大初始速度越快
                            options:UIViewAnimationOptionAutoreverse // 动画的过渡效果
                         animations:^{
                             //执行的动画
                         }
                         completion:^(BOOL finished) {
                             // 动画执行完毕后的操作
                         }];
        
        // 5、关键帧动画,Keyframes动画 iOS7.0后新增关键帧动画,支持属性关键帧,不支持路径关键帧
        [UIView animateKeyframesWithDuration:3 // 动画持续时间
                                       delay:3 // 动画延迟执行的时间
                                     options:UIViewKeyframeAnimationOptionLayoutSubviews // 动画的过渡效果
                                  animations:^{
                                      // 执行的关键帧动画
                                  }
                                  completion:^(BOOL finished) {
                                      // 动画执行完毕后的操作
                                  }];
        
        // 增加关键帧动画的方法
        [UIView addKeyframeWithRelativeStartTime:2 // 动画开始的时间(占总时间的比例)
                                relativeDuration:2 // 动画持续时间(占总时间的比例)
                                      animations:^{
                                          //执行的动画
                                      }];
        
        // 6、转场动画
        // 6.1 从旧视图转到新视图的动画效果
        [UIView transitionFromView:self.aIcon
                            toView:self.bIcon
                          duration:3
                           options:UIViewAnimationOptionAutoreverse
                        completion:^(BOOL finished) {
                            // 动画执行完毕后的操作
                        }];
        // 在该动画过程中,fromView 会从父视图中移除,并将 toView 添加到父视图中,注意转场动画的作用对象是父视图(过渡效果体现在父视图上)。
        
        // 6.2 单个视图的过渡效果
        [UIView transitionWithView:self.view
                          duration:3
                           options:UIViewAnimationOptionLayoutSubviews
                        animations:^{
                            // 执行的动画
                        } completion:^(BOOL finished) {
                            // 动画执行完毕后的操作
                        }];

    简单示例代码:

    // 从旧视图转到新视图的动画效果
    - (void)testTransition2 {
        UIImageView * newCenterShow = [[UIImageView alloc]initWithFrame:self.aIcon.frame];
        newCenterShow.image = [UIImage imageNamed:@"Service"];
        [UIView transitionFromView:self.aIcon toView:newCenterShow duration:1.0 options:UIViewAnimationOptionTransitionFlipFromLeft completion:^(BOOL finished) {
            NSLog(@"动画结束");
        }];
    }
    
    // 单个视图的过渡效果
    - (void)testTransition {
        [UIView transitionWithView:self.aIcon duration:1.0 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{
            self.aIcon.image = [UIImage imageNamed:@"2"];
        } completion:^(BOOL finished) {
            NSLog(@"动画结束");
        }];
    }
    
    - (void)testKeyFrame {
        [UIView animateKeyframesWithDuration:4
                                       delay:0
                                     options:UIViewKeyframeAnimationOptionCalculationModeLinear
                                  animations:^{
                                      
                                      [UIView addKeyframeWithRelativeStartTime:0
                                                              relativeDuration:1/4.f
                                                                    animations:^{
                                                                        self.aIcon.backgroundColor = [UIColor redColor];
                                                                    }];
                                      
                                      [UIView addKeyframeWithRelativeStartTime:1/4.f
                                                              relativeDuration:1/4.f
                                                                    animations:^{
                                                                        self.aIcon.backgroundColor = [UIColor purpleColor];
                                                                    }];
                                      
                                      [UIView addKeyframeWithRelativeStartTime:2.0/4.f
                                                              relativeDuration:1/4.f
                                                                    animations:^{
                                                                        self.aIcon.backgroundColor = [UIColor orangeColor];
                                                                    }];
                                      
                                      [UIView addKeyframeWithRelativeStartTime:3.0/4.f
                                                              relativeDuration:1/4.f
                                                                    animations:^{
                                                                        self.aIcon.backgroundColor = [UIColor greenColor];
                                                                    }];
                                  } completion:^(BOOL finished) {
                                      // 完成动画
                                  }];
    }
    
    - (void)testSpring {
        [UIView animateWithDuration:1
                              delay:0
             usingSpringWithDamping:0.5
              initialSpringVelocity:5
                            options:UIViewAnimationOptionCurveEaseIn
                         animations:^{
                             self.bIcon.frame = self.aIcon.frame;
                         } completion:^(BOOL finished) {
                             
                         }];
    }
    
    - (void)testB {
        [UIView animateWithDuration:2
                              delay:0
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             self.bIcon.frame = self.aIcon.frame;
                         } completion:^(BOOL finished) {
                             
                         }];
    }
    
    // 普通动画
    - (void)testA {
        [UIView animateWithDuration:2 animations:^{
            _bIcon.center = _aIcon.center;
            _bIcon.bounds = _aIcon.bounds;
        } completion:^(BOOL finished) {
            
        }];
    }

    尊重作者劳动成果,转载请注明: 【kingdev】

  • 相关阅读:
    转--安装11g oracle
    数据可视化分析(柱状图、饼图、折线图、雷达图)
    2021双十一自动刷淘宝喵糖Auto.js脚本(安卓适用)
    最近升级了一下小老婆(8核 2x8G DDR3 128G SSD)
    [Orchard CMS系列] 创建主题(Writing a new theme)
    百度,你家云管家能靠谱点不?替你脸红!Shame on you!
    [解决]ASP.NET MVC 4/5 源码调试(source code debug)
    [解决]Kali Linux DHCP自动获取IP失败 坑爹的VMWare桥接
    SSRS 页面默认显示英文
    3.2、OSPF
  • 原文地址:https://www.cnblogs.com/xiu619544553/p/5433749.html
Copyright © 2011-2022 走看看