關(guān)于UIScrollView無限循環(huán)滑動

在使用某寶或某東購物的時候,我們會在其首頁看到一個可以滑動的版塊,這個版塊的實現(xiàn)就是一個UIScrollView.在我們使用UIScrollView的時候會發(fā)現(xiàn),滑動到最后的時候,UIScrollView不能像上面說的版塊那樣又回到最初的地方.基于此,做了一個小Demo來實現(xiàn)UIScrollView的無限循環(huán)滑動.

小小思路:UIScrollView具有分頁屬性,要實現(xiàn)UIScrollView的無限循環(huán)滑動,我們不能生硬暴力的給一個數(shù)組按規(guī)律的,無限的添加圖片,這樣手機內(nèi)存還不爆炸 0.0 , 如何用最少的頁面實現(xiàn)無限循環(huán)呢? 三個,其實只需要三個頁面就可以實現(xiàn)UIScrollView的無限循環(huán)滑動.左丶中丶右 三個頁面.剛進入程序時,左邊放最后一張圖片,中間第一張圖片,右邊放第二張.向左滑動一張圖片,左邊變成了第一張圖片,中間是第二張,右邊則變成了第三張圖片.依此便可實現(xiàn)UIScrollView的無限循環(huán)滑動了.

Demo 如下 :
.h文件
聲明一個數(shù)組來接收外部傳入的圖片

@interface MyScrollView: UIView <UIScrollViewDelegate>

@property(nonatomic, strong)NSArray *dataArr;

@end

.m文件
實現(xiàn)無線循環(huán)滑動

#define kPageCtrlHeight 37  //UIPageControl的高度

@interface MyScrollView ()
{

      UIImageView *leftView;
      UIImageView *centerView;
      UIImageView *rightView;
    
      UIScrollView *scrollView;
      UIPageControl *pageCtrl;    // 頁面控制器 ...
    
      NSInteger currentPageNumber;
}

@end

@implementation MyScrollView

/*----------------始終只有左,中,右3個imgView,將數(shù)據(jù)源加入到這3個imgView中顯示--------------------------*/

- (instancetype)init
{

      return [self initWithFrame:[UIScreen mainScreen].bounds];
}

- (instancetype)initWithFrame:(CGRect)frame
{

      self = [super initWithFrame:frame];
      if (self) {
          [self createUI:frame];
      }
      return self;
}

-(void)createUI:(CGRect)frame
{

      scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height - kPageCtrlHeight)];
      scrollView.delegate = self;
      scrollView.pagingEnabled = YES;
      scrollView.showsHorizontalScrollIndicator = NO;
      scrollView.showsVerticalScrollIndicator = NO;
      
      pageCtrl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, frame.size.height - kPageCtrlHeight, frame.size.width, kPageCtrlHeight)];
      pageCtrl.backgroundColor = [UIColor lightGrayColor];
    
      [self addSubview:scrollView];
      [self addSubview:pageCtrl];
    
    
      leftView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
      centerView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
      rightView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width*2, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
    
      [scrollView addSubview:leftView];
      [scrollView addSubview:centerView];
      [scrollView addSubview:rightView];
}


-(void)setDataArr:(NSArray *)dataArr
{

      if (![dataArr isKindOfClass:[NSArray class]] || dataArr.count == 0) {
          return;
      }
    
      _dataArr = dataArr;
    
      [self setInitProperty];
}

-(void)setInitProperty
{

      pageCtrl.numberOfPages = _dataArr.count;  //總頁碼
      //內(nèi)容
      scrollView.contentSize = CGSizeMake(_dataArr.count * scrollView.frame.size.width, scrollView.frame.size.height);
      [scrollView setContentOffset:CGPointMake(scrollView.frame.size.width, 0)];//偏移位置,第一頁
    
      currentPageNumber = 0;
      [self loadPageContent];
}

-(void)loadPageContent
{

      centerView.image = [UIImage imageNamed:_dataArr[currentPageNumber]];
    
      NSInteger leftImgIndex = (currentPageNumber - 1 + _dataArr.count) % _dataArr.count;
      leftView.image = [UIImage imageNamed:_dataArr[leftImgIndex]];
    
      NSInteger rightImgIndex = (currentPageNumber + 1) % _dataArr.count;
      rightView.image = [UIImage imageNamed:_dataArr[rightImgIndex]];
    
      pageCtrl.currentPage = currentPageNumber;
}

