01.轮播图之五 ：一个 imageView也能 作 轮播

Posted 2020-09-14 user_bo

这个是最近才写的，本以为实现起来很有难度，需要更高深的理论，

写完之后，才发现自己错误的离谱；

之所以能用一个imageview 实现轮播 基于两点：：：

1. 使用 imageview 的layer 层设置，也就是动用的是imageview的重新绘制---- 这个是视图切换的原因
2. 使用 CATransition 动画 ------ 这个动画模拟了轮播的效果

就是简单：：：

.h 的声明

@interface ImageViewShuffling : UIView
@property (nonatomic,strong)NSArray *array;

@end

.m 实现，和理论解释

@interface ImageViewShuffling ()

@property (nonatomic,strong)UIImageView *imageView;
@property (nonatomic,assign)NSInteger  currentIndex;

@end

@implementation ImageViewShuffling
@synthesize array = _array;

-(instancetype)initWithFrame:(CGRect)frame{
    
    if (self == [super initWithFrame:frame]) {
        [self addSubview:self.imageView];
    }
    return self;
}

-(void)setArray:(NSArray *)array{
    
    NSAssert(array.count != 0, @"传入的滚动数组是 空的");
    _array = array;
    self.imageView.backgroundColor = array.firstObject;
}

-(UIImageView *)imageView{
    
    if (_imageView == nil) {
        _imageView =[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
        _imageView.contentMode = UIViewContentModeScaleAspectFit;
        _imageView.userInteractionEnabled = YES;
 /*
imageview 添加左右滑动的手势
*/
        UISwipeGestureRecognizer *left = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(leftSwifAction:)];
        left.direction = UISwipeGestureRecognizerDirectionLeft;
        [_imageView addGestureRecognizer:left];
        UISwipeGestureRecognizer *right = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(rigthSwifAction:)];
        right.direction = UISwipeGestureRecognizerDirectionRight;
        [_imageView addGestureRecognizer:right];
    }
    return _imageView;
}
/*
根据手势判断 左右的滑动 判断 显示的index
*/
-(void)rigthSwifAction:(UISwipeGestureRecognizer*)swip{
    
    self.currentIndex = (self.currentIndex+1) % (self.array.count);
    [self changeImageWithIndex:self.currentIndex andDirection:@"right"];
}
-(void)leftSwifAction:(UISwipeGestureRecognizer*)swip{

    self.currentIndex = (self.currentIndex - 1 + self.array.count)%(self.array.count);
    [self changeImageWithIndex:self.currentIndex andDirection:@"left"];
}

/*
这个是唯一的重点：：
使用 CATransition 添加动画
*/
-(void)changeImageWithIndex:(NSInteger)integer  andDirection:(NSString*)direction{

    self.imageView.backgroundColor = self.array[integer];

    CATransition *transition = [[CATransition alloc]init];
    transition.type = kCATransitionPush;
    
    if ([direction isEqualToString:@"right"]) {
        
        transition.subtype = kCATransitionFromLeft;
    }else{// if left
      
        transition.subtype = kCATransitionFromRight;
    }
    
    [self.imageView.layer addAnimation:transition forKey:@"direction"];
}

 

有木有发现，这个实现很简单呀…………

主要是CATransition 动画的功劳…………

调用：：：

-(void)prepareImageViewShuffling{
    
        ImageViewShuffling *imageViewShuffling = [[ImageViewShuffling alloc]initWithFrame:CGRectMake(10, 450, self.view.frame.size.width -20, 220)];
        [self.view addSubview:imageViewShuffling];;
        imageViewShuffling.array = self.arr;
}