Thursday, 18 August 2016

Auto-Zooming the Image and Fit to the screen in UICollectionView - iOS Swift

Click the Image once to Zoom the Image and Fit it to the Screen in UICollectionView . Its the Simple procedure that we have to alter the size of the UIImage when it is Tapped.

You Just need to copy the code and paste it in your program.

//1
var largePhotoIndexPath : NSIndexPath? {
didSet {
  //2
  var indexPaths = [NSIndexPath]()
  if largePhotoIndexPath != nil {
    indexPaths.append(largePhotoIndexPath!)
  }
  if oldValue != nil {
    indexPaths.append(oldValue!)
  }
  //3
      collectionView?.performBatchUpdates({
        self.collectionView?.reloadItemsAtIndexPaths(indexPaths)
        return
        }){
          completed in
          //4
          if self.largePhotoIndexPath != nil {
            self.collectionView?.scrollToItemAtIndexPath(
              self.largePhotoIndexPath!,
              atScrollPosition: .CenteredVertically,
              animated: true)
          }
      }
  }
}

func collectionView(collectionView: UICollectionView,
  layout collectionViewLayout: UICollectionViewLayout,
  sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
 
  let Photo = photoForIndexPath(indexPath)
 
  // New code
  if indexPath == largePhotoIndexPath {
    var size = collectionView.bounds.size
    size.height -= topLayoutGuide.length
    size.height -= (sectionInsets.top + sectionInsets.right)
    size.width -= (sectionInsets.left + sectionInsets.right)
    return Photo.sizeToFillWidthOfSize(size)
  }
  // Previous code
  if var size = Photo.thumbnail?.size {
    size.width += 10
    size.height += 10
    return size
  }
  return CGSize(width: 100, height: 100)
}

extension ViewController : UICollectionViewDelegate {
 
  override func collectionView(collectionView: UICollectionView,
    shouldSelectItemAtIndexPath indexPath: NSIndexPath) -> Bool {
      if largePhotoIndexPath == indexPath {
        largePhotoIndexPath = nil
      }
      else {
        largePhotoIndexPath = indexPath
      }
      return false
  }
}

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
 
  let cell = collectionView.dequeueReusableCellWithReuseIdentifier(
    reuseIdentifier, forIndexPath: indexPath) as! yourCellName
  let Photo = photoForIndexPath(indexPath)
 
  //1
  cell.activityIndicator.stopAnimating()
 
  //2
  if indexPath != largePhotoIndexPath {
    cell.imageView.image = Photo.thumbnail
    return cell
  }
 
  //3
  if Photo.largeImage != nil {
    cell.imageView.image = Photo.largeImage
    return cell
  }
 
  //4
  cell.imageView.image = Photo.thumbnail
  cell.activityIndicator.startAnimating()
 
  //5
  Photo.loadLargeImage {
    loadedPhoto, error in
 
    //6
    cell.activityIndicator.stopAnimating()
 
    //7
    if error != nil {
      return
    }
 
    if loadedPhoto.largeImage == nil {
      return
    }
 
    //8
    if indexPath == self.largePhotoIndexPath {
      if let cell = collectionView.cellForItemAtIndexPath(indexPath) as? yourCellName {
        cell.imageView.image = loadedPhoto.largeImage
      }
    }
  }
 
  return cell
}

Here the Name "Photo" stands for the name of the UIImage and "yourCellName" stands for the name of the UICollectionViewCell.

Outputs:

                 Before Click                                                       After Click

     

No comments: