IOS开发学习笔记034-UIScrollView-循环自动滚动

实现scrollView的自动循环滚动,需要实现几个方法。

其中scrollView中始终保存三张图片,其他的图片在滚动到时再进行加载。

循环的实现主要是在setUpdate 中,如果索引为0是第一个,索引为2是最后一个,这是对索引值进行改变。第一个后接着显示最后一个,最后一个后接着显示第一个。依次循环。

分析过程为:

1、首先是set方法 setImageNames

 1 #pragma mark - setter方法重写
 2 - (void)setImageNames:(NSArray *)imageNames
 3 {
 4     _imageNames = imageNames;
 5
 6     // 删除之前的所有图片,如果没有这句话图片会重复添加
 7     [self.scrollView.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];
 8
 9     //NSLog(@"setImageNames----%@",imageNames);
10     // 添加图片
11     for (int i = 0 ; i < kCount; i ++ )
12     {
13         UIImageView *imageView = [[UIImageView alloc] init];
14         [self.scrollView addSubview:imageView];
15     }
16
17     // 设置pageControl的页数
18     self.pageControl.numberOfPages = _imageNames.count;
19
20     // 更新内容
21     [self setUpdate];
22 }

2、然后实现更新内容的方法 setUpdate

 1 // 更新内容
 2 - (void)setUpdate
 3 {
 4     NSLog(@"setUpdate---%ld",self.scrollView.subviews.count);
 5     //NSInteger index = 0;
 6     // 更新数据,图片内容
 7     for (int i = 0 ; i < self.scrollView.subviews.count; i ++)
 8     {
 9         UIImageView *ima = self.scrollView.subviews[i]; // 获取图片
10         NSInteger index = self.pageControl.currentPage; // 当前索引
11
12         if (i == 0) { // 最左边图片,第一个,共三个
13             index --;
14         }
15         else if(i == 2) // 最右边图片,第二个,共三个
16         {
17             index ++;
18         }
19
20         if (index < 0) { // 如果是最左边,显示最后一张图片,总得图片个数,_imageNames.Count;
21             index = self.pageControl.numberOfPages - 1; //
22         }
23         else if(index >=  self.pageControl.numberOfPages) // 如果是最右边,就显示第一张图片
24         {
25             index = 0;
26         }
27
28         ima.tag = index; // 设置tag为计算索引值
29         ima.image = [UIImage imageNamed:self.imageNames[index]]; // 重新设置图片
30
31     }
32     // NSLog(@"setUpdate--index--%ld",index);
33     // 设置scrollView偏移量
34     self.scrollView.contentOffset = CGPointMake(self.scrollView.frame.size.width, 0);
35 }

3、然后设置控件frame

 1 #pragma mark - 计算控件的frame
 2 // layout ,计算控件的frame
 3 - (void)layoutSubviews
 4 {
 5     [super layoutSubviews];
 6
 7     // 设置scrollView的frame
 8     self.scrollView.frame = self.bounds;
 9     //view的高度和宽度
10     CGFloat viewW = self.scrollView.frame.size.width;
11     CGFloat viewH = self.scrollView.frame.size.height;
12
13     // view 的位置
14     self.scrollView.contentSize = CGSizeMake(viewW * kCount, 0);
15
16     // 计算图片的 frame
17     for(int i = 0; i < kCount ; i ++)
18     {
19         UIImageView *imageView = self.scrollView.subviews[i];
20         imageView.frame = CGRectMake(i * viewW, 0, viewW, viewH);
21     }
22
23     // pageControl 的frame
24     self.pageControl.frame = CGRectMake(viewW - 100, viewH - 20, 100, 20);
25 }

4、实现代理方法 scrollViewDidScroll

 1 #pragma mark - 代理方法
 2 // 代理方法
 3 - (void)scrollViewDidScroll:(UIScrollView *)scrollView
 4 {
 5    // NSLog(@"scrollViewDidScroll----%ld",self.scrollView.subviews.count);
 6
 7     // 计算最中间的那个imageView位置
 8     NSLog(@"scrollViewDidScroll----%ld",self.scrollView.subviews.count);
 9     NSInteger page = 0;
10     CGFloat minDistance = MAXFLOAT;
11
12     for (int i = 0 ; i < self.scrollView.subviews.count;  i++)
13     {
14         UIImageView *ima = self.scrollView.subviews[i]; // 获取图片
15         CGFloat distance = 0;
16         // 计算当前image视图中图片相对与整个scrollView的绝对距离
17         distance = ABS(ima.frame.origin.x - self.scrollView.contentOffset.x);
18         //
19         if (distance < minDistance)
20         {
21             minDistance = distance; // 最小值
22             page = ima.tag;
23         }
24     }
25     NSLog(@"scrollViewDidScroll--pageIndex-%ld",page);
26     self.pageControl.currentPage = page; // 显示最新的页码
27 }

