2016-06-22 15 views
2

私はこの奇妙な問題を持っています。問題、各セルのdoesntの負荷のすぐ

私は「レシピ」と呼ばれるこのクラスを持っており、そこに私は、これらの列を持っています。

  • などの名前(文字列)
  • 画像(ファイル)

これは、そのクラスからレシピをロードするための私のコードです。

override func viewDidLoad() { 
     super.viewDidLoad() 
queryRecipes("") 
} 


func queryRecipes(searchText:String) { 

self.recipesArray.removeAllObjects() 


    let query = PFQuery(className: "Recipes") 
query.orderByDescending("createdAt") 

query.findObjectsInBackgroundWithBlock { (objects, error)-> Void in 
     if error == nil { 
      self.recipesArray = NSMutableArray(array: objects!) 
      // Reload CollView 
      self.recipesCollView.reloadData() 
      self.view.hideHUD() 

      // Hide/show the nothing found Label 
      if self.recipesArray.count == 0 {  self.nothingFoundLabel.hidden = false 
      } else { self.nothingFoundLabel.hidden = true } 

     } else { 
      print(error) 
     } } 


} 

そしてコレクションビューコード

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

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

    var recipesClass = PFObject(className: "Recipes") 
    recipesClass = recipesArray[indexPath.row] as! PFObject 
    cell.titleLabel.text = "\(recipesClass["name"]!)" 

let imageFile = recipesClass["image"] as? PFFile 
cell.coverImage.file = imageFile 
cell.coverImage.loadInBackground(nil) 
    cell.layer.shouldRasterize = true 
    cell.layer.rasterizationScale = UIScreen.mainScreen().scale 

return cell 
} 

と私は

import UIKit 
import ParseUI 

class RecipesCell: UICollectionViewCell { 

    /* Views */ 
    @IBOutlet weak var coverImage: PFImageView! 
    @IBOutlet weak var titleLabel: UILabel! 
} 

、私はこれを設定している画像ビュー内のmain.storyboardから以下のいるセルファイル内クラス。 enter image description here

だから、問題は、私は10枚の画像を持っているということです。 私は特定のビューに移動すると、最初の4つが表示され、電話機で表示されます。 >第一の細胞の画像と、その後第五セルの画像 - 私は次の6個の細胞で詳細を参照するには、下にスクロールするときしかし、それは例えば

第五セルを示しています。 6番目のセル - 他のセルの1つのランダムなイメージが続きます。

が、私はこの反応のいずれかを参照してくださいいけないリフレッシュ。

誰もがなぜこれが起こっているの任意のアイデアを持っています? 私のコードは正当だと思うが、何かが足りない。

お時間をいただきありがとうございます。

PSこれはtableviewでも発生します。

PS2。私もこれを試した。ストーリーボードの中で私は静止画をuiimageに設定しましたが、それでもまだ異なるイメージをロードしてから、正しいイメージをロードします。

答えて

2

細胞は、1つをデキューするとき、それはそれで他のデータと戻ってくる可能性があることを意味し、再利用されている(それはすでにインスタンス化され、今では再利用されます)。だからあなたは基本的にそれを提示する前に "クリーンアップ"を行う必要があります。

同じことは、テキストのために起こるが、それは、サーバーか何かからロードしていないので、あなたは、画面が起こっ上でそれを見ることができません。

は、あなたが何をする必要があるか右この行の前にプレースホルダ画像

cell.coverImage.image = UIImage(named:"placeholder") 

に画像を設定されている:

cell.coverImage.file = imageFile 

私はそれが役に立てば幸い。:)

+0

これは素晴らしいです。私は自分の資産に持っている最初の1つのイメージを表示してから、もう一方のイメージをロードします。私はそのアプリケーションのための適切なUXの設計だと思います。 –

2

すべてがセルが再利用されるために起こります。

1.セルは再利用されるため、再利用する前にセルをクリアするか、デフォルトに設定する必要があります。

2.セルが再利用され、スクロールがサーバーからイメージを取得するより速くなる可能性があります。間違ったセルで間違った完了コールバックが発生する可能性があります。。イメージの読み込みが完了したら、セルにイメージが読み込まれているかどうか、またはその間に再利用されたかどうかを確認する必要があります(これは別のイメージをロードしていることを意味します。

let imageFile = recipesClass["image"] as? PFFile 
cell.coverImage.image = nil // 1. Clearing the cell 
// or as in Abavisg's answer you load the default image instead of nil 
cell.coverImage.file = imageFile 

// This is kind of pseudocode as I'm not familiar with the Parses' API 
cell.coverImage.loadInBackground() { loadedImage in 
    // 2. Here you have to check if the loadedImage is the right image 
    // for the cell 
    if (loadedImage.imageFile == imageFile) { 
    //loadTheImage 
    } else { 
    //skipLoadingTheImage -> The cell was reused 
    } 
} 
関連する問題