美文网首页iOSiOS开发优秀iOS开发集锦
简单实现下拉图片放大③ - 定时器轮播图

简单实现下拉图片放大③ - 定时器轮播图

作者: 马铃薯蜀黍 | 来源:发表于2016-09-07 11:33 被阅读889次
QQ20160908-2.png
  • 因为项目还在更改,需求还没定下来所以有时间做点小小的研究 ..

github下载地址点我

  • 言归正传看下效果 :
Untitled3.gif

细节包括 :

  • 拖动停止定时器
  • 全屏拖动pop返回
  • 无限轮播 无卡顿
  • 上滑渐变图片消失
  • 上滑渐变出现导航栏 (自定义导航栏)
  • 状态栏随图片渐变的颜色改变
  • 下拉放大
  • 层级机构图


    QQ20160907-0.png
  • viewController.m获取数据
//创建图片地址字符串数组即可! 检查自己的是否支持HTTPS网络请求
- (void)loadDataFromNet {
    _urls = @[@"http://imgsrc.baidu.com/baike/pic/item/a6efce1b9d16fdfa241bf189b68f8c5494ee7b65.jpg",
              @"http://pic2016.5442.com:82/2016/0811/26/1.jpg%21960.jpg",
              @"http://imgsrc.baidu.com/forum/pic/item/5bb5c9ea15ce36d3da6bfdb93af33a87e850b1cf.jpg",
              @"http://image.tianjimedia.com/uploadImages/2012/178/K830IZAG0Q20.jpg"];
}

注意:地址是百度的高清图地址 .. 可能比较大

.

  • collectionView (轮播图).m文件
    初始化接收数据,并自定义flowlayout
- (instancetype)initWithUrls:(NSArray <NSURL *> *)urls
{
    self = [super initWithFrame:CGRectZero collectionViewLayout:[[YSFlowLayout alloc] init]];
    if (self) {
        _urls = urls;
        self.delegate = self;
        self.dataSource = self;
        [self registerClass:[YSCollectionViewCell class] forCellWithReuseIdentifier:YSCollectionViewCellId];
        dispatch_async(dispatch_get_main_queue(), ^{
            NSIndexPath * path = [NSIndexPath indexPathForItem:_urls.count * 10 inSection:0];
            [self scrollToItemAtIndexPath:path atScrollPosition:0 animated:NO];
        });
        [self addTimer];

        [[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(tingzhi) name:@"tingzhi" object:nil];
        [[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(jixu) name:@"jixu" object:nil];
    }
    return self;
}
  • flowlayout(布局item)
    .m文件
- (void)prepareLayout {
//    NSLog(@"%@",self.collectionView);
    self.minimumLineSpacing = 0;
    self.minimumInteritemSpacing = 0;
    self.itemSize = self.collectionView.bounds.size;
    self.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    
    self.collectionView.showsVerticalScrollIndicator = 0;
    self.collectionView.showsHorizontalScrollIndicator = 0;
    self.collectionView.pagingEnabled = YES;
    self.collectionView.bounces = NO;
    
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(bigBig:) name:@"zys" object:nil];
}

注意点是 layout中有collectionView属性,并且是有大小的 !

  • collectionViewCell.m
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    
    if (self) {
        _imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 200)];
        _imageView.contentMode = UIViewContentModeScaleAspectFill;
        _imageView.layer.masksToBounds = YES;
        [self.contentView addSubview:_imageView];
    }
    return self;
}
  • collecView中的定时器
- (void)addTimer {
    _timer = [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(nextPage) userInfo:nil repeats:YES];
    [[NSRunLoop mainRunLoop] addTimer:_timer forMode:NSRunLoopCommonModes];
}
- (void)nextPage {
    NSUInteger page = _scrollV.contentOffset.x / self.hm_width + 1;
    NSLog(@"%zd",page);
    NSIndexPath * path = [NSIndexPath indexPathForItem:page  inSection:0];
    [self scrollToItemAtIndexPath:path atScrollPosition:0 animated:YES];
    
}



  • 内容 :

    • 轮播图拖动定时器停止滚动
    • 停止拖动添加定时器继续滚动
// zhu yi  yi chu  tong  zhi ..  !移!除!
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView {
    [[NSNotificationCenter defaultCenter]postNotificationName:@"tingzhi" object:nil userInfo:nil];
}

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
    [[NSNotificationCenter defaultCenter]postNotificationName:@"jixu" object:nil userInfo:nil];
}
接收通知做调整.png
//移除定时器
- (void)tingzhi {
    [_timer invalidate];
    _timer = nil;
}
//添加定时器继续
- (void)jixu {
    [self addTimer];
}
  • 原理:在scrollViewWillBeginDraggingscrollViewDidEndDragging代理方法里加通知中心
  • 注册通知并接收通知即可

任何其他问题,欢迎留言,愿与你一起学习
邮箱:zh_yes@foxmail.com

相关文章

网友评论

  • wjiuxing:下拉是放大了,松手之后图片跳动好多次啊。。。
    马铃薯蜀黍:@wjiuxing 等我这两天改改
    现在的执着:你好,想问一下这个问题解决了吗
  • Raindew:很不错。
    马铃薯蜀黍:@Raindew 😬
  • Casablanca1Q84S:我发现在ios 8 下拉放大的时候,会崩溃。是因为YSFlowLayout 这个被销毁了。在10上面是没事的,但是在cell 的接收通知的方法里面没事。我的解决办法是把layout 的调整大小的方法,放到cell 里面去了。代码去下
    - (void)bigBig:(NSNotification*)info {
    NSDictionary * dict = (NSDictionary *)info.userInfo;
    NSString * dic = dict[@"offset"];
    CGFloat off = dic.floatValue;
    _imageView.size = CGSizeMake(SCREEN_W, kHeaderHeight - off- 1);

    YSCollectionView *collectionView = (YSCollectionView *) self.superview;
    YSFlowLayout *layout = (YSFlowLayout *)collectionView.collectionViewLayout;
    CGSize size = layout.itemSize;
    size.height = kHeaderHeight - off ;
    layout.itemSize = size;
    }
  • 377986ae35d5:用不了网络图片吗
    马铃薯蜀黍:@111啊啊啊 是我的那个demo? 不会啊 , 刚刚试过 ... 是能下拉放大没问题的 .. 不好意思 点错了 把刚刚的评论删除了 :sweat:
    马铃薯蜀黍:@111啊啊啊 修改了一下 1.用sdwebimage加载网络图片是可以用的,
    2.设置了一下支持http的网络请求 3.更新了一份改的可以下载用一些 :smile:
    马铃薯蜀黍:@111啊啊啊 稍等哈 .. 我测试看看 ..
  • 清無:你这英语。。。 :sweat:
    马铃薯蜀黍:@菲拉兔 😄
  • VanChan:不错哦
    马铃薯蜀黍:@VanChan 😁

本文标题:简单实现下拉图片放大③ - 定时器轮播图

本文链接:https://www.haomeiwen.com/subject/audjettx.html