『ios』进阶

『ios』动画篇-记一次无限循环轮播

2018-07-31  本文已影响84人  butterflyer

故事的缘由还是之前的一次面试,当时没回答好,当然最主要的原因是自己没亲自写过。
无限轮播有两种写法,第一种是 有多少张图就有多少个imageview,然后在图的两边多加两个imageview来负责切换,这种肯定耗内存啊。这是我之前回答的一种,其实这次我说的是第二种。
轮播动画,直接说如果三个imageview实现无限轮播。


QQ20180731-191718-HD.gif
 _ImageArray = pageViews;
    _pageCount = pageViews.count;
    if (pageViews.count > 1) {
       _scrollView.contentSize = CGSizeMake(CGRectGetWidth(self.frame)*3, CGRectGetHeight(self.frame));
    }else{
        _scrollView.contentSize = CGSizeMake(CGRectGetWidth(self.frame)*1, CGRectGetHeight(self.frame));
    }
    
    _pageControl.numberOfPages = _pageCount;
    _tapBlock = block;
    for (int i = 0; i<3; i++) {
        UIImageView *page = [[UIImageView alloc] init];
        page.frame = CGRectMake(self.frame.size.width * i, 0, self.frame.size.width, self.frame.size.height);
        page.tag = 1000 + I;
        [_scrollView addSubview:page];
    }
    UIImageView *leftPage = [_scrollView viewWithTag:1000];
    UIImageView *middlePage = [_scrollView viewWithTag:1001];
    UIImageView *rightPage = [_scrollView viewWithTag:1002];
    
    leftPage.image = _ImageArray.lastObject;  //刚开始   中间的肯定是显示第一张   左边的显示倒数第一张  右边的显示第二张图片
    middlePage.image = _ImageArray.firstObject;
    if (pageViews.count > 1) { //针对如果只有一张图片的情况
    rightPage.image = _ImageArray[1];
    }else{
       rightPage.image = _ImageArray[0];
    }
    _scrollView.contentOffset = CGPointMake(self.frame.size.width,0);//首先显示中间的view
    _pageControl.currentPage = 0;
    _prePageIndex = 0;
    
    if (pageViews.count > 1) {
        [self startTimer]; //开始计时器开始移动
    }

新建三个imageview放到scrollview里,刚开始显示肯定是显示中间的那个imagview。
然后最重要的就是根据滚动来设置当前显示的图片。下面是主要代码。

 // 每次滑动完了之后又重新设置当前显示的page时中间的page
    UIImageView *leftPage = [_scrollView viewWithTag:1000];
    UIImageView *middlePage = [_scrollView viewWithTag:1001];
    UIImageView *rightPage = [_scrollView viewWithTag:1002];
    
    if (_pageControl.currentPage == _pageCount - 1)//如果是到了最后一个,则中间的显示最后一个,左边的显示倒数第二个 右边的显示第一个
    {
        // n- 1 -> n -> 0
        leftPage.image = _ImageArray[_pageControl.currentPage - 1];
        middlePage.image = _ImageArray[_pageControl.currentPage];
        rightPage.image = _ImageArray.firstObject;
        
    }
    else if (_pageControl.currentPage == 0)//如果是第一个  则中间的显示第一个  左边显示倒数第一个  右边显示第二个
    {
        // n -> 0 -> 1
        // 到尾部了,改成从头开始
        leftPage.image = _ImageArray.lastObject;
        middlePage.image = _ImageArray.firstObject;
        rightPage.image = _ImageArray[1];
    }
    else //其他情况
    {
        // x - 1 -> x -> x + 1
        leftPage.image = _ImageArray[_pageControl.currentPage - 1];
        middlePage.image = _ImageArray[_pageControl.currentPage];
        rightPage.image = _ImageArray[_pageControl.currentPage + 1];
    }
    
    // 重新设置偏移量
    _scrollView.contentOffset = CGPointMake(self.frame.size.width, 0);

demo地址(https://github.com/Butteryflyyer/XHBannerScroll)

ios自习室欢迎进入,一起学习一起进步。

IMG_7291.JPG
上一篇下一篇

猜你喜欢

热点阅读