一:图片轮播器效果如图:能实现自动轮播,到最后一页时,轮播回来,可以实现拖拽滚动
二:代码:
1 #import "ViewController.h" 2 static CGFloat const imageCount = 5; 3 @interface ViewController ()<UIScrollViewDelegate> 4 /*scrollView*/ 5 @property (nonatomic,weak)UIScrollView *scroll; 6 /*pageControl*/ 7 @property (nonatomic,weak)UIPageControl *pageControl; 8 /*timer*/ 9 @property (nonatomic ,strong)NSTimer *timer; 10 @property (nonatomic,assign)int a; 11 @end 12 13 @implementation ViewController 14 15 - (void)viewDidLoad { 16 [super viewDidLoad]; 17 18 //0:创建底部视图 19 UIView *bottomView = [[UIView alloc]init]; 20 bottomView.frame = CGRectMake(20, 100, self.view.frame.size.width - 40, 200); 21 [self.view addSubview:bottomView]; 22 23 24 //1:创建滚动视图 25 UIScrollView *scrollView = [[UIScrollView alloc]init]; 26 scrollView.frame = bottomView.bounds; 27 scrollView.bounces = NO; 28 scrollView.showsVerticalScrollIndicator = NO; 29 scrollView.showsHorizontalScrollIndicator = NO; 30 scrollView.pagingEnabled = YES; 31 scrollView.delegate = self; 32 scrollView.backgroundColor = [UIColor redColor]; 33 self.scroll = scrollView; 34 [bottomView addSubview:scrollView]; 35 36 //2:创建ImageView 37 CGFloat imageWidth = scrollView.frame.size.width; 38 CGFloat imageHeight = scrollView.frame.size.height; 39 40 for (int i = 0; i < imageCount; i++) { 41 42 UIImageView *imageView = [[UIImageView alloc]init]; 43 imageView.frame = CGRectMake(i *imageWidth, 0, imageWidth, imageHeight); 44 imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"img_0%d.png",i+1]]; 45 [scrollView addSubview:imageView]; 46 47 } 48 49 //3:设置scroll的contentSize 50 scrollView.contentSize = CGSizeMake(imageCount *imageWidth, 0); 51 52 53 //4:创建pageControl 54 UIPageControl *pageControl = [[UIPageControl alloc]init]; 55 pageControl.numberOfPages = imageCount; 56 pageControl.currentPage = 0; 57 pageControl.pageIndicatorTintColor = [UIColor whiteColor]; 58 pageControl.currentPageIndicatorTintColor = [UIColor redColor]; 59 pageControl.center = CGPointMake(bottomView.frame.size.width *0.5, bottomView.frame.size.height *0.9); 60 self.pageControl = pageControl; 61 [bottomView addSubview:pageControl]; 62 63 //5:添加定时器 64 NSTimer *timer = [NSTimer timerWithTimeInterval:2 target:self selector:@selector(changeImage) userInfo:nil repeats:YES]; 65 NSRunLoop *runLoop = [NSRunLoop currentRunLoop]; 66 /* 67 forMode的参数: 68 NSDefaultRunLoopMode 69 NSRunLoopCommonModes 70 */ 71 self.timer = timer; 72 [runLoop addTimer:timer forMode: NSRunLoopCommonModes]; 73 // [timer fire]; 74 75 76 //6:添加UITextView 77 UITextView *textView = [[UITextView alloc]init]; 78 textView.frame = CGRectMake(0, 320, self.view.frame.size.width, 150); 79 textView.text = @"凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo凡事看大佛我阿萨德fo一我啊搜ID念佛爱上你都放那艘IDif完加强覅进去我ijefo"; 80 textView.scrollEnabled = YES; 81 textView.backgroundColor = [UIColor redColor]; 82 [self.view addSubview:textView]; 83 } 84 85 - (void)changeImage { 86 87 NSInteger page = self.pageControl.currentPage; 88 89 90 91 if (page == imageCount -1) { 92 self.a = imageCount -1; 93 } 94 95 96 if (page == 0) { 97 self.a = 0; 98 } 99 100 101 if (self.a == imageCount -1) { 102 103 page -- ; 104 105 }else { 106 107 page ++; 108 } 109 110 111 // [self.scroll setContentOffset:CGPointMake(page *self.scroll.frame.size.width, 0) animated:YES]; 112 [UIView animateWithDuration:1.0 animations:^{ 113 self.scroll.contentOffset = CGPointMake(page *self.scroll.frame.size.width, 0); 114 }]; 115 116 } 117 118 - (void)scrollViewDidScroll:(UIScrollView *)scrollView { 119 120 //当下一页滑到>=0.5宽度时,此时就要改变pageControl 121 CGFloat page = scrollView.contentOffset.x / scrollView.frame.size.width; 122 NSUInteger currentPage = page; 123 self.pageControl.currentPage = (page - currentPage) < 0.5 ? currentPage : currentPage +1; 124 } 125 126 //拖拽开始时关闭定时器,定时器一旦关闭,就不能再重新开启 127 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView { 128 [self.timer invalidate]; 129 130 } 131 132 - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate { 133 134 self.timer = [NSTimer scheduledTimerWithTimeInterval:2 target:self selector:@selector(changeImage) userInfo:nil repeats:YES]; 135 } 136 137 138 @end
三:知识点总结
1:创建定时器: 1:NSTimer *timer = [NSTimer timerWithTimeInterval:2 target:self selector:@selector(changeImage) userInfo:nil repeats:YES];此方法创建的定时器,必须加到NSRunLoop中,NSRunLoop *runLoop = [NSRunLoop currentRunLoop]; [runLoop addTimer:timer forMode: NSRunLoopCommonModes];第二个参数有两种类型可供选择: forMode的参数: NSDefaultRunLoopMode NSRunLoopCommonModes,第一个参数为默认参数,当下面有textView,textfield等控件时,拖拽控件,此时轮播器会停止轮播,因为NSRunLoop的原因,NSRunLoop为一个死循环,实时监测有无事件响应,textView或是textField的事件会影响图片轮播,使用第二个参数会解决这个问题 2: self.timer = [NSTimer scheduledTimerWithTimeInterval:2 target:self selector:@selector(changeImage) userInfo:nil repeats:YES];此种创建定时器的方式,默认加到了runloop,且默认为第二个参数。3:定时器方法:[timer fire];此时会立刻执行定时器的方法,若是没有调用此方法,则会等待2秒执行定时器的方法。
2:轮播器的拖拽:在拖拽轮播器时,不影响轮播效果,实现滚动代理的开始拖拽方法,并关闭定时器[self.timer invalidate];定时器一旦被关闭,则不能再重新开启,需要重新创建定时器。在拖拽结束的代理中,再重新创建定时器
3:图片滚动超过宽度的0.5时的计算方法:四舍五入CGFloat page = scrollView.contentOffset.x / scrollView.frame.size.width; NSUInteger currentPage = page; self.pageControl.currentPage = (page - currentPage) < 0.5 ? currentPage : currentPage +1;先求出滚动的浮点数,在转化成整数,做差值,小于0.5的取当前的整数,大于0.5的取当前整数加1
4:设置scrollView的偏移量:1:UIView的动画 2:[self.scroll setContentOffset:CGPointMake(page *self.scroll.frame.size.width, 0) animated:YES];第二种方法,滚动的时间很短,时间小于1秒,第一种就是可以控制动画的时间,和完成动画的回调
5:设置轮播效果:
NSInteger page = self.pageControl.currentPage;
if (page == imageCount -1) {
self.a = imageCount -1;
}
if (page == 0) {
self.a = 0;
}
if (self.a == imageCount -1) {
page -- ;
}else {
page ++;
}
注意:不要在此方法中,设置pageControl的currentPage,因为如果设置了,会立刻偏移到相应的位置,但是此时还在实时监测scrollView的滚动,在此滚动代理中,小于宽度一半时,会取当前的整数页,大于时会取整数+1页,所以此时pageControl会立刻到某页,在回到-1页,再突然回到某页,存在bug。不要设置pageControl的currentPage,让其直接在滚动代理中去设置。