UICollectionViewを用いて画像を表示させていたのですが、スクロールすると以前の画像と重なって表示されるという事態に陥りました。
少しだけハマったけれどあまり時間もかからずに解決したのでよかったです。
原因としてはセルを再利用するときに再利用前の画像がそのまま表示されてしまっている、ということ。
addSubviewをするとデータが蓄積される
まず、collectionView:cellForItemAtIndexPath:のメソッド内でセルをカスタマイズします。セルを再利用するよ〜と宣言しておきます。
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCellWithReuseIdentifier("cell",forIndexPath:indexPath)
//ここでセルをカスタマイズ
return cell
}
そもそもここでセルをカスタマイズするのがあまりよろしくないらしいが、とりあえずそれは置いといて。
このセルの上にImageViewを配置してそこに画像を表示させます。
let imageView = UIImageView()
let img = UIImage(named:"image.jpg")! as UIImage
imageView.frame = CGRectMake(0,0,100,100)
imageView.image = img
cell.contentView.addSubview(imageView)
こんな感じ。
addSubviewをするときにcellに直接addSubviewもできますが、contentViewを挟んだほうが良いらしい。
そしてこのaddSubviewしたものはどんどん蓄積されていきます。二重に表示されるどころか、メモリ効率も悪くなってしまいます。
解決方法
addSubviewをする前にcellのsubviewを削除しておきます。
for subview in cell.contentView.subviews{
subview.removeFromSuperview()
}
これをaddSubviewの前に書いておきます。そうすることでsubviewの中身を初期化しておくことができます。
ラベルとかも色々そこで書いていたのでとにかくカオスな状況になっていたのが解決してよかったです。
メソッド内のコードはこんな感じ。
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCellWithReuseIdentifier("cell",forIndexPath:indexPath)
for subview in cell.contentView.subviews{
subview.removeFromSuperview()
}
//ここでセルをカスタマイズ
let imageView = UIImageView()
let img = UIImage(named:"image.jpg")! as UIImage
imageView.frame = CGRectMake(0,0,100,100)
imageView.image = img
cell.contentView.addSubview(imageView)
return cell
}
参考にしているのがSwiftでもなければUICollectionViewでもないあたりがオモシロイ。笑
あとはデータの削除が終わればUICollectionViewに関してはほぼ完成です。頑張っていこー(´・ω・`)
Comments...
コメント時の注意
「Twitter」「Facebook」「Google+」「WordPress」のいずれかのアカウントをお持ちの方は各アカウントと連携することでコメントできます。 コメントしたことはSNSに流れませんので、アカウントをお持ちの方はこちらの方法でコメントを投稿して下さると嬉しいです。 アカウントをお持ちでない方はメールアドレスで投稿することができます。 初回コメント時は承認後に表示されます。