服务器之家：专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - Swift - 使用Swift实现iOScollectionView广告无限滚动效果(DEMO)

使用Swift实现iOScollectionView广告无限滚动效果(DEMO)

2020-12-30 14:37木子沉雨 Swift

本文给大家分享使用Swift实现iOScollectionView广告无限滚动效果(DEMO)，非常不错，具有一定的参考借鉴价值，感兴趣的朋友一起看看吧

今天公司里的实习生跑过来问我一般App上广告的无限滚动是怎么实现的,刚好很久没写博客了,就决定写下了,尽量帮助那些处于刚学iOS的程序猿.

做一个小demo,大概实现效果如下图所示:

使用Swift实现iOScollectionView广告无限滚动效果(DEMO)

基本实现思路:

1. 在你需要放置无限滚动展示数据的地方把他的数据,在原本的基础上把你要展示的数据扩大三倍.(当然扩大两倍也是可以的,三倍的话,比较好演示)

?
1
2
3
4
5
// MARK: - 设置数据源
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
// print(self.arrayM.count)
return self.arrayM.count * 3
}

2.当在定时器的作用下,或者在拖动情况存下滚动到第八个时候,设置此时的collectionView.contentOffset.x等于滚动到第三个cell的contentOffset.x

使用Swift实现iOScollectionView广告无限滚动效果(DEMO)

?
1
2
3
if collectionView.contentOffset.x == CGFloat(3 * self.arrayM.count - 1) * self.collectionView.bounds.width {
self.collectionView.contentOffset.x = CGFloat(self.arrayM.count - 1) * self.collectionView.bounds.width
}

3.当拖动到第0个cell时,设置此时的collectionView.contentOffset.x等于第六个cell的contentOffset.x

使用Swift实现iOScollectionView广告无限滚动效果(DEMO)

?
1
2
3
if collectionView.contentOffset.x == 0 {
self.collectionView.contentOffset.x = CGFloat(2 * self.arrayM.count - 1) * self.collectionView.bounds.width
}

代码如下:

我在代码中用到5张照片,所以应该一共有15个cell

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
import UIKit
class ViewController: UIViewController ,UICollectionViewDataSource, UICollectionViewDelegate {
@IBOutlet weak var collectionView: UICollectionView!
var timer : Timer?
var arrayM : [BOModel] = [] {
didSet {
self.collectionView.reloadData()
}
}
static let CellID = "cell"
override func viewDidLoad() {
super.viewDidLoad()
self.collectionView.dataSource = self
self.collectionView.delegate = self
// 加载数据
loadData()
self.collectionView.register(UINib.init(nibName: "BOCollectionViewCell", bundle: nil), forCellWithReuseIdentifier: ViewController.CellID)
//设置collextionView
setupCollectionView()
// 开启定时器
starTimer()
}
/// 从polist中加载数据
func loadData() {
let stemp: NSArray = NSArray(contentsOfFile: Bundle.main.path(forResource: "shops.plist", ofType: nil)!)!
for dict in stemp {
let model = BOModel.init(dict: dict as! [String : Any])
self.arrayM.append(model)
}
}
/// 设置cellection的布局方式
///
/// - Returns: 一个布局类型
func setupCollectionFlowlayout() -> (UICollectionViewFlowLayout) {
let flowLayout = UICollectionViewFlowLayout()
flowLayout.itemSize = self.collectionView.bounds.size
flowLayout.minimumLineSpacing = 0
flowLayout.minimumInteritemSpacing = 0
flowLayout.scrollDirection = .horizontal
flowLayout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0)
return flowLayout
}
/// 设置collectionVIew
func setupCollectionView() -> () {
self.collectionView.collectionViewLayout = self.setupCollectionFlowlayout()
self.collectionView.showsVerticalScrollIndicator = false
self.collectionView.showsHorizontalScrollIndicator = false
self.collectionView.isPagingEnabled = true
}
// MARK: - 设置数据源
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
// print(self.arrayM.count)
return self.arrayM.count * 3
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = self.collectionView.dequeueReusableCell(withReuseIdentifier: ViewController.CellID, for: indexPath) as! BOCollectionViewCell
cell.model = self.arrayM[indexPath.row % self.arrayM.count]
return cell
}
// MARK: - 实现代理方法
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
//contentOffset.x == 0 时,重新设置contentOffset.x的值
if collectionView.contentOffset.x == 0 {
self.collectionView.contentOffset.x = CGFloat(2 * self.arrayM.count - 1) * self.collectionView.bounds.width
}
//当到达最后一个cell时,重新设置contentOffset.x的值
if collectionView.contentOffset.x == CGFloat(3 * self.arrayM.count - 1) * self.collectionView.bounds.width {
self.collectionView.contentOffset.x = CGFloat(self.arrayM.count - 1) * self.collectionView.bounds.width
}
}
/// 开启定时器
func starTimer () {
let timer = Timer.init(timeInterval: 1, target: self, selector: #selector(ViewController.nextPage), userInfo: nil, repeats: true)
// 这一句代码涉及到runloop 和 主线程的知识,则在界面上不能执行其他的UI操作
RunLoop.main.add(timer, forMode: RunLoopMode.commonModes)
self.timer = timer
}
/// 在1秒后,自动跳转到下一页
func nextPage() {
// 如果到达最后一个,则变成第四个
if collectionView.contentOffset.x == CGFloat(3 * self.arrayM.count - 1) * self.collectionView.bounds.width {
self.collectionView.contentOffset.x = CGFloat(self.arrayM.count - 1) * self.collectionView.bounds.width
}else {
// 每过一秒,contentOffset.x增加一个cell的宽度
self.collectionView.contentOffset.x += self.collectionView.bounds.size.width
}
}
/// 当collectionView开始拖动的时候,取消定时器
func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
self.timer?.invalidate()
self.timer = nil
}
/// 当用户停止拖动的时候,开启定时器
func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {
starTimer()
}
}

