脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 软件编程 → IOS → iOS实现自动循环播放的banner

iOS实现自动循环播放的banner实例详解

 更新时间：2017年12月26日 08:42:17   作者：ksnowlv  
轮播视图通常也叫Banner，90%以上App都会用到的一个控件，网上有很多开源代码，下面这篇文章主要给大家介绍了关于利用iOS如何实现自动循环播放的banner的相关资料，文中通过示例代码介绍的非常详细，需要的朋友可以参考下。

前言

对于banner轮播图，相信大家都会经常用到。自动循环播放的banner是很常见的UI组件。如何实现呢？下面就来给大家详细介绍下，话不多说了，下面来一起学习学习吧。

1.实现思路

1.横向滚动的banner。

  • UIScrollViw+UIImageView.
  • UICollectionView+UICollectionViewCell.
  • 前者需要自己做重用UIImageView，后者可以直接重用UICollectionViewCell。如果前者没有做重用，多占用内存。

2.自动循环播放banner。

  • 可以使用计时器触发循环播放.
  • 拖动或手动滑动banner时，停止自动循环播放banner。手势停止后，开启自动循环播放banner。

3.特殊banner位的处理。

  • 处于第1个或最后1个时，为保证横向自动滑动效果流畅性，不跳动，需要特殊处理下。
  • 在生成banner时，第1个前面插入最后1个banner。最后1个banner后面插入第1个banner。当滑动到最后1个banner时，重置于第2个banner位。

2.本文采用第二种：UICollectionView+UICollectionViewCell

关键代码实现

2.1生成banner的特殊处理

- (void)setBannerList:(NSArray<KBannerItem *> *)bannerList {
 if (bannerList.count > 1) {
  NSMutableArray *itemList = [NSMutableArray arrayWithArray:bannerList];
  [itemList insertObject:bannerList.lastObject atIndex:0];
  [itemList addObject:bannerList.firstObject];
  _bannerList = itemList;
 }else{
  _bannerList = bannerList;
 }
 if (self.bannerList.count > 1) {
  self.bannerPageControl.numberOfPages = self.bannerList.count - 2;
 }else{
  self.bannerPageControl.numberOfPages = 0;
 }
 self.noBannerImageView.hidden = self.bannerList.count > 0;
 self.bannerPageControl.currentPage = 0;
 [self.collectionView reloadData];
 self.collectionView.contentOffset = CGPointMake(CGRectGetWidth(self.collectionView.frame), 0);
}

2.2 banner自动循环播放触发的事件

- (void)handleBannerChangeEvent:(id)sender {
 if (_bannerPageControl.numberOfPages <= 1) {
  return;
 }
 NSInteger page = _bannerPageControl.currentPage + 1;
 [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:page + 1 inSection:0] atScrollPosition:UICollectionViewScrollPositionRight animated:YES];
}

2.3开启自动播放或关闭自动播放bannner。

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView {
 self.countTimer.isOpen = NO;
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView
     willDecelerate:(BOOL)decelerate {
 self.countTimer.isOpen = YES;
}

2.4.滑动时的特殊处理。

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
 if (_bannerList.count <=1) {
  return;
 }
 CGFloat width = CGRectGetWidth(scrollView.frame);
 NSInteger currentPage = scrollView.contentOffset.x / width;
 if (currentPage == 0) {
  if (scrollView.contentOffset.x < 0) {
   [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:_bannerList.count - 2 inSection:0] atScrollPosition:UICollectionViewScrollPositionRight animated:NO];
   self.bannerPageControl.currentPage = _bannerList.count - 2;
  }else{
   [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:1 inSection:0] atScrollPosition:UICollectionViewScrollPositionRight animated:NO];
   self.bannerPageControl.currentPage = 0;
  }
 }else if (currentPage == _bannerList.count - 1) {
  self.bannerPageControl.currentPage = 0;
  [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:1 inSection:0] atScrollPosition:UICollectionViewScrollPositionRight animated:NO];
 }else{
  self.bannerPageControl.currentPage = currentPage - 1;
 }
}

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。

您可能感兴趣的文章:

相关文章

  • iOS推送增加右侧显示图Service Extension

    iOS推送增加右侧显示图Service Extension

    这篇文章主要为大家介绍了iOS推送增加右侧显示图Service Extension，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2022-10-10
  • IOS客户端接入微信支付

    IOS客户端接入微信支付

    对于一个ios的app，如果有一些虚拟的商品或者服务需要通过在线支付来收费的话，一般有几种主流的选择。如果是通过APP调用支付平台APP的思路的话，一个是调起支付宝客户端，一个则是调起微信支付。本文给大家分享ios客户端接入微信支付，需要的朋友可以参考下
    2015-09-09
  • IOS代码笔记之网络嗅探功能

    IOS代码笔记之网络嗅探功能

    这篇文章主要为大家详细介绍了IOS网络嗅探功能实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2016-07-07
  • ios 流媒体播放器实现流程及FreeStreamer的使用的示例

    ios 流媒体播放器实现流程及FreeStreamer的使用的示例

    本篇文章主要介绍了ios 流媒体播放器实现流程及FreeStreamer的使用的示例代码，非常具有实用价值，需要的朋友可以参考下
    2018-01-01
  • IOS设置按钮为圆角的示例代码

    IOS设置按钮为圆角的示例代码

    这篇文章给大家分享了IOS按钮设置为圆角的方法，按钮的四个角都可随意设置为圆角，对大家开发IOS具有一定的参考借鉴价值。有需要的朋友们可以参考借鉴。
    2016-09-09
  • iOS使用UIScorllView实现两指缩放功能

    iOS使用UIScorllView实现两指缩放功能

    两指缩放功能不仅可以用UIPinchGestureRecognizer手势来实现，还能用UIScorllView来实现，UIScrollView可以轻松的实现最大与最小缩放值，以及滚动的效果，效果非常棒，具体实例代码大家参考下本文吧
    2017-03-03
  • IOS开发之JSON转PLIST实例详解

    IOS开发之JSON转PLIST实例详解

    这篇文章主要介绍了IOS开发之JSON转PLIST实例详解的相关资料,需要的朋友可以参考下
    2016-11-11
  • iOS简单易用的GCD计时器的实现原理

    iOS简单易用的GCD计时器的实现原理

    在日常开发中总会碰到需要计时器的功能，常见的定时器有NSTimer、GCD、CADisplayLink。网上也有很多的教程介绍三者的区别，今天主要讲的是GCD这种方式使用以及封装。感兴趣的小伙伴们可以参考一下
    2018-11-11
  • iOS中的UISlider滑块组件用法总结

    iOS中的UISlider滑块组件用法总结

    不仅是滑动开关,UISlider组件也是常用的进度条制作工具,这里我们就一起来看一下iOS中的UISlider滑块组件用法总结,需要的朋友可以参考下
    2016-06-06
  • iOS13原生端适配攻略(推荐)

    iOS13原生端适配攻略(推荐)

    这篇文章主要介绍了iOS13原生端适配攻略(推荐),现汇总一下iOS 13的各种坑,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2019-10-10

最新评论