-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView_
{

      if (scrollView.contentOffset.x > scrollView.bounds.size.width) {    //向左滑動
          currentPageNumber = (currentPageNumber + 1) % _dataArr.count;
      }else if (scrollView.contentOffset.x < scrollView.bounds.size.width){   //向右滑動
          currentPageNumber = (currentPageNumber - 1 + _dataArr.count) % _dataArr.count;
      }
    
      [self loadPageContent];
    
      scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);
}

@end

ViewController.m 文件:
對myScrollView初始化并
調(diào)用myScrollView中dataArr setter方法即可。


123.gif
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市晤锹,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌藻茂,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,214評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件玫恳,死亡現(xiàn)場離奇詭異辨赐,居然都是意外死亡,警方通過查閱死者的電腦和手機纽窟,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,307評論 2 382
  • 文/潘曉璐 我一進店門肖油,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人臂港,你說我怎么就攤上這事∈硬” “怎么了审孽?”我有些...
    開封第一講書人閱讀 152,543評論 0 341
  • 文/不壞的土叔 我叫張陵,是天一觀的道長浑娜。 經(jīng)常有香客問我佑力,道長,這世上最難降的妖魔是什么筋遭? 我笑而不...
    開封第一講書人閱讀 55,221評論 1 279
  • 正文 為了忘掉前任打颤,我火速辦了婚禮暴拄,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘编饺。我一直安慰自己乖篷,他們只是感情好,可當我...
    茶點故事閱讀 64,224評論 5 371
  • 文/花漫 我一把揭開白布透且。 她就那樣靜靜地躺著撕蔼,像睡著了一般。 火紅的嫁衣襯著肌膚如雪秽誊。 梳的紋絲不亂的頭發(fā)上鲸沮,一...
    開封第一講書人閱讀 49,007評論 1 284
  • 那天,我揣著相機與錄音锅论,去河邊找鬼讼溺。 笑死,一個胖子當著我的面吹牛最易,可吹牛的內(nèi)容都是我干的怒坯。 我是一名探鬼主播,決...
    沈念sama閱讀 38,313評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼耘纱,長吁一口氣:“原來是場噩夢啊……” “哼敬肚!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起束析,我...
    開封第一講書人閱讀 36,956評論 0 259
  • 序言:老撾萬榮一對情侶失蹤艳馒,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后员寇,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體弄慰,經(jīng)...
    沈念sama閱讀 43,441評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,925評論 2 323
  • 正文 我和宋清朗相戀三年蝶锋,在試婚紗的時候發(fā)現(xiàn)自己被綠了陆爽。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,018評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡扳缕,死狀恐怖慌闭,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情躯舔,我是刑警寧澤驴剔,帶...
    沈念sama閱讀 33,685評論 4 322
  • 正文 年R本政府宣布,位于F島的核電站粥庄,受9級特大地震影響丧失,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜惜互,卻給世界環(huán)境...
    茶點故事閱讀 39,234評論 3 307
  • 文/蒙蒙 一布讹、第九天 我趴在偏房一處隱蔽的房頂上張望琳拭。 院中可真熱鬧,春花似錦描验、人聲如沸白嘁。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,240評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽权薯。三九已至,卻和暖如春睡扬,著一層夾襖步出監(jiān)牢的瞬間盟蚣,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,464評論 1 261
  • 我被黑心中介騙來泰國打工卖怜, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留屎开,地道東北人。 一個月前我還...
    沈念sama閱讀 45,467評論 2 352
  • 正文 我出身青樓马靠,卻偏偏與公主長得像奄抽,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子甩鳄,可洞房花燭夜當晚...
    茶點故事閱讀 42,762評論 2 345

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,501評論 25 707
  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫逞度、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,022評論 4 62
  • From Apple:When your application is approved by Apple to ...
    肖無情閱讀 1,347評論 0 0
  • 被最新一期的《爸爸去哪兒》戳中了淚點妙啃。 夫妻兩人看見了那個曾經(jīng)許下白首誓言的人如今仿佛跨過了歲月向自己走來档泽,溫情與...
    貳唐閱讀 602評論 0 1
  • 今天是一個特殊的日子,于我來說不僅僅只是愚人節(jié)那么簡單揖赴。 和H先生在一起有點出乎意料馆匿,畢竟在我眼里,我們倆一直是那...
    許軟妹閱讀 1,172評論 4 10