iOS 简单快速开发图片轮播器(第三方SDCycleScrollView)

一:关于图片轮播器


以前都是自己写图片轮播器,可以使UIiscrollerView也可以使用UIcollectionView,但是不管是使用UIiscrollerView还是使用UIcollectionView实现过程都略显繁琐,今天给大家介绍一个简单好用的第三方框架SDCycleScrollView来实现图片轮播器。GitHub链接地址:https://github.com/gsdios/SDCycleScrollView  。

二:SDCycleScrollView使用方法

(1)可以使用cocopods导入, pod 'SDCycleScrollView','~> 1.64' 如果发现pod search SDCycleScrollView 搜索出来的不是最新版本,需要在终端执行cd转换文件路径命令退回到desktop,然后执行pod setup命令更新本地spec缓存(可能需要几分钟),然后再搜索就可以了。
(2)也可以把demo下载下来,手动把需要的库SDCycleScrollView导入目标工程,如下:



打开下载的demo,把SDCycleScrollView库,拖入目标工程,如下图:





SDCycleScrollView处理图片时用到了SDWebImage做图片缓存,所以工程中需要导入第三方库SDWebImage。把准备工作做完后,接下来就相当爽了,只需要调用几行代码,一个图片轮播器便可以轻松搞定。废话不多说直接上代码:


