iOS实现带有缩放效果的自动轮播图

本文实例为大家分享了iOS带有缩放效果的自动轮播图，供大家参考，具体内容如下

可直接设置frame然后加载到视图上使用。

效果就是这样的，图片切换的过程中还是有卡顿，不够流畅，后续更新。

直接上代码。

.h文件包含：

#import <UIKit/UIKit.h> 

@interface CustomScrollView : UIView
@property (strong,nonatomic) NSArray *imageArr; 

@end

.m文件包含:

#import "CustomScrollView.h" 

@interface CustomScrollView ()<UIScrollViewDelegate> 

@property (strong,nonatomic) UIScrollView *scrollView;
@property (strong,nonatomic) UIImageView *backImageView; 

@property (strong,nonatomic) UIImageView *leftIamgeView;
@property (strong,nonatomic) UIImageView *middleImageView;
@property (strong,nonatomic) UIImageView *rightImageView; 

@property (strong,nonatomic) UIPageControl *pageControl; 

//高度
@property (assign,nonatomic) CGFloat scrollViewHeight; 

//手动造成的偏移量
@property (assign,nonatomic) CGFloat offsetX; 

@property (strong,nonatomic) NSTimer *timer; 

//属于计时器方法动画持续时间 ？
@property (assign,nonatomic) BOOL timerAnimation; 

@end 

//左右内容的最大偏移量
#define OFFSET_MAX   ([UIScreen mainScreen].bounds.size.width-64)*0.9 

@implementation CustomScrollView 

- (instancetype)initWithFrame:(CGRect)frame {
 if (self = [super initWithFrame:frame]) { 

  self.scrollViewHeight = frame.size.height; 

  [self addSubview:self.backImageView];
  [self addSubview:self.scrollView];
  [self addSubview:self.pageControl]; 

  [self.backImageView mas_makeConstraints:^(MASConstraintMaker *make) {
   make.edges.with.mas_equalTo(self);
  }];
  [self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
   make.edges.with.mas_equalTo(self);
  }];
  [self.pageControl mas_makeConstraints:^(MASConstraintMaker *make) {
   make.left.right.bottom.mas_equalTo(self);
   make.height.mas_equalTo(@20);
  }]; 

  self.timer = [NSTimer scheduledTimerWithTimeInterval:5 target:self selector:@selector(timerAction) userInfo:nil repeats:YES];
  [[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSDefaultRunLoopMode];
  [self.timer setFireDate:[NSDate dateWithTimeIntervalSinceNow:5]];
 }
 return self;
} 

- (NSArray *)imageArr {
 if (!_imageArr) {
  _imageArr = @[@"timg-0",@"timg-1",@"timg-2"];
 }
 return _imageArr;
} 

- (UIImageView *)backImageView {
 if (!_backImageView) {
  _backImageView = [[UIImageView alloc] init];
  _backImageView.image = [UIImage imageNamed:@"bg_home"];
 }
 return _backImageView;
} 

- (UIScrollView *)scrollView {
 if (!_scrollView) {
  _scrollView = [[UIScrollView alloc] init];
  _scrollView.showsVerticalScrollIndicator = NO;
  _scrollView.showsHorizontalScrollIndicator = NO;
  _scrollView.contentSize = CGSizeMake(kScreenWidth+2*OFFSET_MAX, self.scrollViewHeight);
  [_scrollView setContentOffset:CGPointMake(OFFSET_MAX, 0)];
  _scrollView.bounces = NO;
  _scrollView.delegate = self; 

  _leftIamgeView = [[UIImageView alloc] init];
  _leftIamgeView.image = [UIImage imageNamed:self.imageArr[0]];
  _leftIamgeView.layer.cornerRadius = 5;
  _leftIamgeView.layer.masksToBounds = YES; 

  _middleImageView = [[UIImageView alloc] init];
  _middleImageView.image = [UIImage imageNamed:self.imageArr[1]];
  _middleImageView.layer.cornerRadius = 5;
  _middleImageView.layer.masksToBounds = YES; 

  _rightImageView = [[UIImageView alloc] init];
  _rightImageView.image = [UIImage imageNamed:self.imageArr[2]];
  _rightImageView.layer.cornerRadius = 5;
  _rightImageView.layer.masksToBounds = YES; 

  [_scrollView addSubview:_leftIamgeView];
  [_scrollView addSubview:_middleImageView];
  [_scrollView addSubview:_rightImageView];
  [_leftIamgeView mas_makeConstraints:^(MASConstraintMaker *make) {
   make.size.mas_equalTo(CGSizeMake((kScreenWidth-64)*0.9, self.scrollViewHeight*0.9));
   make.centerY.mas_equalTo(_scrollView);
   make.right.mas_equalTo(_middleImageView.mas_left).offset(-20);
  }];
  [_middleImageView mas_makeConstraints:^(MASConstraintMaker *make) {
   make.size.mas_equalTo(CGSizeMake(kScreenWidth-64, self.scrollViewHeight));
   make.centerY.mas_equalTo(_scrollView);
   make.left.mas_equalTo(_scrollView).offset(OFFSET_MAX+64/2);
  }];
  [_rightImageView mas_makeConstraints:^(MASConstraintMaker *make) {
   make.size.mas_equalTo(_leftIamgeView);
   make.centerY.mas_equalTo(_scrollView);
   make.left.mas_equalTo(_middleImageView.mas_right).offset(20);
  }];
 }
 return _scrollView;
} 