plist文件如下图所示:

使用Swift实现iOScollectionView广告无限滚动效果(DEMO)

用到的字典转模型因为比较简单的转换,就自己写了个:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import UIKit
class BOCollectionViewCell: UICollectionViewCell {
@IBOutlet weak var imageView: UIImageView!
var model : BOModel? {
didSet {
guard let image = UIImage.init(named: (model?.name)!) else {
return
}
self.imageView.image = image
}
}
override func awakeFromNib() {
super.awakeFromNib()
}
}

自定义collectionViewCell类中的内容:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import UIKit
class BOCollectionViewCell: UICollectionViewCell {
@IBOutlet weak var imageView: UIImageView!
var model : BOModel? {
didSet {
guard let image = UIImage.init(named: (model?.name)!) else {
return
}
self.imageView.image = image
}
}
override func awakeFromNib() {
super.awakeFromNib()
}
}

附: 其实这种方法比较实现无限滚动,利用了一点小技巧,用电脑测试的时候可能有一点缺陷.

以上所述是小编给大家介绍的使用Swift实现iOScollectionView广告无限滚动效果(DEMO)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对服务器之家网站的支持！

原文链接：http://www.cnblogs.com/muzichenyu/p/6071757.html

  • 滚动
  • Swift
  • iOScollectionView

    • 延伸 · 阅读

    精彩推荐
    • SwiftSwift中转义闭包示例详解

      Swift中转义闭包示例详解

      在Swift 中的闭包类似于结构块,并可以在任何地方调用,下面这篇文章主要给大家介绍了关于Swift中转义闭包的相关资料,需要的朋友可以参考下...

      小小小_小朋友11412021-12-26
    • SwiftSwift实现多个TableView侧滑与切换效果

      Swift实现多个TableView侧滑与切换效果

      这篇文章主要为大家详细介绍了Swift实现多个TableView侧滑与切换效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...

      乞力马扎罗的雪雪5822021-01-08
    • SwiftSwift能代替Objective-C吗？

      Swift能代替Objective-C吗？

      这是我在网上上看到的答案，复制粘贴过来和大家分享一下，因为我和很多人一样很关心Swift的出现对Mac开发的影响和对Objective-C的影响。...

      Swift教程网4412020-12-16
    • Swiftswift where与匹配模式的实例详解

      swift where与匹配模式的实例详解

      这篇文章主要介绍了swift where与匹配模式的实例详解的相关资料,这里附有简单的示例代码，讲的比较清楚，需要的朋友可以参考下...

      追到梦的魔术师14382021-01-06
    • SwiftSwift教程之基础数据类型详解

      Swift教程之基础数据类型详解

      这篇文章主要介绍了Swift教程之基础数据类型详解,本文详细讲解了Swift中的基本数据类型和基本语法,例如常量和变量、注释、分号、整数、数值类型转换等...

      Swift教程网5162020-12-18
    • SwiftSwift使用CollectionView实现广告栏滑动效果

      Swift使用CollectionView实现广告栏滑动效果

      这篇文章主要为大家详细介绍了Swift使用CollectionView实现广告栏滑动效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...

      Stevin的技术博客12372021-01-13
    • Swiftmac git xcrun error active developer path 错误

      mac git xcrun error active developer path 错误

      本文主要是讲诉了如何解决在mac下使用git;xcode4.6的环境时，出现了错误（mac git xcrun error active developer path）的解决办法，希望对大家有所帮助...

      Swift教程网2232020-12-16
    • SwiftSwift的74个常用内置函数介绍

      Swift的74个常用内置函数介绍

      这篇文章主要介绍了Swift的74个常用内置函数介绍,这篇文章列举出了所有的Swift库函数,内置函数是指无需引入任何模块即可以直接使用的函数,需要的朋友可...

      Swift教程网5802020-12-19
    最近更新
    编辑推荐
    阅读排行
    热门标签
    UITabBarController 　 方法调度 　 坐标变换 　 异常抛出 　 ThPullRefresh 　 侧滑菜单 　 SWRevealViewController 　 uirefreshcontrol 　 下拉刷新 　 可选链 　 自动引用计数 　 反初始化 　 面相对象编程 　 fallthrough 　 swift入门 　 导航控制器 　 swift语言 　 UIAlertController 　 自动录音器 　 弹簧动画 　 地图坐标 　 手势识别 　 遍历方法 　 类型创建 　 占位 　 可选类型 　 swift 教程 　 初始化方法 　 点击手势 　 swift学习 　
    © 2019-2025 服务器之家(www.zzvips.com) 版权所有关于我们联系我们版权申明网站地图