如何在集合视图中下载图像并使用Swift中的Alamofireimage将图像高度保持在单元格中?

时间:2016-04-07 16:49:32

标签: swift uicollectionview alamofire alamofireimage

我想使用 Alamofire 下载图片并刷新我的collectionView以查看具有正确高度尺寸的图片。像foursquare画廊一样:

我的课程是:

//
//  ViewController.swift
//  ImageList
//
//  Created by Dasoga on 4/7/16.
//  Copyright © 2016 Dasoga. All rights reserved.
//

import UIKit
import Alamofire
import AlamofireImage


class ViewController: UIViewController, UICollectionViewDelegate,     UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {

@IBOutlet var myCollectionView: UICollectionView!

var images:[UIImage] = []
var imagesURL:[String] = ["http://www.apple.com/mx/ipod/home/images/social/og.jpg?201601060706", "http://images.apple.com/home/images/og.jpg?201604012321","http://www.impactony.com/wp-content/uploads/2014/08/Apple-logo1.jpg","http://store.storeimages.cdn-apple.com/4973/as-images.apple.com/is/image/AppleInc/aos/published/images/i/ph/iphone6s/plus/iphone6s-plus-box-gray-2015_GEO_US?wid=478&hei=595&fmt=jpeg&qlt=95&op_sharpen=0&resMode=bicub&op_usm=0.5,0.5,0,0&iccEmbed=0&layer=comp&.v=PS8m10"]
var ImageCache = [String:UIImage]()

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

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

func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return imagesURL.count
}

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
    let cell = myCollectionView.dequeueReusableCellWithReuseIdentifier("myCell", forIndexPath: indexPath) as! ImageCollectionViewCell
    cell.backgroundColor = UIColor.blueColor()
    cell.imageViewCell.image = UIImage(named: "placeholderImage")
    cell.imageViewCell.contentMode = UIViewContentMode.ScaleToFill
    //Download image
    let dishName = imagesURL[indexPath.row]
    if let dishImage = ImageCache[dishName] {
        cell.imageViewCell.image = dishImage
    }
    else {
        let url = imagesURL[indexPath.row]
        Alamofire.request(.GET, url)
            .responseImage { response in
                //debugPrint(response)
                debugPrint(response.result)

                if let image = response.result.value {
                    print("image downloaded: \(image)")

                    // Store the commit date in to our cache
                    self.ImageCache[dishName] = image

                    // Update the cell
                    dispatch_async(dispatch_get_main_queue(), {
                        if let cellToUpdate = self.myCollectionView.cellForItemAtIndexPath(indexPath) as? ImageCollectionViewCell{
                            cellToUpdate.imageViewCell.image = image
                            self.images.append(image)
                        }
                    })

                }else{
                    print("error getting image at cell")
                }
        }
    }
    return cell
}

}

foursquare的例子:

enter image description here enter image description here

我得到了这个:

enter image description here

谢谢!

已编辑:

我添加了这一行:

  self.myCollectionView.collectionViewLayout.invalidateLayout()

后:

  // Update the cell
   dispatch_async(dispatch_get_main_queue(), {
                        if let cellToUpdate = self.myCollectionView.cellForItemAtIndexPath(indexPath) as? ImageCollectionViewCell{
                            cellToUpdate.imageViewCell.image = image
                            self.images.append(image)
                            self.myCollectionView.collectionViewLayout.invalidateLayout()
                        }
                    })

并调用此方法:

    func collectionView(collectionView: UICollectionView,layout collectionViewLayout: UICollectionViewLayout,
                    sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize{
    let dishName = imagesURL[indexPath.row]
    if let dishImage = ImageCache[dishName] {
        print("found image")
        return CGSizeMake(dishImage.size.width,dishImage.size.height)
    }else{
        return CGSizeMake(200,200)
    }

}

1 个答案:

答案 0 :(得分:0)

尝试实现UICollectionViewDelegateFlowLayout协议,该协议用于自定义单元格的大小,并使用此功能:

func collectionView(collectionView: UICollectionView,layout collectionViewLayout: UICollectionViewLayout,
          sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize{
    let dishName = imagesURL[indexPath.row]
        if let dishImage = ImageCache[dishName] {
            return CGSizeMake(dishImage.frame.width,dishImage.frame.height)
        }

    }

此代码将单元格的宽度和高度设置为图像的宽度和高度,如果要使用不同的宽度,则需要更改CGSizeMake对象的宽度。