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

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

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

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

直接上代码。

.h文件包含:

#import <UIKit/UIKit.h>

@interface CustomScrollView : UIView

@property (span,nonatomic) NSArray *imageArr;

@end

.m文件包含:

#import "CustomScrollView.h"

@interface CustomScrollView ()<UIScrollViewDelegate>

@property (span,nonatomic) UIScrollView *scrollView;

@property (span,nonatomic) UIImageView *backImageView;

@property (span,nonatomic) UIImageView *leftIamgeView;

@property (span,nonatomic) UIImageView *middleImageView;

@property (span,nonatomic) UIImageView *rightImageView;

@property (span,nonatomic) UIPageControl *pageControl;

//高度

@property (assign,nonatomic) CGFloat scrollViewHeight;

//手动造成的偏移量

@property (assign,nonatomic) CGFloat offsetX;

@property (span,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实现带有缩放效果的自动轮播图 的全部内容, 来源链接: utcz.com/z/355415.html

回到顶部