如何减少带有大量项目的UICollectionView上的内存使用？

时间：2018-08-17 17:28:32

标签： ios swift uicollectionview

我正在尝试使用UICollectionView而不是UITableView来显示大量项目（> 15000），并且似乎UICollectionView为集合所需的整个contentView大小预分配了像素缓冲区。根据项目的大小，模拟器最多显示所需的6.75GB内存。

基于基于UITableView的协议，我希望收集视图不会分配任何像素缓冲区，而仅依靠单元格的支持/渲染。

我正在使用情节提要文件来定义集合视图和单元格，两者均具有Opaque = false。我看过许多有关Stack Overflow的文章，其中大部分与内存泄漏有关，因此我对如何解决该问题有些困惑。

出于好奇，这里是整个代码库（故事板除外）：

MyCollectionViewCell.swift 

import UIKit    
class MyCollectionViewCell: UICollectionViewCell {
    static let identifier = "myCellIdentifier"
}

UIColor + Random.swift 

import UIKit
extension UIColor {
    static func randomColor() -> UIColor {
        let red = CGFloat(drand48())
        let green = CGFloat(drand48())
        let blue = CGFloat(drand48())
        return UIColor(red: red, green: green, blue: blue, alpha: 1.0)
    }
}

ViewController.swift 

import UIKit
class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {

    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return 10000
    }

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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: MyCollectionViewCell.identifier, for: indexPath) as! MyCollectionViewCell
        cell.backgroundColor = UIColor.randomColor()
        return cell
    }


    @IBOutlet weak var collectionView: UICollectionView!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }
}

Storyboard

在某些使用情况下的内存使用情况： Number of sections greatly affecting memory usage

1 个答案:

答案 0 :(得分：1)

UICollectionView适合于管理数量有限的部分。使用大量的节和项总是会导致使用大量内存，因为UIKit试图跟踪节中每个元素的位置以适当缩放contentView。

相反，创建一个自定义UICollectionViewLayout来管理大量项目之间的关系，在这些项目中应放置这些项目并与UICollectionViewDataSource进行协调，以将相对较小的项目集作为“窗口”映射到更大的项目集。

例如，假设UICollectionView项目是关于100x100的问题； UIKit将一次在屏幕上渲染大约80〜100。假设UICollectionView在用户滚动时在所有侧面都缓存了一些条目，那么在“缓存”中有1024个项目可以轮流浏览就足够了。 UICollectionView完全可以管理1个具有1024个项目的部分。

接下来，使用自定义UICollectionViewLayout定义一个自定义的contentViewSize，其大小足以容纳所有项目。 UICollectionView将通过layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]?

询问布局在可见矩形内的布局

确保每次查询集合视图时都返回一组新的项目。使用1024个项目缓存，以屏幕上显示的第一个元素的项目索引0开始，以1表示第二个元素，以2表示第3个元素，依此类推。每次将布局中的坐标与项目索引相关联时，与UICollectionViewDataSource进行协调，以通知数据有关应该与相关索引相关联的真实部分/项目的来源。

首先，让我们定义一个协议和数据源，以将大型数据源的真实大小映射到合理的UICollectionView可以处理的事情。

LargeDataSourceCoordinator.swift：

import UIKit

protocol LargeDataSourceProtocol {
    func largeNumberOfSections() -> Int
    func largeNumberOfItems(in section: Int) -> Int
    func largeNumberToCollectionViewCacheSize() -> Int
    func associateLargeIndexPath(_ largeIndexPath: IndexPath) -> IndexPath
}

class LargeDataSourceCoordinator: NSObject, UICollectionViewDataSource, LargeDataSourceProtocol {

    var cachedMapEntries: [IndexPath: IndexPath] = [:]
    var rotatingCacheIndex: Int = 0

    func largeNumberToCollectionViewCacheSize() -> Int {
        return 1024 // arbitrary number, increase if rendering issues are visible like cells not appearing when scrolling
    }

    func largeNumberOfSections() -> Int {
        // To do: implement logic to find the number of sections
        return 10000 // simplified arbitrary number for sake of demo
    }

    func largeNumberOfItems(in section: Int) -> Int {
        // To do: implement logic to find the number of items in each section
        return 30000  // simplified arbitrary number for sake of demo
    }

    func associateLargeIndexPath(_ largeIndexPath: IndexPath) -> IndexPath {
        for existingPath in cachedMapEntries where existingPath.value == largeIndexPath {
            return existingPath.key
        }
        let collectionViewIndexPath = IndexPath(item: rotatingCacheIndex, section: 0)
        cachedMapEntries[collectionViewIndexPath] = largeIndexPath
        rotatingCacheIndex = (rotatingCacheIndex + 1) % self.largeNumberToCollectionViewCacheSize()
        return collectionViewIndexPath
    }

    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return 1
    }

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return self.largeNumberToCollectionViewCacheSize()
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = MyCollectionViewCell.dequeue(from: collectionView, for: indexPath)
        guard let largeIndexPath = cachedMapEntries[indexPath] else { return cell }

        // retrieve the data at largeIndexPath.section, largeIndexPath.item
        // configure cell accordingly
        cell.addDebugText("section: \(largeIndexPath.section)\nitem: \(largeIndexPath.item)")
        return cell
    }
}

接下来，让我们创建UICollectionViewLayout来帮助定位和协调数据源。为简单起见，单元格使用固定大小为100x100的单元格，每节紧随其后显示，每个单元格紧紧排在每行的左侧。

