创建一个无限循环和自动滚动的Swift CollectionView,如Instagram或Apple App Store

时间:2015-08-31 21:30:45

标签: swift uicollectionview instagram autoscroll

我一直在尝试创建一个自动滚动,循环的图像集合视图,类似于您在“搜索”页面上的Instagram应用程序或其精选页面上的Apple App Store应用程序中看到的内容。

我已经能够做其中一个,但如果我进行自动滚动并且用户与图像轮播进行交互,它就会开始在整个地方跳来跳去。

我很感激您对我可能做错了什么或者我可以做些什么来改进我的代码的想法。

我目前有一个mainCollectionView,另一个eventsCollectionView嵌套在maincollectionView的第一个单元格中。这样我可以垂直滚动整个事物,但可以让第一个单元格水平滚动以显示不同的事件。

我发现这个很棒的教程(在Obj-C中)是关于如何使我的集合视图成为无限循环:http://adoptioncurve.net/archives/2013/07/building-a-circular-gallery-with-a-uicollectionview/

我遗漏了cellForItemAtIndexPathsizeForItemAtIndexPath,因为收集视图的设置工作得很好。以下是无限循环的一些相关代码:

var eventImages = ["event1", "event2", "event3", "event4"]
var newEventImages = [String]()

func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    newEventImages = eventImages
    var firstItem = eventImages[0]
    var lastItem = eventImages[self.eventImages.count - 1]
    newEventImages.insert(lastItem, atIndex: 0)
    newEventImages.append(firstItem)

    if collectionView == mainCollectionView {
        return array.count + 2
    } else if collectionView == eventsCollectionView {
        return self.newEventImages.count
    } else {
        return 1
    }

}

func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
    var offsetMultiplier = CGFloat(self.newEventImages.count - 1)
    var contentOffsetWhenFullyScrolledRight = self.eventsCollectionView.frame.size.width * offsetMultiplier

    if (scrollView.contentOffset.x == contentOffsetWhenFullyScrolledRight) {
        var newIndexPath: NSIndexPath = NSIndexPath(forItem: 1, inSection: 0)
        self.eventsCollectionView.scrollToItemAtIndexPath(newIndexPath, atScrollPosition: UICollectionViewScrollPosition.Left, animated: false)
    } else if (scrollView.contentOffset.x == 0) {
        var newIndexPath: NSIndexPath = NSIndexPath(forItem: (self.newEventImages.count - 2), inSection: 0)
        self.eventsCollectionView.scrollToItemAtIndexPath(newIndexPath, atScrollPosition: UICollectionViewScrollPosition.Left, animated: false)
    }
}

// This function is called in ViewDidAppear
func setFirstScrollImage(collection: UICollectionView) {
    var newIndexPath: NSIndexPath = NSIndexPath(forItem: 1, inSection: 0)
    collection.scrollToItemAtIndexPath(newIndexPath, atScrollPosition: UICollectionViewScrollPosition.Left, animated: false)
}

对于自动滚动,我在cellForItemAtIndexPath部分使用延迟:

let delay = 4.0 * Double(NSEC_PER_SEC)
let time = dispatch_time(DISPATCH_TIME_NOW, Int64(delay))
dispatch_after(time, dispatch_get_main_queue()) {
     self.currentEventCell = indexPath.row
     var newIndexPath: NSIndexPath = NSIndexPath(forItem: self.currentEventCell + 1, inSection: 0)
     self.eventsCollectionView.scrollToItemAtIndexPath(newIndexPath, atScrollPosition: UICollectionViewScrollPosition.Left, animated: true)
 }

这两种方法似乎彼此独立工作,但是,当组合时,auotscroll开始跳过单元格并在用户滑动时不稳定地移动。

欢迎所有想法。让我知道你的想法。谢谢。

0 个答案:

没有答案