- (UIPageControl *)pageControl {
 if (!_pageControl) {
  _pageControl = [[UIPageControl alloc] init];
  _pageControl.numberOfPages = self.imageArr.count;
  _pageControl.enabled = NO;
  _pageControl.currentPage = 0;
  _pageControl.hidesForSinglePage = YES;
  _pageControl.pageIndicatorTintColor = [UIColor whiteColor];
  _pageControl.currentPageIndicatorTintColor = MAINCOLOR;
 }
 return _pageControl;
} 

#pragma mark ------------ UIScrollViewDelegate -------- 

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
 if (self.timerAnimation) {
  return;
 }
 CGFloat offScale = scrollView.contentOffset.x - OFFSET_MAX;
 if (offScale < 0) {
  //右滑
  self.leftIamgeView.layer.transformScale = 1 + 1.0/9*(fabs(offScale)/OFFSET_MAX);
  self.middleImageView.layer.transformScale = 1 - 0.1*(fabs(offScale)/OFFSET_MAX);
 } else {
  //左滑
  self.rightImageView.layer.transformScale = 1 + 1.0/9*(fabs(offScale)/OFFSET_MAX);
  self.middleImageView.layer.transformScale = 1 - 0.1*(fabs(offScale)/OFFSET_MAX);
 } 

} 

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
 CGPoint offset = scrollView.contentOffset; 

 self.offsetX = offset.x; 

 if ((fabs(self.offsetX-OFFSET_MAX) >= OFFSET_MAX*0.5)) {
  if (!decelerate) {
   //替换图片
   [self exchangeImage];
  }
 } else {
  //回弹复位
  [scrollView setContentOffset:CGPointMake(OFFSET_MAX, 0) animated:YES];
  self.leftIamgeView.layer.transform = CATransform3DIdentity;
  self.middleImageView.layer.transform = CATransform3DIdentity;
  self.rightImageView.layer.transform = CATransform3DIdentity;
 }
} 

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
 //替换图片
 [self exchangeImage];
} 

#pragma mark ---------- exchangeImage ------
//替换图片
- (void)exchangeImage {
 if (self.offsetX-OFFSET_MAX < 0) {
  //右滑
  UIImage *rightImage = self.rightImageView.image;
  self.rightImageView.image = self.middleImageView.image;
  self.middleImageView.image = self.leftIamgeView.image;
  self.leftIamgeView.image = rightImage; 

  if (self.pageControl.currentPage - 1 < 0) {
   self.pageControl.currentPage = self.pageControl.numberOfPages-1;
  } else {
   self.pageControl.currentPage -= 1;
  } 

 } else {
  //左滑
  UIImage *leftImage = self.leftIamgeView.image;
  self.leftIamgeView.image = self.middleImageView.image;
  self.middleImageView.image = self.rightImageView.image;
  self.rightImageView.image = leftImage; 

  if (self.pageControl.currentPage + 1 >= self.pageControl.numberOfPages) {
   self.pageControl.currentPage = 0;
  } else {
   self.pageControl.currentPage += 1;
  }
 }
 [self.scrollView setContentOffset:CGPointMake(OFFSET_MAX, 0)];
 self.leftIamgeView.layer.transform = CATransform3DIdentity;
 self.middleImageView.layer.transform = CATransform3DIdentity;
 self.rightImageView.layer.transform = CATransform3DIdentity;
} 

#pragma mark ---------- timer --------
- (void)timerAction {
 self.offsetX = kScreenWidth+OFFSET_MAX-64; 

 self.timerAnimation = YES;
 [UIView animateWithDuration:0.8 animations:^{
  [self.scrollView setContentOffset:CGPointMake(self.offsetX, 0)];
  self.rightImageView.layer.transformScale = 10/9.0;
  self.middleImageView.layer.transformScale = 0.9;
 } completion:^(BOOL finished) {
  self.timerAnimation = NO;
  [self exchangeImage];
  self.rightImageView.layer.transform = CATransform3DIdentity;
  self.middleImageView.layer.transform = CATransform3DIdentity;
 }];
} 

@end 

最后调用：

self.scrollView = [[CustomScrollView alloc] initWithFrame:CGRectMake(0, 0, kScreenWidth, 170)];
[self.view addSubview:self.scrollView]; 

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

您可能感兴趣的文章:

• IOS 开发之网络图片轮播图的实现
• iOS实现轮播图banner示例