1 #import "ViewController.h" 2 #define kDeviceWidth [UIScreen mainScreen].bounds.size.width 3 #define kDeviceHeight [UIScreen mainScreen].bounds.size.height 4 #define Kpage 3 5 @interface ViewController ()<UIScrollViewDelegate> 6 7 @property(nonatomic,strong)UIPageControl *pageCtrl; 8 @property (nonatomic,weak) UIScrollView *scrollView; 9 @property (nonatomic,weak) UIImageView *currentImageView; // 当前imageView 10 @property (nonatomic,weak) UIImageView *nextImageView; // 下一个imageView 11 @property (nonatomic,weak) UIImageView *preImageView; //上一个imageView 12 @property (nonatomic,assign) BOOL isDragging; // 是否正在滚动 13 @property (nonatomic,strong)NSTimer *timer; 14 @end 15 16 @implementation ViewController 17 18 - (void)viewDidLoad { 19 [super viewDidLoad];
// 注意,在有导航栏的情况下,需要在viewDidLoad 中加上 self.automaticallyAdjustsScrollViewInsets = NO;不然会出现图片下移64的情况 ,scrollView.frame的高度要比图片的高度大64,不然,图片显示不全
20 UIScrollView *scrollView =[[UIScrollView alloc] init]; 21 scrollView.frame = CGRectMake(0, 0, kDeviceWidth, kDeviceHeight); 22 [self.view addSubview:scrollView]; 23 self.scrollView = scrollView; 24 [self.scrollView setContentSize:CGSizeMake(kDeviceWidth * 3, kDeviceWidth)]; 25 // 设置隐藏横向条 26 self.scrollView.showsHorizontalScrollIndicator = NO; 27 // 设置自动分页 28 self.scrollView.pagingEnabled = YES; 29 // 设置代理 30 self.scrollView.delegate = self; 31 // 设置当前点 32 self.scrollView.contentOffset = CGPointMake(kDeviceWidth, 0); 33 // 设置是否有边界 34 self.scrollView.bounces = NO;
35 // 初始化当前视图
// 注意:这里如果图片向左轮播,无需初始化上一个视图;如果图片向右轮播,无需初始化下一个视图
36 UIImageView *currentImageView =[[UIImageView alloc] init]; 37 currentImageView.image = [UIImage imageNamed:@"bg_01"]; 38 [self.scrollView addSubview:currentImageView]; 39 self.currentImageView = currentImageView; 40 self.currentImageView.frame = CGRectMake(kDeviceWidth, 0, kDeviceWidth, kDeviceHeight); 41 self.currentImageView.contentMode = UIViewContentModeScaleAspectFill; 42 // 初始化下一个视图 43 UIImageView *nextImageView = [[UIImageView alloc] init]; 44 nextImageView.image = [UIImage imageNamed:@"bg_02"]; 45 [self.scrollView addSubview:nextImageView]; 46 self.nextImageView = nextImageView; 47 self.nextImageView.frame = CGRectMake(kDeviceWidth * 2, 0, kDeviceWidth, kDeviceHeight); 48 self.nextImageView.contentMode = UIViewContentModeScaleAspectFill; 49 // 初始化上一个视图, 50 UIImageView *preImageView =[[UIImageView alloc] init]; 51 preImageView.image = [UIImage imageNamed:@"bg_03"]; 52 preImageView.frame = CGRectMake(0, 0, kDeviceWidth, kDeviceHeight); 53 [self.scrollView addSubview:preImageView]; 54 self.preImageView = preImageView; 55 self.preImageView.contentMode =UIViewContentModeScaleAspectFill; 56 57 // 设置时钟动画 定时器 58 59 self.timer = [NSTimer scheduledTimerWithTimeInterval:2 target:self selector:@selector(update:) userInfo:nil repeats:YES]; 60 // 将定时器添加到主线程 61 [[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes]; 62 63 } 64 // 分页 65 -(UIPageControl *)pageCtrl{ 66 if (_pageCtrl == nil) { 67 68 //分页控件 69 _pageCtrl = [[UIPageControl alloc]init]; 70 _pageCtrl.numberOfPages = Kpage; 71 72 CGSize size = [_pageCtrl sizeForNumberOfPages:Kpage]; 73 _pageCtrl.bounds = CGRectMake(0, 0, size.width, size.height); 74 _pageCtrl.center = CGPointMake(self.view.center.x, CGRectGetMaxY(self.scrollView.frame) - 20); 75 _pageCtrl.pageIndicatorTintColor = [UIColor redColor]; 76 _pageCtrl.currentPageIndicatorTintColor = [UIColor greenColor]; 77 78 [self.view addSubview:_pageCtrl]; 79 80 81 } 82 return _pageCtrl; 83 } 84 85 86 -(void)updateTimer{ 87 //修改页号 88 int page = (self.pageCtrl.currentPage + 1 ) % Kpage; 89 self.pageCtrl.currentPage = page; 90 91 } 92 93 94 - (void)update:(NSTimer *)timer{ 95 //定时移动 96 97 if (_isDragging == YES) { 98 99 return ;100 }101 CGPoint offSet = self.scrollView.contentOffset;102 offSet.x +=offSet.x;103 104 [self updateTimer];105 106 [self.scrollView setContentOffset:offSet animated:YES];107 if (offSet.x >= kDeviceWidth *2) {108 offSet.x = kDeviceWidth;109 }110 111 }112 #pragma mark - UIScrollViewDelegate113 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView114 {115 _isDragging = YES;116 }117 // 停止滚动118 - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView119 {120 _isDragging = NO;121 122 }123 124 // 开始滚动125 - (void) scrollViewDidScroll:(UIScrollView *)scrollView{126 static int i =1; // 当前展示的是第几张图片127 float offset = self.scrollView.contentOffset.x;
// 注意:这里如果图片向左轮播,无需加载上一个视图;如果图片向右轮播,无需加载下一个视图
128 if (self.nextImageView.image == nil || self.preImageView.image == nil) {129 // 加载下一个视图130 NSString *imageName1 = [NSString stringWithFormat:@"bg_0%d",i == Kpage ? 1:i +1];131 _nextImageView.image = [UIImage imageNamed:imageName1];132 // 加载上一个视图133 NSString *imageName2 = [NSString stringWithFormat:@"bg_0%d",i==1 ? Kpage :i-1];134 _preImageView.image = [UIImage imageNamed:imageName2];135 136 }
// 注意:这里如果图片向左轮播,无需if(offset ==0)判断;如果图片向右轮播,无需if (offset == scrollView.bounds.size.width * 2)判断
137 if(offset ==0){138 _currentImageView.image = _preImageView.image;139 scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);140 _preImageView.image = nil;141 if (i == 1) {142 i =Kpage;143 } else{144 i-=1;145 }146 147 }148 if (offset == scrollView.bounds.size.width * 2) {149 _currentImageView.image = _nextImageView.image;150 scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);151 _nextImageView.image = nil;152 if (i == Kpage) {153 i = 1 ;154 }else{155 i +=1 ;156 }157 158 }159 160 }161 162 163 @end
假如图片为img1,img2,img3
//具体说明一下:以三张图片向左轮播为例,首先当前页面(就是看的见得)为current位置为320(以5S为例吧,宽度为320)图片为img1,下一张图片next位置为640,图片为img2,
( i= 1)
1.当前图片2秒后(假如定时器2秒执行一次)移动到640(定时器每执行一次移动一个屏幕宽度);进入if (offset == scrollView.bounds.size.width * 2) 判断
2.判断结果为当前页面的图片换成前面next的图片,结果为img2,next的图片为空,current当前页面位置变成320(i= 2)
3.因为next的图片为空,所以进入if (self.nextImageView.image == nil || self.preImageView.image == nil)
4.判断结果,根据后面的三目运算next的图片换成img3(因为三目运算)
5.当前图片2秒后又(定时器2秒执行一次)又移动到640(定时器每执行一次移动一个屏幕宽度);进入if (offset == scrollView.bounds.size.width * 2) 判断把图片换成img3,让next为空,从此无限循环
源文件在这里:http://pan.baidu.com/s/1kVKrbkb
原标题:简单的图片无限轮播器(要点提醒)
关键词:图片