iOSios第三方资源程序员

最简单方便的iOS轮播开源库:JYCarousel

2016-11-18  本文已影响3902人  Dely

前言

最近林丹出轨的事件占据头条。其实圈内的事就那么回事吧,我们平时身边这种事情也很多,只是我们不是公众人物,就算有也不会很多人知道。还是找个程序猿当老公好啊,绝对不会出轨哦。如果凌晨3点你老公还没回家,那他准是在写代码,我为我自己代言_

今天我要推荐一个轮播开源库JYCarousel。如果中间使用过程中有任何的问题可以联系我,我会尽快处理解决,给你们一个简单方便的使用体验。

轮播组件:JYCarousel

开源库名称: JYCarousel

开源库当前版本: 0.0.1

开源库github地址:https://github.com/Delyer/JYCarousel

开源库简介: 这是一个使用起来非常简单的开源轮播库,自带下载和缓存,不会造成循环引用,不用考虑定时器不会销毁(我都已经帮你做好了)。

JYCarouselIcon.png

1. JYCarousel 使用方式

pod 'JYCarousel', '~> 0.0.1'
当前版本0.0.1.png

2. 轮播基本原理

使用三个imageView添加到ScrollView,始终保持中间的imageView在可视界面里。当前的imageView滚动到下一个imageView,然后把下一个imageView滚动到三个imageView的中心位置,在这过程中赋值的时候是三个imageView同时赋值,滚动的时候找到最中间的imageView,把这个imageView的tag值设置为当前的索引,滚动完成后把这个imageView设置为中心滚动位置。

比如三张图A、B、C。要做的scrollview实际上应该是五张的大小顺序是C、A、B、C、A。初始偏移量设置到第二张,监听scrollview滑动事件。判断偏移量。当偏移量在第一张时将偏移量修改到第四张,当偏移量在第五张时将偏移量调整到第二章。这样在循环时比较流畅,才能无缝无限循环滚动

JYCarouselAnimation.gif

3. 轮播的特性

4. 代码文件结构和功能

JYCarousel

JYCarouselStruct.png

5. 轮播组件的使用

提供两个初始化方法:

/**
 block方式回调初始化
 @param frame       frame
 @param configBlock 轮播属性配置
 @param clickBlock  点击回调
 @return carousel
 */
- (instancetype)initWithFrame:(CGRect)frame
                  configBlock:(CarouselConfigurationBlock)configBlock
                   clickBlock:(CarouselClickBlock)clickBlock;


/**
 delegate方式回调初始化
 @param frame       frame
 @param configBlock 轮播属性配置
 @param target      delegate
 @return carousel
 */
- (instancetype)initWithFrame:(CGRect)frame
                  configBlock:(CarouselConfigurationBlock)configBlock
                       target:(id<JYCarouselDelegate>)target;

使用举例:

1.block回调方式创建:
- (void)addCarouselView1{
    __weak typeof(self) weakSelf = self;
    //图片数组(或者图片URL,图片URL字符串,图片UIImage对象)
    NSMutableArray *imageArray = [[NSMutableArray alloc] initWithArray: @[@"1.jpg",@"2.jpg",@"3.jpg",@"4.jpg"]];
   JYCarousel *carouselView = [[JYCarousel alloc] initWithFrame:CGRectMake(0, 64, ViewWidth(self.view), 100) configBlock:^JYConfiguration *(JYConfiguration *carouselConfig) {          
         //配置指示器类型
        carouselConfig.pageContollType = LabelPageControl;
        //配置轮播时间间隔
        carouselConfig.interValTime = 3;
        //配置轮播翻页动画
        carouselConfig.pushAnimationType = PushCube;
        //配置动画方向
        carouselConfig.animationSubtype = kCATransitionFromRight;
        return carouselConfig;
    } clickBlock:^(NSInteger index) {
          //点击imageView回调方法
        [weakSelf clickIndex:index];
    }];
    //开始轮播
    [carouselView startCarouselWithArray:imageArray];
    [self.view addSubview:carouselView];
}
2.delegate回调方式创建:
//遵循协议
@interface SubViewController ()<JYCarouselDelegate>

//创建
- (void)addCarouselView{
    NSMutableArray *imageArray = [[NSMutableArray alloc] initWithArray: @[@"1.jpg",@"2.jpg",@"3.jpg",@"4.jpg"]];
    
    JYCarousel *carouselView = [[JYCarousel alloc] initWithFrame:CGRectMake(0, 540, ViewWidth(self.view), 100) configBlock:^JYConfiguration *(JYConfiguration *carouselConfig) {
        carouselConfig.pageContollType = LeftPageControl;
        carouselConfig.interValTime = 3.0;
        carouselConfig.pushAnimationType = PushCameraIrisHollowOpen;
        carouselConfig.backViewImage = [UIImage imageNamed:@"default"];
        return carouselConfig;
    } target:self];
    
    //开始轮播
    [carouselView startCarouselWithArray:imageArray];
    [self.view addSubview:carouselView];
}

//回调方法
- (void)carouselViewClick:(NSInteger)index{
    NSLog(@"代理方式你点击图片索引index = %ld",index);
    //清楚缓存数据 可以在app启动的时候清楚上一次轮播缓存,根据自己需要
    [[JYImageCache sharedImageCache] jy_clearDiskCaches];
}

6. 注意事项

内存得不到释放造成内存泄露,使用循环引用了。请注意使用。看下面在block回调处,对Self是使用弱引用的,不然内存是得不到释放的。
<pre>
// 请使用weakSelf,不然内存得不到释放
__weak typeof(self) weakSelf = self;
//图片数组(或者图片URL,图片URL字符串,图片UIImage对象)
NSMutableArray *imageArray = [[NSMutableArray alloc] initWithArray: @[@1.jpg,@2.jpg,@3.jpg,@4.jpg]];
JYCarousel *carouselView = [[JYCarousel alloc] initWithFrame:CGRectMake(0, 64, ViewWidth(self.view), 100) configBlock:nil clickBlock:NSInteger index {
//点击imageView回调方法
[weakSelf clickIndex:index];
}];
//开始轮播
[carouselView startCarouselWithArray:imageArray];
[self.view addSubview:carouselView];
</pre>

7. 下个版本预告

喜欢就给个Star吧!

上一篇下一篇

猜你喜欢

热点阅读