UIScrollView - 圖片輪播器

效果圖

UIScrollView - 圖片輪播.gif

需求:
1.圖片橫向手動滾動
2.圖片橫向定時滾動
3.TextVie的滾動,不影響UIScrollView
思路:

  1. 圖片橫向手動滾動
  • 1.1 自定義圖片
 UIImageView *imgViewText = [UIImageView alloc]initWithImage :XXX];
imgViewText.frame = CGRectMake(X,Y,W,H);
[self.scrollView addSubView:imgViewText];
  • 1.2 設置contentSize
CGFloat imgMaxX = CGRectGetMaxX(imgViewText.frame);
self.scrollView.contentSize = CGSizeMake(imgMaxX,0);
  • 1.3 實現(xiàn)手動分頁
    1.3.1 啟用PageControl控件
    self.scrollView.pagingEnabled = YES;
    1.3.2 使用PageControl控件
    1. currentPage (當前第幾頁)
    2. numberOfPages(共有幾頁)
    self.pageControl.numberOfPages = self.pageSum;
    1.3.3 通過代理(滾動事件),實現(xiàn)滾動和PageControl控件的同步
    - (void)scrollViewDidScroll:(UIScrollView *)scrollView{
      //獲取滾動時的偏移量
      self.scrollOffset = self.scrollView.contentOffset;
       //最初方法沒有*0.5,這樣如果將圖片滾動到中間位置,pageControl不會改變?yōu)橄乱豁?就是那個點,不會改變)!
      self.pageNo = (self.scrollOffset.x + self.scrollVisibleW *0.5)/self.scrollVisibleW;
      self.pageControl.currentPage = self.pageNo;
    }
    

2.圖片橫向定時滾動

self.timerImgScroll = [NSTimer scheduledTimerWithTimeInterval: 2.0 
target:self 
selector: @selector(autoImgScoll) 
userInfo:nil 
repeats:YES];

每隔2秒,
調用self的autoImgScoll方法一次,
(self調用self的autoImgScoll方法一次)
不發(fā)送消息,
重復調用
  • 2.2 滾動( 更改contentOffSet )
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl;//分頁指示器
@property (assign, nonatomic) int pageNo; //分頁碼
@property(nonatomic) int  pageSum;// 總頁數(shù)

-(void)autoImgScoll{
    self.pageNo ++; 
    if(self.pageNo >= self.pageSum){
        self.pageNo = 0;
    }
    CGFloat  offsetScroll = (CGFloat)self.pageNo * self.scrollVisibleW;
    self.scrollView.contentOffset = CGPointMake(offsetScroll, 0);
}

3.解決Bug

  • 3.1 當拖拽UIScrollView時,保持一段時間不放手,然后再次放手,則ScrollView會快速的切換圖片,這是因為在拖拽時候,沒有停止計時器!
    解決方法: 拖拽時候,停止計時器! 停止拖拽后,開啟新的計時器! [self.timer invalidate] - 銷毀計時器
  • 3.2 當拖拽/滾動界面上其他控件時, UIScrollView停止?jié)L動?
    原因: 能拖拽/滾動的控件都是繼承自UIScrollView
    界面只有一個線程處理UIScrollView的事件,所以,拖拽了別的控件,那么UIScrollView就不會處理!
    解決方法:
    更改timer的優(yōu)先等級,
    控件的默認等級,NSRunLoopCommonModes,
    但是網(wǎng)絡和計時器的等級NSDefaultRunLoopModes
    代碼:
      //獲取當前運行的線程
      //把計時器,放入當前線程中
      //獲取當前運行的線程,將’計時器’添加到當前線程,調整當前線程的優(yōu)先等級
      NSRunLoop *currentLoop = [NSRunLoop currentRunLoop];
      [currentLoop addTimer:self.timerImgScroll forMode:NSRunLoopCommonModes];
    

UIScrollView - 圖片輪播器(完整代碼)

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容