仿iOS系统相册浏览样式

最新推荐文章于 2021-06-16 18:27:36 发布

原创

最新推荐文章于 2021-06-16 18:27:36 发布 · 3.8k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#swift #相册 #两个collectionView联动

本文介绍如何使用Swift实现一个类似iOS系统相册的浏览样式，包括两个UICollectionView的联动滚动，左右滑动及上下同步的效果。通过自定义TopCollectionView和BottomCollectionView类，实现了水平滚动和页面切换选中效果，同时详细展示了代码实现过程。

一、效果

如图所示，可以左右滑动，上下联动效果

二、代码

1.TopCollectionView

class TopCollectionView: UICollectionView ,UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout,UIScrollViewDelegate{

private var myContext = 0

//这个是控制何时发送通知的

var isManul:Bool = true

var currentIndex:NSInteger = 0{

didSet{

if self.isManul==true {

NotificationPost(CURRENTINDEX_TOP, currentIndex as AnyObject, userinfo: nil)

}

var date:NSArray = [1,2,3,4,5,6,7,8,9,1,2,3,4,5,6,7,8,9,1,2,3,4,5,6,7,8,9,1,2,3,4,5,6,7,8,9]

convenience init() {

let flowLayOut = UICollectionViewFlowLayout.init()

flowLayOut.scrollDirection = .horizontal

flowLayOut.minimumLineSpacing = 0

self.init(frame: CGRect.zero, collectionViewLayout: flowLayOut)

}

private override init(frame: CGRect, collectionViewLayout layout: UICollectionViewLayout) {

super.init(frame: frame, collectionViewLayout: layout)

self.delegate = self

self.dataSource = self

self.backgroundColor = ColorClear

self.layer.cornerRadius = AdWidth(10)

self.clipsToBounds = true

self.isPagingEnabled = true

self.register(PictureCollectionCell.self, forCellWithReuseIdentifier: "PictureCollectionCell")

NotificationRegister(CURRENTINDEX_BOTTOM, observer: self, selector: #selector(itemScroll(noti:)), object: nil)

}

required init?(coder aDecoder: NSCoder) {

fatalError("init(coder:) has not been implemented")

}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

return date.count

}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

let cell:PictureCollectionCell = collectionView.dequeueReusableCell(withReuseIdentifier: "PictureCollectionCell", for: indexPath) as! PictureCollectionCell

cell.setdateWithModel(currentIndex: indexPath.row)

return cell

}

&nbs