码迷,mamicode.com
首页 > 其他好文 > 详细

[控件] LineAnimationView

时间:2015-07-04 15:23:55      阅读:202      评论:0      收藏:0      [点我收藏+]

标签:

LineAnimationView

技术分享

 

效果

技术分享

 

说明

水平循环无间隔播放动画效果,用于loading的界面

 

源码

https://github.com/YouXianMing/LineAnimationView

//
//  LineAnimationView.h
//  AnimationLine
//
//  Created by YouXianMing on 15/7/4.
//  Copyright (c) 2015年 YouXianMing. All rights reserved.
//

#import <UIKit/UIKit.h>

typedef enum : NSUInteger {
    
    /**
     *  从左往右(默认)
     */
    LEFT_TO_RIGHT,
    
    /**
     *  从右往左
     */
    RIGHT_TO_LEFT,

} ELineAnimationType;

@interface LineAnimationView : UIView

/**
 *  动画时间间隔(默认时间为 1 秒)
 */
@property (nonatomic) NSTimeInterval      duration;

/**
 *  动画类型(默认为从左到右)
 */
@property (nonatomic) ELineAnimationType  animationType;

/**
 *  素材图片
 */
@property (nonatomic, strong) UIImage    *sourceImage;

/**
 *  开始执行动画
 */
- (void)startAnimation;

@end
//
//  LineAnimationView.m
//  AnimationLine
//
//  Created by YouXianMing on 15/7/4.
//  Copyright (c) 2015年 YouXianMing. All rights reserved.
//

#import "LineAnimationView.h"

@interface LineAnimationView ()

@property (nonatomic, strong) UIView *contentView;

@property (nonatomic, strong) UIImageView *leftImageView;
@property (nonatomic, strong) UIImageView *rightImageView;

@end

@implementation LineAnimationView

#pragma mark - 初始化
- (instancetype)initWithFrame:(CGRect)frame {
    
    self = [super initWithFrame:frame];
    if (self) {
        
        [self defaultConfig];
        
        [self setup];
    }
    
    return self;
}

- (void)defaultConfig {

    self.layer.masksToBounds = YES;
}

- (void)setup {

    CGFloat width       = self.frame.size.width;
    CGFloat height      = self.frame.size.height;
    
    self.contentView    = [[UIView alloc] initWithFrame:CGRectMake(0, 0, width * 2, height)];
    [self addSubview:self.contentView];
    
    self.leftImageView  = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, width, height)];
    [self.contentView addSubview:self.leftImageView];
    
    self.rightImageView = [[UIImageView alloc] initWithFrame:CGRectMake(width, 0, width, height)];
    [self.contentView addSubview:self.rightImageView];
    
    _animationType = LEFT_TO_RIGHT;
    _duration      = 1.f;
}

#pragma mark - 开始动画
- (void)startAnimation {
    
    if (_animationType == LEFT_TO_RIGHT) {
        
        CGFloat width          = self.frame.size.width;
        CGFloat height         = self.frame.size.height;
        
        CGRect startRect       = CGRectMake(0, 0, width * 2, height);
        CGRect endRect         = CGRectMake(-width, 0, width * 2, height);
        
        _contentView.frame     = startRect;
        
        CABasicAnimation *line = [CABasicAnimation animationWithKeyPath:@"bounds"];
        line.fromValue         = [NSValue valueWithCGRect:startRect];
        line.toValue           = [NSValue valueWithCGRect:endRect];
        line.timingFunction    = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
        line.duration          = _duration;
        line.delegate          = self;
        
        _contentView.frame     = endRect;
        [_contentView.layer addAnimation:line forKey:nil];
        
    } else if (_animationType == RIGHT_TO_LEFT) {
    
        CGFloat width          = self.frame.size.width;
        CGFloat height         = self.frame.size.height;
        
        CGRect startRect       = CGRectMake(- width, 0, width * 2, height);
        CGRect endRect         = CGRectMake(0, 0, width * 2, height);
        
        _contentView.frame     = startRect;
        
        CABasicAnimation *line = [CABasicAnimation animationWithKeyPath:@"bounds"];
        line.fromValue         = [NSValue valueWithCGRect:startRect];
        line.toValue           = [NSValue valueWithCGRect:endRect];
        line.timingFunction    = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
        line.duration          = _duration;
        line.delegate          = self;
        
        _contentView.frame     = startRect;
        [_contentView.layer addAnimation:line forKey:nil];
        
    }
}

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {

    [self startAnimation];
}

#pragma mark - 重写setter,getter方法
@synthesize sourceImage = _sourceImage;
- (void)setSourceImage:(UIImage *)sourceImage {

    _sourceImage          = sourceImage;
    _leftImageView.image  = sourceImage;
    _rightImageView.image = sourceImage;
}

- (UIImage *)sourceImage {
    
    return _sourceImage;
}

@end

 

细节

技术分享

 

[控件] LineAnimationView

标签:

原文地址:http://www.cnblogs.com/YouXianMing/p/4620599.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!