5、设置滚动下一页的方法

1 - (void)nextPage
2 {
3     // 设置新的偏移量,直接对宽度乘以2,不用担心越界
4     [self.scrollView setContentOffset:CGPointMake(2 * self.scrollView.frame.size.width, 0) animated:YES];
5 }

主要代码如下:

  1 //
  2 //  SLQPageScroll.m
  3 //  UIScrollView-分页练习
  4 //
  5 //  Created by Christian on 15/5/31.
  6 //  Copyright (c) 2015年 slq. All rights reserved.
  7 //
  8 // 滚动图片个数
  9 #define kCount 3
 10
 11 #import "SLQPageScroll.h"
 12
 13
 14 @interface SLQPageScroll  () <UIScrollViewDelegate> // 遵守协议
 15
 16 @property (strong, nonatomic) IBOutlet UIScrollView *scrollView; // scrollView
 17 @property (weak, nonatomic) IBOutlet UIPageControl *pageControl; // pageControl
 18 @property (strong, nonatomic ) NSTimer *timer;
 19
 20 @end
 21
 22 @implementation SLQPageScroll
 23
 24 + (instancetype)pageScroll
 25 {
 26     // NSStringFromClass 将类名转换成字符串,xib文件名和类名一样
 27     return [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass(self) owner:nil options:nil] lastObject];
 28 }
 29
 30 #pragma mark - 计算控件的frame
 31 // layout ,计算控件的frame
 32 - (void)layoutSubviews
 33 {
 34     [super layoutSubviews];
 35
 36     // 设置scrollView的frame
 37     self.scrollView.frame = self.bounds;
 38     //view的高度和宽度
 39     CGFloat viewW = self.scrollView.frame.size.width;
 40     CGFloat viewH = self.scrollView.frame.size.height;
 41
 42     // view 的位置
 43     self.scrollView.contentSize = CGSizeMake(viewW * kCount, 0);
 44
 45     // 计算图片的 frame
 46     for(int i = 0; i < kCount ; i ++)
 47     {
 48         UIImageView *imageView = self.scrollView.subviews[i];
 49         imageView.frame = CGRectMake(i * viewW, 0, viewW, viewH);
 50     }
 51
 52     // pageControl 的frame
 53     self.pageControl.frame = CGRectMake(viewW - 100, viewH - 20, 100, 20);
 54 }
 55
 56 #pragma mark - setter方法重写
 57 - (void)setImageNames:(NSArray *)imageNames
 58 {
 59     _imageNames = imageNames;
 60
 61     // 删除之前的所有图片,如果没有这句话图片会重复添加
 62     [self.scrollView.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];
 63
 64     //NSLog(@"setImageNames----%@",imageNames);
 65     // 添加图片
 66     for (int i = 0 ; i < kCount; i ++ )
 67     {
 68         UIImageView *imageView = [[UIImageView alloc] init];
 69         [self.scrollView addSubview:imageView];
 70     }
 71
 72     // 设置pageControl的页数
 73     self.pageControl.numberOfPages = _imageNames.count;
 74
 75     // 更新内容
 76     [self setUpdate];
 77 }
 78
 79 #pragma mark - 代理方法
 80 // 代理方法
 81 - (void)scrollViewDidScroll:(UIScrollView *)scrollView
 82 {
 83    // NSLog(@"scrollViewDidScroll----%ld",self.scrollView.subviews.count);
 84
 85     // 计算最中间的那个imageView位置
 86     NSLog(@"scrollViewDidScroll----%ld",self.scrollView.subviews.count);
 87     NSInteger page = 0;
 88     CGFloat minDistance = MAXFLOAT;
 89
 90     for (int i = 0 ; i < self.scrollView.subviews.count;  i++)
 91     {
 92         UIImageView *ima = self.scrollView.subviews[i]; // 获取图片
 93         CGFloat distance = 0;
 94         // 计算当前image视图中图片相对与整个scrollView的绝对距离
 95         distance = ABS(ima.frame.origin.x - self.scrollView.contentOffset.x);
 96         //
 97         if (distance < minDistance)
 98         {
 99             minDistance = distance; // 最小值
100             page = ima.tag;
101         }
102     }
103     // NSLog(@"scrollViewDidScroll--pageIndex-%ld",page);
104     self.pageControl.currentPage = page; // 显示最新的页码
105 }
106
107 // 更新内容
108 - (void)setUpdate
109 {
110     //NSLog(@"setUpdate---%ld",self.scrollView.subviews.count);
111     // 更新数据,图片内容
112     for (int i = 0 ; i < self.scrollView.subviews.count; i ++)
113     {
114         UIImageView *ima = self.scrollView.subviews[i]; // 获取图片
115         NSInteger index = self.pageControl.currentPage; // 当前索引
116
117         if (i == 0) { // 最左边图片,第一个,共三个
118             index --;
119         }
120         else if(i == 2) // 最右边图片,第二个,共三个
121         {
122             index ++;
123         }
124
125         if (index < 0) { // 如果是最左边,显示最后一张图片,总得图片个数,_imageNames.Count;
126             index = self.pageControl.numberOfPages - 1; //
127         }
128         else if(index >=  self.pageControl.numberOfPages) // 如果是最右边,就显示第一张图片
129         {
130             index = 0;
131         }
132
133         ima.tag = index; // 设置tag为计算索引值
134         ima.image = [UIImage imageNamed:self.imageNames[index]]; // 重新设置图片
135
136     }
137     // NSLog(@"setUpdate--index--%ld",index)
138     // 设置scrollView偏移量
139     self.scrollView.contentOffset = CGPointMake(self.scrollView.frame.size.width, 0);
140 }
141
142 // 停止拖动
143 - (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView
144 {
145     [self setUpdate];
146 }
147
148 // 拖动暂停状态
149 - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
150 {
151     [self setUpdate];
152 }
153
154 - (void)setCurrentColor:(UIColor *)currentColor
155 {
156     _currentColor = currentColor;
157     self.pageControl.currentPageIndicatorTintColor = _currentColor;
158 }
159 - (void)setOtherColor:(UIColor *)otherColor
160 {
161     _otherColor = otherColor;
162     self.pageControl.pageIndicatorTintColor = _otherColor;
163 }
164
165 // xib 初始化完毕会调用这个方法
166 - (void)awakeFromNib
167 {
168     self.pageControl.currentPage = 0;
169     self.scrollView.bounces = NO;
170
171     // 开启定时器
172     [self startTimer];
173
174 }
175
176
177 - (void)nextPage
178 {
179     // 设置新的偏移量
180     [self.scrollView setContentOffset:CGPointMake(2 * self.scrollView.frame.size.width, 0) animated:YES];
181 }
182
183 #pragma mark - 定时器
184 - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
185 {
186     [self startTimer];
187 }
188
189 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
190 {
191     [self stopTimer];
192 }
193
194
195 - (void)startTimer
196 {
197     //  创建定时器
198     self.timer = [NSTimer scheduledTimerWithTimeInterval:3.0 target:self selector:@selector(nextPage) userInfo:nil repeats:YES];
199     // 设置计时器线程的优先级和其他线程一样
200     [[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];
201 }
202
203
204 - (void)stopTimer
205 {
206     [self.timer invalidate]; // 停止计时器
207     self.timer = nil; //清空指针
208 }
209 @end
时间: 2024-12-14 01:55:58

IOS开发学习笔记034-UIScrollView-循环自动滚动的相关文章

IOS开发学习笔记-(2)键盘控制,键盘类型设置,alert 对话框

一.关闭键盘,放弃第一响应者,处理思路有两种 ① 使用文本框的 Did End on Exit 绑定事件 ② UIControl on Touch 事件 都去操作 sender 的  resignFirstResponder #import <UIKit/UIKit.h> @interface ViewController : UIViewController @property (weak, nonatomic) IBOutlet UITextField *txtUserName; @pro

iOS开发学习笔记:基础篇

iOS开发需要一台Mac电脑.Xcode以及iOS SDK.因为苹果设备都具有自己封闭的环境,所以iOS程序的开发必须在Mac设备上完成(当然,黑苹果应该也是可以的,但就需要花很多的精力去折腾基础环境),Xcode是一个集成开发环境,包括了编辑器.调试.模拟器等等一系列方便开发和部署的工具,iOS SDK则是开发应用所必需,不同的SDK分别对应不同的iOS版本或设备,通常我们需要下载多个iOS SDK以确保我们开发的程序能够在不同版本的iOS上正常运行. 创建新工程 Xcode提供了很多种工程模

IOS开发学习笔记-(3) 进度条、等待动画开始停止

一.创建对应空间视图  ,如下图: 二.编写对应的 .h 代码,如下 : #import <UIKit/UIKit.h> @interface ViewController : UIViewController @property (weak, nonatomic) IBOutlet UIActivityIndicatorView *activWaitNetWork; @property (weak, nonatomic) IBOutlet UIProgressView *pgrsDownLo

IOS开发学习笔记(二)-语音识别(科大讯飞)

上次简单地讲解了如何利用科大讯飞完成语音合成,今天接着也把语音识别整理一下.当然,写代码前我们需要做的一些工作(如申请appid.导库),在上一篇语音合成的文章当中已经说过了,不了解的可以看看我上次的博文,那么这次直接从堆代码开始吧. 详细步骤: 1.导完类库之后,在工程里添加好用的头文件.在视图里只用了一个UITextField显示识别的内容,两个UIButton(一个开始监听语音,一个结束监听),然后引入类.添加代理,和语音合成的一样. MainViewController.h 1 #imp

IOS开发学习笔记(1)-----UILabel 详解

1. [代码][C/C++]代码     //创建uilabelUILabel *label1 = [[UILabel alloc] initWithFrame:CGRectMake(20, 40, 280, 80)];//设置背景色label1.backgroundColor = [UIColor grayColor];//设置taglabel1.tag = 91;//设置标签文本label1.text = @"Hello world!";//设置标签文本字体和字体大小label1.

IOS开发学习笔记(2)-----UIButton 详解

1. [代码][C/C++]代码     //这里创建一个圆角矩形的按钮    UIButton *button1 = [UIButton buttonWithType:UIButtonTypeRoundedRect];    //    能够定义的button类型有以下6种,//    typedef enum {//        UIButtonTypeCustom = 0,          自定义风格//        UIButtonTypeRoundedRect,        

IOS开发学习笔记--语音合成(科大讯飞)

      现在语音服务越来越热,我们平时使用的很多软件都带有语音合成和识别功能,用起来也很方便.说到语音服务,Google和微软都提供过API接口,不过笔者要介绍的是国内的智能语音技术提供商---科大讯飞.之前看过一个比较Google.微软和科大讯飞语音识别引擎的博文(http://fqctyj.blog.163.com/blog/static/70843455201361955322797/),有兴趣可以去看看.笔者接触语音服务的时间也不长,对语音服务也不是很了解,但是拆解过科大讯飞的Dem

IOS开发学习笔记017-什么是IOS开发

应用程序开发流程 1.IOS开发需要思考的问题 用户是谁?不同应用程序的内容和用户体验大不相同,这取决于想要编写的是什么应用程序,它可能是儿童游戏,也可能是待办事项列表应用程序,又或者是测试自己学习成果的应用程序. 应用程序的用途是什么?赋予应用程序一个明确的用途十分重要.了解激发用户使用应用程序的动因是界定用途的一个出发点. 应用程序尝试解决什么问题?应用程序应该完美解决单个问题,而不是尝试解决多个截然不同的问题.如果发现应用程序尝试解决不相关的问题,那么最好考虑编写多个应用程序. 应用程序要

ios开发学习笔记(1)

objective-c基础总结 第一二章 1.application:didiFinishLauchingWithOptions:程序启动后立即执行 2.启动界面代码格式:self.window = [UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];//1.从Infor.plist中取出版本号NString *version = [NSBundle mainBundle].infoDictionary[key];//2.

IOS开发学习笔记034-UIScrollView-自动滚动

让图片自动滚动的话,需要使使用定时器,循环计算当前页的页码.并且在拖动图片时停止计时器,停止拖动时启动计时器. 定时器 方法1: performSelector 1 [self performSelector:@selector(hideHUD) withObject:nil afterDelay:2.0]; 2 - (void)hideHUD 3 { 4 _hudLable.hidden = YES; 5 } 方法2: GCD 1 dispatch_after(dispatch_time(DI