国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 系統 > iOS > 正文

iOS實現無限循環圖片輪播器的封裝

2020-07-26 03:25:04
字體:
來源:轉載
供稿:網友

 項目中很多時候會碰到這個需求,實現多張圖片的無限循環輪轉,以前做過,項目中幾個地方的都用到了,當時沒有封裝,幾個地方都拷貝幾乎一樣的代碼,代碼復用性不好,今天沒事封裝了一下,使用起來比較簡單。

  首先,說說我實現循環輪轉圖片的思想,在UIScrollView中添加了3個UIImageView,并排排列,我們看到的永遠只是第二個UIImageView,這樣的話,你一直可以向左,向右滑動,當你向左滑動是,這是你滑動到了最后一個UIImageView不能在向左邊滑動了,這時,我在后面悄悄的將第二個UIImageView圖片設置為當前要顯示的圖片,調整UIScrollView的contentOffset屬性,如:

[_contentScrollView setContentOffset:CGPointMake(self.bounds.size.width, 0) animated:NO](使用者根本感覺不出來這種變化)所以,此時,你看到的又是第二個UIImageView,所以此時你又可以向左滑動,當你向右邊滑動時候處理類似,導致結果你可以向左邊,右邊無線循環輪轉圖片。

JGCirculateSwitchImgView.h頭文件

@interface JGCirculateSwitchImgView : UIView@property(nonatomic,strong)NSArray *imgUrlArr;@end

  頭文件中只有一個需要設置的成員變量imgUrlArr數組,就是你要顯示圖片路徑的數組,將通過這個數組訪問圖片。

JGCirculateSwitchImgView.m文件

