一个有两秒轮询滚动的scrollView

来源:互联网 发布:coc地震升级数据 编辑:程序博客网 时间:2024/06/05 17:41

    这里做的是一个有两秒轮询滚动的scrollView,就是每隔两秒,scrollView上面的图片就会换一次,下面是代码讲解。

    

    1、首先创建一个scrollView和准备5张本地照片,也可以是网络照片数据,存放到array中,因为要让他滚动,所以你当前显示第一张图片的时候,往左滑要显示最后一张图片,所以需要分别再头部插入最后一张图片数据,和在尾部插入第一张图片数据

<p class="p1"><span class="s1">//</span><span class="s2">创建一个</span><span class="s1">scrollview</span></p><p class="p2"><span class="s3">    </span><span class="s4">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3"> = [[</span><span class="s5">UIScrollView</span><span class="s3"> </span><span class="s1">alloc</span><span class="s3">]</span><span class="s1">init</span><span class="s3">];</span></p><p class="p3"><span class="s1">    </span></p><p class="p2"><span class="s3">    </span><span class="s4">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3">.</span><span class="s1">frame</span><span class="s3"> = </span><span class="s1">CGRectMake</span><span class="s3">(</span><span class="s4">0</span><span class="s3">, </span><span class="s4">0</span><span class="s3">, </span><span class="s4">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3">.</span><span class="s1">frame</span><span class="s3">.</span><span class="s1">size</span><span class="s3">.</span><span class="s1">width</span><span class="s3">, </span><span class="s4">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3">.</span><span class="s1">frame</span><span class="s3">.</span><span class="s1">size</span><span class="s3">.</span><span class="s1">height</span><span class="s3">);</span></p><p class="p3"><span class="s1">    </span></p><p class="p2"><span class="s3">    </span><span class="s4">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3">.</span><span class="s1">delegate</span><span class="s3"> = </span><span class="s4">self</span><span class="s3">;</span></p><p class="p3"><span class="s1">    </span></p><p class="p2"><span class="s3">    </span><span class="s4">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3">.</span><span class="s1">backgroundColor</span><span class="s3"> = [</span><span class="s5">UIColor</span><span class="s3"> </span><span class="s1">greenColor</span><span class="s3">];</span></p><p class="p3"><span class="s1">    </span></p><p class="p2"><span class="s3">    [</span><span class="s4">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3"> </span><span class="s1">addSubview</span><span class="s3">:</span><span class="s4">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3">];</span></p><p class="p3"><span class="s1">    </span></p><p class="p4"><span class="s6">    </span><span class="s7">//</span><span class="s1">准备图片素材(共</span><span class="s7">5</span><span class="s1">张)</span></p><p class="p5"><span class="s3">    </span><span class="s5">NSArray</span><span class="s3"> *array = </span><span class="s4">@[</span><span class="s1">@"apic16466.jpg"</span><span class="s3">,</span><span class="s1">@"apic16892.jpg"</span><span class="s3">,</span><span class="s1">@"144833361155.jpg"</span><span class="s3">,</span><span class="s1">@"1448333704435.jpg"</span><span class="s3">,</span><span class="s1">@"1448589211477.jpg"</span><span class="s4">]</span><span class="s3">;</span></p><p class="p2"><span class="s3">    </span><span class="s4">self</span><span class="s3">.</span><span class="s1">photoArray</span><span class="s3"> = [[</span><span class="s5">NSMutableArray</span><span class="s3"> </span><span class="s1">alloc</span><span class="s3">]</span><span class="s1">initWithArray</span><span class="s3">:array];</span></p><p class="p2"><span class="s3">    </span><span class="s4">if</span><span class="s3"> (</span><span class="s4">self</span><span class="s3">.</span><span class="s1">photoArray</span><span class="s3">.</span><span class="s1">count</span><span class="s3"> > </span><span class="s4">0</span><span class="s3">) {</span></p><p class="p4"><span class="s6">        </span><span class="s7">//</span><span class="s1">在头部插入最后一张图片</span></p><p class="p2"><span class="s3">        [</span><span class="s4">self</span><span class="s3">.</span><span class="s1">photoArray</span><span class="s3"> </span><span class="s1">insertObject</span><span class="s3">:</span><span class="s4">self</span><span class="s3">.</span><span class="s1">photoArray</span><span class="s3">.</span><span class="s1">lastObject</span><span class="s3"> </span><span class="s1">atIndex</span><span class="s3">:</span><span class="s4">0</span><span class="s3">];</span></p><p class="p1"><span class="s3">        </span><span class="s1">//</span><span class="s2">在尾部插入第一张图片</span></p><p class="p2"><span class="s3">        [</span><span class="s4">self</span><span class="s3">.</span><span class="s1">photoArray</span><span class="s3"> </span><span class="s1">addObject</span><span class="s3">:</span><span class="s4">self</span><span class="s3">.</span><span class="s1">photoArray</span><span class="s3">[</span><span class="s4">1</span><span class="s3">]];</span></p><p class="p6"><span class="s1">    }</span></p>

    2、把图片加载到scrollView上,并设置scrollView的效果,还记得要实现setContentSize和setContentOffset这两个方法,分别设置scrollView的实际内容大小和显示初始位置
