主要想法
添加3个ImageView展示图片，实现图片的无限循环。 使用Swipe手势识别用户向右或向左滑动图片。 使用CATransition给ImageView.layer添加动画，展示图片更换的效果。实现
在storyboard添加三个UIImageView，用来展示图片。而数组imageArray则用来保存图片对象。
@interface ViewController ()
@property (strong, nonatomic) IBOutlet UIImageView *middleImage;
@property (strong, nonatomic) IBOutlet UIImageView *leftImage;
@property (strong, nonatomic) IBOutlet UIImageView *rightImage;
@property (strong, nonatomic) NSMutableArray *imageArray;
@end
在viewDidLoad方法中设置一些初始参数
- (void)viewDidLoad {
[super viewDidLoad];
[self initData];
[self initView];
[self circleSwipeToMiddleImage];
}
- (void)initData {
self.imageArray = [NSMutableArray new];
NSString *imageName;
for (int i = 0; i < 5; i++) {
imageName = [NSString stringWithFormat:@"image%i", i];
[self.imageArray addObject:[UIImage imageNamed:imageName]];
}
}
中间的UIImageView(middleImage)最开始展示的第一张图。
- (void)initView {
self.middleImage.image = self.imageArray[0];
//在imageView中添加外框，比较容易区分三张图片的位置
[self addBorder:self.middleImage];
[self addBorder:self.leftImage];
[self addBorder:self.rightImage];
}
- (void)addBorder:(UIImageView *)imageView {
imageView.layer.borderWidth = 1.0;
imageView.layer.borderColor = [UIColor lightGrayColor].CGColor;
}
接着在self.view上添加swipe手势，分别是向左和向右轻扫。swipe手势必须要指定direction轻扫方向，否则默认是向右轻扫。
#pragma mark - 图片循环播放
- (void)circleSwipeToMiddleImage {
UISwipeGestureRecognizer *gesture1 = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(circleSwipeImageToRight)];
gesture1.direction = UISwipeGestureRecognizerDirectionRight;
self.view.userInteractionEnabled = YES;
UISwipeGestureRecognizer *gesture2 = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(circleSwipeImageToLeft)];
gesture2.direction = UISwipeGestureRecognizerDirectionLeft;
[self.view addGestureRecognizer:gesture1];
[self.view addGestureRecognizer:gesture2];
}
然后实现轻扫响应方法。
向右轻扫，middleImage显示下一张图片，则图片的下标index是当前展示图片的下标 + 1。而为了实现无限循环并不超出数组的下标范围，则需要%图片数据的张数。
/**
向右轻扫响应方法
*/
- (void)circleSwipeImageToRight {
UIImage *currentImage = self.middleImage.image;
NSInteger index = [self.imageArray indexOfObject:currentImage];
index = (index + 1) % self.imageArray.count;
[self changeAnimation:index toRight:YES];
}