LargeDataSourceLayout.swift：

import UIKit

class LargeDataSourceLayout: UICollectionViewLayout {

    let cellSize = CGSize(width: 100, height: 100)

    var cellsPerRow: CGFloat {
        guard let collectionView = self.collectionView else { return 1.0 }
        return (collectionView.frame.size.width / cellSize.width).rounded(.towardZero)
    }

    var cacheNumberOfItems: [Int] = []
    private func refreshNumberOfItemsCache() {
        guard
            let largeDataSource = self.collectionView?.dataSource as? LargeDataSourceProtocol
            else { return }
        cacheNumberOfItems.removeAll()
        for section in 0 ..< largeDataSource.largeNumberOfSections() {
            let itemsInSection: Int = largeDataSource.largeNumberOfItems(in: section)
            cacheNumberOfItems.append(itemsInSection)
        }
    }

    var cacheRowsPerSection: [Int] = []
    private func refreshRowsPerSection() {
        let itemsPerRow = Float(self.cellsPerRow)
        cacheRowsPerSection.removeAll()
        for section in 0 ..< cacheNumberOfItems.count {
            let numberOfItems = Float(cacheNumberOfItems[section])
            let numberOfRows = (numberOfItems / itemsPerRow).rounded(.awayFromZero)
            cacheRowsPerSection.append(Int(numberOfRows))
        }
    }

    override var collectionViewContentSize: CGSize {
        // To do: update logic as per your requirements
        refreshNumberOfItemsCache()
        refreshRowsPerSection()
        let totalRows = cacheRowsPerSection.reduce(0, +)
        return CGSize(width: self.cellsPerRow * cellSize.width,
                      height: CGFloat(totalRows) * cellSize.height)
    }

    override func layoutAttributesForItem(at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? {
        // To do: implement logic to compute the attributes for a specific item
        return nil
    }

    private func originForRow(_ row: Int) -> CGFloat {
        return CGFloat(row) * cellSize.height
    }

    private func pathsInRow(_ row: Int) -> [IndexPath] {
        let itemsPerRow = Int(self.cellsPerRow)
        var subRowIndex = row
        for section in 0 ..< cacheRowsPerSection.count {
            let rowsInSection = cacheRowsPerSection[section]
            if subRowIndex < rowsInSection {
                let firstItem = subRowIndex * itemsPerRow
                let lastItem = min(cacheNumberOfItems[section],firstItem+itemsPerRow) - 1
                var paths: [IndexPath] = []
                for item in firstItem ... lastItem {
                    paths.append(IndexPath(item: item, section: section))
                }
                return paths
            } else {
                guard rowsInSection <= subRowIndex else { return [] }
                subRowIndex -= rowsInSection
            }
        }
        // if caches are properly updated, we should never reach here
        return []
    }

    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        guard let largeDataSource = self.collectionView?.dataSource as? LargeDataSourceProtocol else { return nil }

        let firstRow = max(0,Int((rect.minY / cellSize.height).rounded(.towardZero)))
        var row = firstRow
        var attributes: [UICollectionViewLayoutAttributes] = []
        repeat {
            let originY = originForRow(row)
            if originY > rect.maxY {
                return attributes
            }

            var originX: CGFloat = 0.0
            for largeIndexPath in pathsInRow(row) {
                let indexPath = largeDataSource.associateLargeIndexPath(largeIndexPath)
                let itemAttribute = UICollectionViewLayoutAttributes(forCellWith: indexPath)
                itemAttribute.frame = CGRect(x: originX, y: originY, width: cellSize.width, height: cellSize.height)
                attributes.append(itemAttribute)
                originX += cellSize.width
            }

            row += 1
        } while true
    }
}

那里发生了一些事情，并且有很多根据用例进行优化的空间，但是这里有概念。为了完整起见，下面是相关的代码和应用预览。

MyCollectionViewCell.swift：

import UIKit

class MyCollectionViewCell: UICollectionViewCell {

    static let identifier = "MyCollectionViewCell"

    static func dequeue(from collectionView: UICollectionView, for indexPath: IndexPath) -> MyCollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: identifier, for: indexPath) as? MyCollectionViewCell ?? MyCollectionViewCell()
        cell.contentView.backgroundColor = UIColor.random()
        return cell
    }

    override func prepareForReuse() {
        super.prepareForReuse()
        removeDebugLabel()
    }

    private func removeDebugLabel() {
        self.contentView.subviews.first?.removeFromSuperview()
    }

    func addDebugText(_ text: String) {
        removeDebugLabel()
        let debugLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
        debugLabel.text = text
        debugLabel.numberOfLines = 2
        debugLabel.font = UIFont.systemFont(ofSize: UIFont.smallSystemFontSize)
        debugLabel.textColor = UIColor.black
        debugLabel.textAlignment = .center
        self.contentView.addSubview(debugLabel)
    }
}

UIColor + random.swift：

import UIKit

extension UIColor {
    static func random() -> UIColor {
        //random color
        let hue = CGFloat(arc4random() % 256) / 256.0
        let saturation = (CGFloat(arc4random() % 128) / 256.0) + 0.5 // 0.5 to 1.0, away from white
        let brightness = (CGFloat(arc4random() % 128) / 256.0 ) + 0.5 // 0.5 to 1.0, away from black
        return UIColor(hue: hue, saturation: saturation, brightness: brightness, alpha: 1.0)
    }
}

iPhone simulator screenshot memory requirements

相关问题
最新问题