[objc]  view plain  copy
 print ?
  1. //  
  2. //  ViewController.m  
  3. //  SDCycleScrollView  
  4. //  
  5. //  Created by aier on 15-3-22.  
  6. //  Copyright (c) 2015年 GSD. All rights reserved.  
  7. //  
  8.   
  9.   
  10. #import "ViewController.h"  
  11. #import "SDCycleScrollView.h"  
  12.   
  13. @interface ViewController ()   
  14.   
  15. @end  
  16.   
  17. @implementation ViewController  
  18.   
  19. - (void)viewDidLoad {  
  20.     [super viewDidLoad];  
  21.       
  22.     self.view.backgroundColor = [UIColor colorWithRed:0.98 green:0.98 blue:0.98 alpha:0.99];  
  23.     UIImageView *backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"005.jpg"]];  
  24.     backgroundView.frame = self.view.bounds;  
  25.     [self.view addSubview:backgroundView];  
  26.       
  27.     UIScrollView *demoContainerView = [[UIScrollView alloc] initWithFrame:self.view.frame];  
  28.     demoContainerView.contentSize = CGSizeMake(self.view.frame.size.width1200);  
  29.     [self.view addSubview:demoContainerView];  
  30.       
  31.     self.title = @"轮播Demo";  
  32.   
  33.       
  34.     // 情景一:采用本地图片实现  
  35.     NSArray *imageNames = @[@"h1.jpg",  
  36.                             @"h2.jpg",  
  37.                             @"h3.jpg",  
  38.                             @"h4.jpg",  
  39.                             @"h7" // 本地图片请填写全名  
  40.                             ];  
  41.       
  42.     // 情景二:采用网络图片实现  
  43.     NSArray *imagesURLStrings = @[  
  44.                            @"https://ss2.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/super/whfpf%3D425%2C260%2C50/sign=a4b3d7085dee3d6d2293d48b252b5910/0e2442a7d933c89524cd5cd4d51373f0830200ea.jpg",  
  45.                            @"https://ss0.baidu.com/-Po3dSag_xI4khGko9WTAnF6hhy/super/whfpf%3D425%2C260%2C50/sign=a41eb338dd33c895a62bcb3bb72e47c2/5fdf8db1cb134954a2192ccb524e9258d1094a1e.jpg",  
  46.                            @"http://c.hiphotos.baidu.com/image/w%3D400/sign=c2318ff84334970a4773112fa5c8d1c0/b7fd5266d0160924c1fae5ccd60735fae7cd340d.jpg"  
  47.                            ];  
  48.       
  49.     // 情景三:图片配文字  
  50.     NSArray *titles = @[@"新建交流QQ群:185534916 ",  
  51.                         @"感谢您的支持,如果下载的",  
  52.                         @"如果代码在使用过程中出现问题",  
  53.                         @"您可以发邮件到[email protected]"  
  54.                         ];  
  55.       
  56.     CGFloat w = self.view.bounds.size.width;  
  57.       
  58.       
  59.   
  60. // >>>>>>>>>>>>>>>>>>>>>>>>> demo轮播图1 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>  
  61.       
  62.     // 本地加载 --- 创建不带标题的图片轮播器  
  63.     SDCycleScrollView *cycleScrollView = [SDCycleScrollView cycleScrollViewWithFrame:CGRectMake(064, w, 180) shouldInfiniteLoop:YES imageNamesGroup:imageNames];  
  64.     cycleScrollView.delegate = self;  
  65.     cycleScrollView.pageControlStyle = SDCycleScrollViewPageContolStyleAnimated;  
  66.     [demoContainerView addSubview:cycleScrollView];  
  67.     cycleScrollView.scrollDirection = UICollectionViewScrollDirectionVertical;  
  68.     //         --- 轮播时间间隔,默认1.0秒,可自定义  
  69.     //cycleScrollView.autoScrollTimeInterval = 4.0;  
  70.       
  71.       
  72. // >>>>>>>>>>>>>>>>>>>>>>>>> demo轮播图2 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>  
  73.       
  74.     // 网络加载 --- 创建带标题的图片轮播器  
  75.     SDCycleScrollView *cycleScrollView2 = [SDCycleScrollView cycleScrollViewWithFrame:CGRectMake(0280, w, 180) delegate:self placeholderImage:[UIImage imageNamed:@"placeholder"]];  
  76.       
  77.     cycleScrollView2.pageControlAliment = SDCycleScrollViewPageContolAlimentRight;  
  78.     cycleScrollView2.titlesGroup = titles;  
  79.     cycleScrollView2.currentPageDotColor = [UIColor whiteColor]; // 自定义分页控件小圆标颜色  
  80.     [demoContainerView addSubview:cycleScrollView2];  
  81.       
  82.     //         --- 模拟加载延迟  
  83.     dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.3 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{  
  84.         cycleScrollView2.imageURLStringsGroup = imagesURLStrings;  
  85.     });  
  86.       
  87.     /* 
  88.      block监听点击方式 
  89.       
  90.      cycleScrollView2.clickItemOperationBlock = ^(NSInteger index) { 
  91.         NSLog(@">>>>>  %ld", (long)index); 
  92.      }; 
  93.       
  94.      */  
  95.       
  96.       
  97. // >>>>>>>>>>>>>>>>>>>>>>>>> demo轮播图3 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>  
  98.       
  99.     // 网络加载 --- 创建自定义图片的pageControlDot的图片轮播器  
  100.     SDCycleScrollView *cycleScrollView3 = [SDCycleScrollView cycleScrollViewWithFrame:CGRectMake(0500, w, 180) delegate:self placeholderImage:[UIImage imageNamed:@"placeholder"]];  
  101.     cycleScrollView3.currentPageDotImage = [UIImage imageNamed:@"pageControlCurrentDot"];  
  102.     cycleScrollView3.pageDotImage = [UIImage imageNamed:@"pageControlDot"];  
  103.     cycleScrollView3.imageURLStringsGroup = imagesURLStrings;  
  104.       
  105.     [demoContainerView addSubview:cycleScrollView3];  
  106.       
  107. }  
  108.   
  109.   
  110. #pragma mark - SDCycleScrollViewDelegate  
  111.   
  112. - (void)cycleScrollView:(SDCycleScrollView *)cycleScrollView didSelectItemAtIndex:(NSInteger)index  
  113. {  
  114.     NSLog(@"---点击了第%ld张图片", (long)index);  
  115.       
  116.     [self.navigationController pushViewController:[NSClassFromString(@"DemoVCWithXib") new] animated:YES];  
  117. }  
  118.   
  119.   
  120. /* 
  121.   
  122. // 滚动到第几张图回调 
  123. - (void)cycleScrollView:(SDCycleScrollView *)cycleScrollView didScrollToIndex:(NSInteger)index 
  124. { 
  125.     NSLog(@">>>>>> 滚动到第%ld张图", (long)index); 
  126. } 
  127.   
  128.  */  
  129.   
  130. @end  

你可能感兴趣的:(IOS)