使用swift滚动后，在UICollectionView中保留按钮内容

Question

我正在尝试创建一个无限滚动按钮的UICollectionView，并根据对服务器的http请求结果填充按钮的背景。

let reuseIdentifier = "Cell"
let screenSize: CGRect = UIScreen.mainScreen().bounds
let screenWidth = screenSize.width
let screenHeight = screenSize.height

let categoryApiUrl = "url"
let categoryImageField = "field"

class BrowseViewController: UICollectionViewController, UICollectionViewDataSource, UICollectionViewDelegate {

var categoryImgUrl:[String] = []
var buttonList:[UIButton] = []

func setupView(){

    self.title = "Browse"
    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    layout.sectionInset = UIEdgeInsets(top: 20, left: 10, bottom: 10, right: 10)
    layout.itemSize = CGSize(width: screenWidth/2-15, height: screenHeight/3.5)
    collectionView = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
    collectionView!.dataSource = self
    collectionView!.delegate = self
    collectionView!.registerClass(UICollectionViewCell.self, forCellWithReuseIdentifier: reuseIdentifier)
    collectionView!.backgroundColor = UIColor.whiteColor()
    self.view.addSubview(collectionView!)

}

func setupButton(cell: UICollectionViewCell, cellNumber: Int){

    var button   = UIButton.buttonWithType(UIButtonType.System) as UIButton
    button.frame = CGRectMake(0, 0, screenWidth/2-15, screenHeight/3.5)
    button.backgroundColor = UIColor.orangeColor()
    button.setTitle("Category", forState: UIControlState.Normal)
    button.addTarget(self, action: "btnClicked:", forControlEvents: UIControlEvents.TouchUpInside)
    buttonList.append(button)
    cell.addSubview(button)
}

override func viewDidLoad(){
    super.viewDidLoad()
    let url = NSURL(string: categoryApiUrl)
    let request = NSURLRequest(URL: url!)

    NSURLConnection.sendAsynchronousRequest(request, queue: NSOperationQueue.mainQueue()) {(response, dataValue, error) in

        let json = JSON(data: dataValue)

        for(var i = 0; i < json.count; i++){

            self.categoryImgUrl.append(json[i]["CATEGORY_IMAGE"].stringValue)

            let imageUrl = self.categoryImgUrl[i]
            let url = NSURL(string: imageUrl)
            let data = NSData(contentsOfURL: url!)
            let image = UIImage(data: data!)
            self.buttonList[i].setBackgroundImage(image, forState: .Normal)
        }
    }

override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
    //#warning Incomplete method implementation -- Return the number of sections
    return 1
}

override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    //#warning Incomplete method implementation -- Return the number of items in the section
    return 10;
}

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as UICollectionViewCell

    let cellNumber = indexPath.row as Int
    setupButton(cell, cellNumber: cellNumber)
    // Configure the cell
    return cell
}

override func scrollViewDidScroll(scrollView: UIScrollView) {
    let offsetY = scrollView.contentOffset.y
    let contentHeight = scrollView.contentSize.height

    if offsetY > contentHeight - scrollView.frame.size.height {
        numberOfItemsPerSection += 6
        self.collectionView!.reloadData()
    }
}

}

目前，代码能够从服务器提取图像并将其填充为按钮的背景图像。

但是，因为我使这个集合视图可滚动。 当我向下滚动视图然后再向上滚动时，前一个按钮的背景图像消失。

我做了一些研究，但找不到解决方案。 按钮消失的原因是因为IOS仅加载屏幕上可见的单元格。 因此，当我向下滚动然后向上滚动时，先前的单元格被视为“新单元格”。 因此，其中的背景图像现在消失了。

问题：

有没有人知道如何保留以前的按钮，即使我们向下滚动然后向上滚动？ 另外，使用我当前的代码，我将图像添加到http请求内的按钮上，因为http请求始终是最后一次执行完成。 反正有没有改变代码，那么http请求将在单元格加载之前完成？

Answer 1

我建议在界面构建器，子类uicollectionviewcell中创建uicollectionview，向collectionview添加一个动态单元格，将其类更改为子类化的collectionviewcell，在其上放置uibutton，并且每次创建单元格时，都要下载图像。

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as myCollectionViewCell

    let cellNumber = indexPath.row as Int
    //downloadimghere

cell.myButton.setBackgroundImage(downloadedImg, forState: .Normal)
    return cell

}

这将在每次创建单元格时下载图像。 有关详细信息，请查看“延迟图像加载”。 我认为这是解决问题的更好方法。

现在，对于您的代码，首先您没有使用buttonList数组，每次创建单元格时都会创建一个新按钮并将其放在那里，因此您不会重复使用已创建的按钮。 如果你修复了它，它可能会像你想要的那样工作。

这是另一个问题，因为collectionview正在重复使用单元格，每次创建一个按钮并将其放在单元格上时，它就会停留在那里，所以基本上现在你在按钮上创建按钮。 因此，如果您希望它正常工作并且单元格上只有一个按钮，则需要在创建它之前从单元格中删除前一个按钮，您可以在cellForItemAtIndexPath中执行此操作。

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as myCollectionViewCell

    //something like this
    for view in cell.subviews(){
        if view == <UIButton>{
            view.removeFromSuperview()
        }
    }
    return cell
}

我的代码中可能存在一些语法错误，我没有测试它，但你知道如何做到这一点。