typedef NS_ENUM(NSInteger, SwitchDirection){//未成功旋轉 SwitchDirectionNone = -1,//向右旋轉圖片 SwitchDirectionRight = 0,//向左訓轉圖片SwitchDirectionLeft = 1,};

定義了SwitchDirection枚舉,表示圖片向左,向右輪轉,或者什么也不做。

//默認5秒訓轉圖片一次,可以根據需要改變#define WiatForSwitchImgMaxTime 5#import "JGCirculateSwitchImgView.h"#import "UIImageView+WebCache.h"@interface JGCirculateSwitchImgView ()//底部UIScrollView@property(nonatomic,weak)UIScrollView *contentScrollView;//顯示頁碼的UIPageControl控件@property(nonatomic,weak)UIPageControl *pageControlView;//用保存當前UIPageControl控件顯示的當前位置@property(nonatomic,assign)NSInteger currentPage;//用于保存當前顯示圖片在圖片urlArr數組中的索引@property(nonatomic,assign)NSInteger currentImgIndex;//UIScrollView上的三個UIImgaView這里通過3個UIImageView實現無限循環圖片輪轉@property(nonatomic,weak)UIImageView *imgView1;@property(nonatomic,weak)UIImageView *imgView2;@property(nonatomic,weak)UIImageView *imgView3;@property(nonatomic,assign)BOOL isDragImgView;//SwitchDirection類型,用于保存滑動的方向@property(nonatomic,assign)SwitchDirection swDirection;@end
-(id)initWithFrame:(CGRect)frame{  if (self = [super initWithFrame:frame])  {    [self createContentScrollView];    [self createPageControlView];   //默認第一頁   _currentPage = 0;   //默認顯示第一張圖片   _currentImgIndex = 0;   _isDragImgView = NO;   _swDirection = SwitchDirectionNone;  }   return self;}

創建UIScrollView代碼

-(void)createContentScrollView{  UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.bounds];  scrollView.delegate = self;  scrollView.showsHorizontalScrollIndicator = NO;  scrollView.shouldGroupAccessibilityChildren = NO;  scrollView.pagingEnabled = YES;  [self addSubview:scrollView];  _contentScrollView = scrollView;}

創建UIPageControl

-(void)createPageControlView{  UIPageControl *pageControlVw = [[UIPageControl alloc] init];  pageControlVw.frame = CGRectMake(0, 0, 80, 20);  pageControlVw.center = CGPointMake(self.center.x, self.bounds.size.height - 20);  pageControlVw.backgroundColor = [UIColor redColor];  _pageControlView.pageIndicatorTintColor = [UIColor yellowColor];  _pageControlView.currentPageIndicatorTintColor = [UIColor purpleColor];  [self addSubview:pageControlVw];  _pageControlView = pageControlVw;}
//value對Count取模,并保證為正值//這里很重要,是實現無限循環的重要的一步,比如現在顯示的是第一張圖片,_currentImgIndex=0,向左滑動后就顯示_currentImgIndex+1張圖片,可是_currentImgIndex+1可能回大于_imgUrlArr的數組count,這里取模,其次還要保證為正數,比如,如果向右邊滑動是就顯示_currentImgIndex-1張圖片,_currentImgIndex-1取模也可能為負數,此時加上count保證為正數-(NSInteger)switchToMValue:(NSInteger)value Count:(NSInteger)count{  NSInteger result = value % count;  return result >=0 ? result : result + count;}

重寫imgUrlArr的set方法

-(void)setImgUrlArr:(NSArray *)imgUrlArr{  _imgUrlArr = [imgUrlArr copy];  NSInteger count = imgUrlArr.count;  if (count <= 0 )  {   return;  }  //如果只顯示一張圖片,那就沒有旋轉情況  if (count == 1)  {    UIImageView *imgView = [[UIImageView alloc]init];    imgView.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height);   [_contentScrollView addSubview:imgView];    _pageControlView.numberOfPages = 1;    _pageControlView.currentPage = 0;   _contentScrollView.contentSize = CGSizeMake(self.bounds.size.width, self.bounds.size.height);   NSURL *imgUrl = [NSURL URLWithString:imgUrlArr[0]];   [imgView sd_setImageWithURL:imgUrl placeholderImage:nil];   return;  }  if (count > 1)  {     //這里只使用3個ImgView輪轉多張圖片,數量2,3,4,5,6...     for(int i = 0; i < 3 ;i++)     {       UIImageView *imgView = [[UIImageView alloc] init];       imgView.frame = CGRectMake(i * self.bounds.size.width, 0, self.bounds.size.width, self.bounds.size.height);       imgView.layer.masksToBounds = YES;       NSString *urlStr = urlStr = _imgUrlArr[[self switchToValue:i-1 Count:count]];       NSURL *imgUrl = [NSURL URLWithString:urlStr];       [imgView sd_setImageWithURL:imgUrl placeholderImage:nil];       if (i == 0)       {         _imgView1 = imgView;         }        else if (i == 1)       {         _imgView2 = imgView;       }       else if (i == 2)       {         _imgView3 = imgView;        }       [_contentScrollView addSubview:imgView];     }    _pageControlView.numberOfPages = count;     _pageControlView.currentPage = 0;    _contentScrollView.contentSize = CGSizeMake(self.bounds.size.width * 3,  self.bounds.size.height);    _currentImgIndex = 0;    [_contentScrollView setContentOffset:CGPointMake(self.bounds.size.width, 0) animated:NO];   dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{      //循環輪轉圖片      [self switchImg];   });  }}

5秒旋轉圖片

-(void)switchImg{   while (1)   {     [NSThread sleepForTimeInterval:WiatForSwitchImgMaxTime];     //如果正在拖拽圖片,此次作廢       if (_isDragImgView) {        continue;      }      _currentPage = [self switchToValue:_currentPage + 1 Count:_imgUrlArr.count];      dispatch_async(dispatch_get_main_queue(), ^{         _pageControlView.currentPage = _currentPage;         _contentScrollView.contentOffset = CGPointMake(2 * self.bounds.size.width, 0);         [self reSetImgUrlWithDirection:SwitchDirectionLeft];     });   }}

當手動旋轉圖片

-(void)switchImgByDirection:(SwitchDirection)direction{   if (direction == SwitchDirectionNone) {     return;   }   [self reSetImgUrlWithDirection:direction];   [_contentScrollView setContentOffset:CGPointMake(self.bounds.size.width, 0) animated:NO];}

旋轉圖片后重新調整3個UIImageView顯示的內容,如實現思想所述

-(void)reSetImgUrlWithDirection:(SwitchDirection)direction{   if (direction == SwitchDirectionRight) {     [_imgView1 sd_setImageWithURL:[NSURL URLWithString:_imgUrlArr[[self switchToValue:_currentImgIndex - 2 Count:_imgUrlArr.count]]] placeholderImage:nil];     [_imgView2 sd_setImageWithURL:[NSURL URLWithString:_imgUrlArr[[self switchToValue:_currentImgIndex - 1 Count:_imgUrlArr.count]]] placeholderImage:nil];     [_imgView3 sd_setImageWithURL:[NSURL URLWithString:_imgUrlArr[[self switchToValue:_currentImgIndex Count:_imgUrlArr.count]]] placeholderImage:nil];     _currentImgIndex = [self switchToValue:_currentImgIndex - 1 Count:_imgUrlArr.count];   }   else if(direction == SwitchDirectionLeft)   {     [_imgView1 sd_setImageWithURL:[NSURL URLWithString:_imgUrlArr[[self switchToValue:_currentImgIndex Count:_imgUrlArr.count]]] placeholderImage:nil];     [_imgView2 sd_setImageWithURL:[NSURL URLWithString:_imgUrlArr[[self switchToValue:_currentImgIndex + 1 Count:_imgUrlArr.count]]] placeholderImage:nil];     [_imgView3 sd_setImageWithURL:[NSURL URLWithString:_imgUrlArr[[self switchToValue:_currentImgIndex + 2 Count:_imgUrlArr.count]]] placeholderImage:nil];     _currentImgIndex = [self switchToValue:_currentImgIndex + 1 Count:_imgUrlArr.count];   }}

實現UIScrollVie3個代理方法

#pragma mark -------------Delegate---------------//記住滑動的方向- (void)scrollViewDidScroll:(UIScrollView *)scrollView{  static float newx = 0;  static float oldx = 0;  newx= scrollView.contentOffset.x ;  if (newx != oldx )  {    if (newx > oldx)    {      _swDirection = SwitchDirectionLeft;    }else if(newx < oldx)   {     _swDirection = SwitchDirectionRight;   }   oldx = newx;  }}- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{  _isDragImgView = YES;}- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{   //向左旋轉   if (_swDirection == SwitchDirectionLeft)   {     _currentPage = [self switchToValue:_currentPage + 1 Count:_imgUrlArr.count];   }//向右旋轉   else if (_swDirection == SwitchDirectionRight)   {     _currentPage = [self switchToValue:_currentPage - 1 Count:_imgUrlArr.count];   }   _pageControlView.currentPage = _currentPage;   if (_swDirection != SwitchDirectionNone) {   [self switchImgByDirection:_swDirection];   }  _isDragImgView = NO;}

以上為實現代碼,現在看看怎么用,例如:

JGCirculateSwitchImgView *jView = [[JGCirculateSwitchImgView alloc] initWithFrame:CGRectMake(20,100, 280, 250)];NSArray *imgUrlArr = @[@"http://www.blisscake.cn/Upload/Product/Show/Source/ps_1507201119031647109.jpg",@"http://www.blisscake.cn/Upload/Product/Show/Source/ps_1507201116215754685.jpg",@"http://www.blisscake.cn/Upload/Product/Show/Source/ps_1507201115524758041.jpg",@"http://www.blisscake.cn/Upload/Product/Show/Source/ps_1507201114495822068.jpg",@"http://www.blisscake.cn/Upload/Product/Show/Source/ps_1507201107522493367.jpg"];jView.imgUrlArr = imgUrlArr;[self.view addSubview:jView];

可以看到封裝之后,代碼的重用性很高,使用起來很簡單,就這么4句代碼就可以實現圖片的無限循環輪轉。

以上就是本文的全部內容,希望對大家的學習有所幫助。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 多伦县| 额尔古纳市| 峨眉山市| 巴楚县| 建昌县| 尤溪县| 申扎县| 铜梁县| 长海县| 米林县| 扎囊县| 正宁县| 河东区| 凤阳县| 汤原县| 高邑县| 黄骅市| 措勤县| 宜宾县| 永年县| 仁布县| 清河县| 明溪县| 石棉县| 同心县| 六安市| 平塘县| 丹寨县| 新龙县| 什邡市| 张家界市| 绥江县| 岳阳市| 大庆市| 廊坊市| 英山县| 麻阳| 象山县| 广宁县| 蒲城县| 定日县|