//设置内容图片    for (int i = 0; i < _photoArray.count; i ++) {        UIImageView *imageView = [[UIImageView alloc]init];                imageView.frame = CGRectMake(i * self.view.frame.size.width, 0, self.view.frame.size.width, self.view.frame.size.height);                imageView.image = [UIImage imageNamed:_photoArray[i]];                [self.myScrollview addSubview:imageView];    }    //设置scrollview的实际内容大小    [self.myScrollview setContentSize:CGSizeMake(self.view.frame.size.width * _photoArray.count, self.view.frame.size.height)];    //设置分页    self.myScrollview.pagingEnabled = YES;    //去除滚动条效果    self.myScrollview.showsHorizontalScrollIndicator = NO;        //是否反弹    self.myScrollview.bounces = YES;        //设置初始显示位置,很重要    [self.myScrollview setContentOffset:CGPointMake(self.view.frame.size.width, 0)];

3、给scrollView加一个滚动计时器

-(void)setScrolTimer{    //每隔两秒滚动ScrollView    self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(scrolMainScrollView) userInfo:nil repeats:YES];}
<p class="p1"><span class="s1">-(</span><span class="s2">void</span><span class="s1">)scrolMainScrollView{</span></p><p class="p2"><span class="s3">    </span><span class="s2">float</span><span class="s3"> currentX = </span><span class="s2">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3">.</span><span class="s1">contentOffset</span><span class="s3">.</span><span class="s1">x</span><span class="s3"> + </span><span class="s2">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3">.</span><span class="s1">frame</span><span class="s3">.</span><span class="s1">size</span><span class="s3">.</span><span class="s1">width</span><span class="s3">;</span></p><p class="p3"><span class="s4">    </span><span class="s5">//</span><span class="s1">滚动到某个位置</span></p><p class="p4"><span class="s3">    </span><span class="s1">//CGRect</span><span class="s6">设置将要滚动到得地方</span></p><p class="p4"><span class="s3">    </span><span class="s1">//animated</span><span class="s6">设置是否需要滚动动画</span></p><p class="p2"><span class="s3">    [</span><span class="s2">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3"> </span><span class="s1">scrollRectToVisible</span><span class="s3">:</span><span class="s1">CGRectMake</span><span class="s3">(currentX, </span><span class="s2">0</span><span class="s3">, </span><span class="s2">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3">.</span><span class="s1">frame</span><span class="s3">.</span><span class="s1">size</span><span class="s3">.</span><span class="s1">width</span><span class="s3">, </span><span class="s2">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3">.</span><span class="s1">frame</span><span class="s3">.</span><span class="s1">size</span><span class="s3">.</span><span class="s1">height</span><span class="s3">) </span><span class="s1">animated</span><span class="s3">:</span><span class="s2">YES</span><span class="s3">];</span></p><p class="p5"><span class="s1">    </span></p><p class="p4"><span class="s3">    </span><span class="s1">//</span><span class="s6">制作一个延时改变</span><span class="s1">timer</span></p><p class="p5"><span class="s1">    </span></p><p class="p4"><span class="s3">    </span><span class="s1">//</span><span class="s6">在重新生成</span><span class="s1">timer</span><span class="s6">前,把之前使用的</span><span class="s1">timer</span><span class="s6">销毁</span></p><p class="p1"><span class="s1">    </span><span class="s2">if</span><span class="s1"> (</span><span class="s2">self</span><span class="s1">.</span><span class="s7">delaytimer</span><span class="s1">) {</span></p><p class="p2"><span class="s3">        [</span><span class="s2">self</span><span class="s3">.</span><span class="s1">delaytimer</span><span class="s3"> </span><span class="s1">invalidate</span><span class="s3">];</span></p><p class="p1"><span class="s1">        </span><span class="s2">self</span><span class="s1">.</span><span class="s7">delaytimer</span><span class="s1"> = </span><span class="s2">nil</span><span class="s1">;</span></p><p class="p1"><span class="s1">    }</span></p><p class="p5"><span class="s1">    </span></p><p class="p2"><span class="s3">    </span><span class="s2">self</span><span class="s3">.</span><span class="s1">delaytimer</span><span class="s3"> = [</span><span class="s8">NSTimer</span><span class="s3"> </span><span class="s1">scheduledTimerWithTimeInterval</span><span class="s3">:</span><span class="s2">0.7</span><span class="s3"> </span><span class="s1">target</span><span class="s3">:</span><span class="s2">self</span><span class="s3"> </span><span class="s1">selector</span><span class="s3">:</span><span class="s2">@selector</span><span class="s3">(delayTimerValueChange) </span><span class="s1">userInfo</span><span class="s3">:</span><span class="s2">nil</span><span class="s3"> </span><span class="s1">repeats</span><span class="s3">:</span><span class="s2">NO</span><span class="s3">];</span></p><p class="p5"><span class="s1">    </span></p><p class="p3"><span class="s4">    </span><span class="s5">//</span><span class="s1">当跑到第</span><span class="s5">2</span><span class="s1">张图片时,在动画开始前,直接把</span><span class="s5">scrollView</span><span class="s1">的位置返回到第一张图片中</span></p><p class="p1"><span class="s1">    </span><span class="s2">if</span><span class="s1"> (currentX >= (</span><span class="s2">self</span><span class="s1">.</span><span class="s7">photoArray</span><span class="s1">.</span><span class="s7">count</span><span class="s1"> - </span><span class="s2">1</span><span class="s1">) * </span><span class="s2">self</span><span class="s1">.</span><span class="s7">view</span><span class="s1">.</span><span class="s7">frame</span><span class="s1">.</span><span class="s7">size</span><span class="s1">.</span><span class="s7">width</span><span class="s1">) {</span></p><p class="p2"><span class="s3">        [</span><span class="s2">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3"> </span><span class="s1">setContentOffset</span><span class="s3">:</span><span class="s1">CGPointMake</span><span class="s3">(</span><span class="s2">0</span><span class="s3">, </span><span class="s2">0</span><span class="s3">)];</span></p><p class="p1"><span class="s1">    }</span></p><p class="p1"><span class="s1">}</span></p><p class="p1"><span class="s1">-(</span><span class="s2">void</span><span class="s1">)delayTimerValueChange{</span></p><p class="p2"><span class="s3">    [</span><span class="s2">self</span><span class="s3"> </span><span class="s1">changePageValue</span><span class="s3">];</span></p><p class="p1"><span class="s1">}</span></p><p class="p3"><span class="s1"></span></p><p class="p1"><span class="s1">-(</span><span class="s2">void</span><span class="s1">)changePageValue{</span></p><p class="p4"><span class="s4">    </span><span class="s5">//</span><span class="s1">计算当前的页码</span></p><p class="p2"><span class="s3">    </span><span class="s2">int</span><span class="s3"> page = </span><span class="s2">self</span><span class="s3">.</span><span class="s1">myScrollview</span><span class="s3">.</span><span class="s1">contentOffset</span><span class="s3">.</span><span class="s1">x</span><span class="s3"> / </span><span class="s2">self</span><span class="s3">.</span><span class="s1">view</span><span class="s3">.</span><span class="s1">frame</span><span class="s3">.</span><span class="s1">size</span><span class="s3">.</span><span class="s1">width</span><span class="s3">;</span></p><p class="p3"><span class="s1">    </span></p><p class="p1"><span class="s1">    </span><span class="s2">if</span><span class="s1"> (page == </span><span class="s2">0</span><span class="s1">) {</span></p><p class="p1"><span class="s1">        page = (</span><span class="s2">int</span><span class="s1">)(</span><span class="s2">self</span><span class="s1">.</span><span class="s6">photoArray</span><span class="s1">.</span><span class="s6">count</span><span class="s1"> - </span><span class="s2">3</span><span class="s1">);</span></p><p class="p1"><span class="s1">    }</span><span class="s2">else</span><span class="s1"> </span><span class="s2">if</span><span class="s1"> (page == (</span><span class="s2">self</span><span class="s1">.</span><span class="s6">photoArray</span><span class="s1">.</span><span class="s6">count</span><span class="s1"> - </span><span class="s2">1</span><span class="s1">)){</span></p><p class="p1"><span class="s1">        page = </span><span class="s2">0</span><span class="s1">;</span></p><p class="p1"><span class="s1">    }</span><span class="s2">else</span><span class="s1">{</span></p><p class="p1"><span class="s1">        page --;</span></p><p class="p1"><span class="s1">    }</span></p><p class="p3"><span class="s1">    </span></p><p class="p5"><span class="s3">    </span><span class="s1">//currentPage</span><span class="s7">取值</span><span class="s1">0~4</span></p><p class="p2"><span class="s3">    </span><span class="s2">self</span><span class="s3">.</span><span class="s1">scrollPageControl</span><span class="s3">.</span><span class="s1">currentPage</span><span class="s3"> = page;</span></p><p class="p1"><span class="s1">}</span></p>
4、实现scrollView的代理方法

#pragma mark - scrollViewDelegate//scrollview开始拖动-(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{    //在拖拽时,销毁滚动视图的时间timer    [self.timer invalidate];}//scrollview结束拖动-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{    //设置到最后一个界面(假1)时返回到第一个界面(真1)    if (scrollView.contentOffset.x >= self.view.frame.size.width * (self.photoArray.count - 1)) {        if (decelerate == NO) {            //回到第一个界面            [scrollView setContentOffset:CGPointMake(self.view.frame.size.width, 0)];        }    }        if (scrollView.contentOffset.x <= 0) {        if (decelerate == NO) {            //回到最后一个界面            [scrollView setContentOffset:CGPointMake(self.view.frame.size.width * (self.photoArray.count - 2), 0)];        }    }        [self changePageValue];        //重新开启时间滚动scrollView    [self setScrolTimer];}//scrollview减速停止-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{    if (scrollView.contentOffset.x >= self.view.frame.size.width * (self.photoArray.count - 1)) {        //回到第一个界面        [scrollView setContentOffset:CGPointMake(self.view.frame.size.width, 0)];    }    if (scrollView.contentOffset.x <= 0) {        //回到最后一个界面        [scrollView setContentOffset:CGPointMake(self.view.frame.size.width * (self.photoArray.count - 2), 0)];    }        //调用改变页码的方法    [self changePageValue];}-(void)scrollViewDidScroll:(UIScrollView *)scrollView{    if (scrollView.contentOffset.x >= self.view.frame.size.width * (self.photoArray.count - 1)) {        //回到第一个界面        [scrollView setContentOffset:CGPointMake(self.view.frame.size.width, 0)];    }    if (scrollView.contentOffset.x <= 0) {        //回到最后一个界面        [scrollView setContentOffset:CGPointMake(self.view.frame.size.width * (self.photoArray.count - 2), 0)];    }        //调用改变页码的方法    [self changePageValue];}
5、给scrollView添加一个UIPageControl
#pragma mark - 创建一个UIPageControl-(void)setPageControl{    self.scrollPageControl = [[UIPageControl alloc]init];        self.scrollPageControl.frame = CGRectMake(100, self.view.frame.size.height - 70, 120, 50);    //改变UIPageControl颜色//    self.scrollPageControl.currentPageIndicatorTintColor = [UIColor blackColor];//    //    self.scrollPageControl.pageIndicatorTintColor = [UIColor blueColor];        [self.view addSubview:self.scrollPageControl];        //设置pageControl属性    //设置page总页数    self.scrollPageControl.numberOfPages = 5;    //设置当前页数    self.scrollPageControl.currentPage = 0;        //当pageControl的值改变时调用这个方法(用户触发)    [self.scrollPageControl addTarget:self action:@selector(pageControlValueChange) forControlEvents:UIControlEventValueChanged];}-(void)pageControlValueChange{    [self.myScrollview scrollRectToVisible:CGRectMake((self.scrollPageControl.currentPage + 1) * self.view.frame.size.width, 0, self.view.frame.size.width, self.view.frame.size.height) animated:YES];        //关掉时间    [self.timer invalidate];        //在重新生成timer前,把之前使用的timer销毁    if (self.delaytimer2) {        [self.delaytimer2 invalidate];        self.delaytimer2 = nil;    }        //相隔0.7秒重新恢复时间滚动scrollView    self.delaytimer2 = [NSTimer scheduledTimerWithTimeInterval:0.7 target:self selector:@selector(setScrolTimer) userInfo:nil repeats:NO];}

源码地址:  https://github.com/mooner2122/scrollview-2seconds-scroll



0 0