美文网首页iOS
隐式动画

隐式动画

作者: iOS_成才录 | 来源:发表于2015-11-12 19:24 被阅读166次

    一、前言

    • 每一个UIView内部都默认关联着一个CALayer对象,我们可用称这个Layer为Root Layer(根层)
    • 所有的非RootLayer根层,也就是手动创建的CALayer对象,都存在着隐式动画

    二、什么是隐式动画?

    • 当对非RootLayer的部分属性进行修改时,默认会自动产生一些动画效果
    • 而这些属性称为AnimatableProperties(可动画属性)
    • 也就是说,对非根层的layer可动画属性进行修改产生的动画,就称为隐式动画

    三、可动画属性 Animatable Properties

    • 如上所述:我们可以修改可动画属性,来进行隐式动画,现在介绍可动画属性

    • 查看CALayer头文件:查看部分可动画属性

    • 哪些才可以称着,可动画属性呢? -> 属性,注释中包含 Animatable

    • 常见可动画属性

      • bounds:用于设置CALayer的宽度和高度。修改这个属性会产生缩放动画
      • backgroundColor:用于设置CALayer的背景色。修改这个属性会产生背景色的渐变动画
      • position:用于设置CALayer的位置。修改这个属性会产生平移动画
      • ............
    
    // 查看部分头文件,还有其他的可动画属性不在此
    
    /* The bounds of the layer. Defaults to CGRectZero. Animatable. */
    @property CGRect bounds;
    
    /* The position in the superlayer that the anchor point of the layer's
     * bounds rect is aligned to. Defaults to the zero point. Animatable. */
    @property CGPoint position;
    
    /* The Z component of the layer's position in its superlayer. Defaults
     * to zero. Animatable. */
    @property CGFloat zPosition;
    
    /* Defines the anchor point of the layer's bounds rect, as a point in
     * normalized layer coordinates - '(0, 0)' is the bottom left corner of
     * the bounds rect, '(1, 1)' is the top right corner. Defaults to
     * '(0.5, 0.5)', i.e. the center of the bounds rect. Animatable. */
    @property CGPoint anchorPoint;
    
    /* The Z component of the layer's anchor point (i.e. reference point for
     * position and transform). Defaults to zero. Animatable. */
    @property CGFloat anchorPointZ;
    
    /* A transform applied to the layer relative to the anchor point of its
     * bounds rect. Defaults to the identity transform. Animatable. */
    @property CATransform3D transform;
    
    /* Convenience methods for accessing the `transform' property as an
     * affine transform. */
    - (CGAffineTransform)affineTransform;
    - (void)setAffineTransform:(CGAffineTransform)m;
    
    /* Unlike NSView, each Layer in the hierarchy has an implicit frame
     * rectangle, a function of the `position', `bounds', `anchorPoint',
     * and `transform' properties. When setting the frame the `position'
     * and `bounds.size' are changed to match the given frame. */
    @property CGRect frame;
    
    /* When true the layer and its sublayers are not displayed. Defaults to
     * NO. Animatable. */
    @property(getter=isHidden) BOOL hidden;
    

    四 隐式动画 实现 : CATransaction(动画事务)

    • 可以通过动画事务(CATransaction)关闭默认的隐式动画效果
    [CATransactionbegin];
    [CATransactionsetDisableActions:YES];
    self.myview.layer.position= CGPointMake(10,10);
    [CATransactioncommit];
    

    五、实例

    • 实例:


      隐式动画.gif
      • 点击屏幕,让控制器上的view视图上的一个矩形子控件,不断地进行改变:位置,颜色,与圆角
    • 思路:其实很简单,在touchBegin:方法中 -> 就是不断修改layer的可动画属性实现的

    • 代码实现:如下

    #import "ViewController.h"
    
    @interface ViewController ()
    
    @property (nonatomic, weak) CALayer *greenLayer;
    
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        
        // 添加 一个自定义的layer到控制器的view的layer上
        CALayer *layer = [CALayer layer];
        
        _greenLayer = layer;
        
        layer.position = CGPointMake(0, 0);
        layer.bounds = CGRectMake(0, 0, 100, 100);
        layer.anchorPoint = CGPointMake(0, 0);
        layer.backgroundColor = [UIColor greenColor].CGColor;
        
        [self.view.layer addSublayer:layer];
    }
    
    - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
    {
        // 开启事务
        [CATransaction begin];
        
        
    //    [CATransaction setDisableActions:YES];
    //    [CATransaction setAnimationDuration:2];
        _greenLayer.position = CGPointMake(arc4random_uniform(250), arc4random_uniform(300));
        
        _greenLayer.backgroundColor = [self randomColor].CGColor;
        _greenLayer.cornerRadius = arc4random_uniform(50);
        
        _greenLayer.borderColor = [self randomColor].CGColor;
        _greenLayer.borderWidth = arc4random_uniform(5);
        
        // 提交事务
        [CATransaction commit];
        
    }
    
    /**
     *  返回 随机色
     */
    - (UIColor *)randomColor
    {
        CGFloat r = arc4random_uniform(256) / 255.0;
        CGFloat g = arc4random_uniform(256) / 255.0;
        CGFloat b = arc4random_uniform(256) / 255.0;
        return [UIColor colorWithRed:r green:g blue:b alpha:1];
    }
    
    @end
         ```
    
    
    
    

    相关文章

      网友评论

      本文标题:隐式动画

      本文链接:https://www.haomeiwen.com/subject/zhpfhttx.html