UIScrollView与UIPageController结合使用实现轮播

Posted 2020-06-10

  1 #import "ViewController.h"
  2 #define WIDTH self.view.frame.size.width
  3 #define HEIGHT self.view.frame.size.height
  4 @interface ViewController ()<UIScrollViewDelegate>
  5 @property (strong,nonatomic) UIImageView *imageView;
  6 @property (strong,nonatomic) UIScrollView *scroll;
  7 @property (strong,nonatomic) UIPageControl *pageControl;
  8 @end
  9 
 10 @implementation ViewController
 11 
 12 - (void)viewDidLoad {
 13     [super viewDidLoad];
 14     self.view.backgroundColor = [UIColor grayColor];
 15     //创建一个和屏幕等尺寸的ScorllView
 16     _scroll = [[UIScrollView alloc] initWithFrame:self.view.frame];
 17     _scroll.backgroundColor = [UIColor yellowColor];
 18     //重要:水平方向滚动位置,contentSize--滚动范围
 19     _scroll.contentSize = CGSizeMake(WIDTH * 7, 0);
 20     
 21     //重要---按页来滚动
 22     _scroll.pagingEnabled = YES;
 23     //关闭屏幕回弹效果
 24     _scroll.bounces = NO;
 25     //关闭滚动条
 26     _scroll.showsHorizontalScrollIndicator = NO;
 27     //非常重要-偏移量
 28 #pragma ************如果下边这一句不注掉那么运行工程的时候系统会自动偏移一次,从而会显示第二张图片
 29     //_scroll.contentOffset = CGPointMake(WIDTH, 0);
 30     //垂直方向的滚动范围
 31     _scroll.contentSize = CGSizeMake(WIDTH * 7, 0);
 32     _scroll.maximumZoomScale = 2;
 33     _scroll.minimumZoomScale = 0.5;
 34 
 35     //水平方向的视图摆放
 36     for (int i = 1; i < 8; i++) {
 37         //创建小的scrollView
 38         UIScrollView *scroll2 = [[UIScrollView alloc]initWithFrame:CGRectMake((i - 1) * WIDTH, 0, WIDTH, HEIGHT)];
 39        
 40         //循环创建视图,添加到srollView上
 41         self.imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, WIDTH, HEIGHT)];
 42         self.imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"h%d.jpeg",i]];
 43         [scroll2 addSubview:self.imageView];
 44         //一定要记得为每个小的scroll添加代理,否则不能实现缩放
 45         scroll2.delegate = self;
 46         scroll2.maximumZoomScale = 2;
 47         scroll2.minimumZoomScale = 0.5;
 48          [_scroll addSubview:scroll2];
 49     }
 50 //        //垂直方向的偏移量
 51 //    _scroll.contentOffset = CGPointMake(0, HEIGHT);
 52 //    for (int i = 1; i < 8; i++) {
 53 //        UIScrollView *scroll2 = [[UIScrollView alloc] initWithFrame:CGRectMake(0, (i - 1) * HEIGHT, WIDTH, HEIGHT)];
 54 //        [_scroll addSubview:scroll2];
 55 //        //self.imageView.frame = self.view.frame;
 56 //        self.imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, WIDTH, HEIGHT)];
 57 //        self.imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"h%d.jpeg",i]];
 58 //        [scroll2 addSubview:self.imageView];
 59 //    }
 60     
 61 //    self.scroll.maximumZoomScale = 2;
 62 //    self.scroll.minimumZoomScale = 0.5;
 63     
 64     [self.view addSubview:_scroll];
 65     _scroll.delegate = self;
 66     //添加手势,双击屏幕,缩放回到原型
 67     UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(setScrollZoom)];
 68     tap.numberOfTapsRequired =2;
 69     [self.scroll addGestureRecognizer:tap];
 70     
 71     
 72     _pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, HEIGHT - 80, WIDTH, 40)];
 73     _pageControl.numberOfPages = 7;
 74     _pageControl.pageIndicatorTintColor = [UIColor redColor];
 75     //当前页指示器(也就是小点点)的颜色
 76     _pageControl.currentPageIndicatorTintColor = [UIColor greenColor];
 77     [self.view addSubview:_pageControl];
 78     [_pageControl addTarget:self action:@selector(pagAction:) forControlEvents:UIControlEventValueChanged];
 79   
 80    
 81 }
 82 //实现代理里的缩放
 83 -(UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
 84 {
 85     _scroll.subviews[0].center = self.view.center;
 86     return scrollView.subviews[0];
 87 }
 88 #pragma mark - page的响应事件
 89 
 90 - (void)pagAction:(UIPageControl *)sender{
 91     //根据paged当前的小圆点算出现在在显示的是第几张图片,从而改变偏移量   setContentOffset(跳转至指定的页面)
 92     [self.scroll setContentOffset:CGPointMake(self.pageControl.currentPage * WIDTH, 0) animated:YES];
 93     [self setScrollZoom];
 94 }
 95 #pragma mark - 把所有的小scrollView的缩放比例变为1,也就是改回原型
 96 - (void)setScrollZoom{
 97     //当减速结束的时候,那张图回复原样
 98     //把所有的imv的缩放比例设置为1
 99     for (UIScrollView *s in self.scroll.subviews) {
100         if ([s isKindOfClass:[UIScrollView class]]) {
101             [s setZoomScale:1 animated:NO];
102         }
103     }
104 }
105 
106 
107 
108 
109 
110 -(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
111 {
112     NSLog(@"开始拖拽的时候触发");
113 }
114 #pragma mark--UIScrollView 滚动协议方法
115 -(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
116 {
117     [self setScrollZoom];
118     NSLog(@"结束拖拽时触发");
119 }
120 
121 
122 
123 -(void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView
124 {
125     NSLog(@"开始减速时触发");
126 }
127 #pragma mark -scroll的代理方法,减速结束
128 -(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
129 {
130     //根据偏移量算出现在在显示的是第几张图片,从而改变paged当前的小圆点
131     self.pageControl.currentPage = self.scroll.contentOffset.x/WIDTH;
132     [self setScrollZoom];
133     NSLog(@"减速完成时触发");
134 }
135 
136 - (void)didReceiveMemoryWarning {
137     [super didReceiveMemoryWarning];
138     // Dispose of any resources that can be recreated.
139 }
140 
141 @end