UICollectionViewのcellに、imageが拡大表示されてしまいます。

Question

前提・実現したいこと

UICollectionViewのcellに、imageが拡大表示されてしまいます。
CollectionViewは、横スクロールでページングさせています。
ページングは問題なく出来ているのですが、cellの中が拡大表示に
なってしまっています。原因がわかりません。

該当のソースコード

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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath as IndexPath) as? viewCell else { return UICollectionViewCell() }
        
        for subview in cell.contentView.subviews{
            subview.removeFromSuperview()
        }
        
        cell.imageView.image = imageArray[indexPath.row]
        cell.imageView.contentMode = .scaleAspectFit
        cell.imageView.clipsToBounds = true
        cell.contentView.addSubview(cell.imageView)
       
        return cell
        
    }
----------------------------------------------------------------------------
cellのコード

import UIKit

class viewCell: UICollectionViewCell {
    
    @IBOutlet weak var imageView: UIImageView!
    
}

試したこと

どの様に修正したら良いのでしょうか？
ご指導、よろしくお願いいたします。

補足情報（FW/ツールのバージョンなど）

xcode Version 10.1

Answer 1

UIImageViewのレイアウト設定が足りてないだけだと思います。

自分ならこんなかんじですが、これで動きますか？

// generateCell
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath as IndexPath) as! ViewCell
    let image: UIImage = imageArray[indexPath.row]
    cell.setImage(image)
    return cell
}

// CollectionViewCell

class ViewCell: UICollectionViewCell {

    // レイアウトはInterfaceBuilder上で設定する
    @IBOutlet weak var imageView: UIImageView!

    override func awakeFromNib() {
        super.awakeFromNib()
        imageView.contentMode = .scaleAspectFit
        imageView.clipsToBounds = true
    }

    func setImage(_ image: UIImage) {
        imageView.image = Image
    }

}

コードでやるやる部分とXIB?Storyboard?でやる部分を分けてかんがえてみてください。
className、identifierはスネークケースに変えてます。

サンプル

Comments

[otakaraya]

お忙しい中、ご指導ありがとうございます。XIBは使用していません。ご教示いただいたコードにしてみましたが、let imageName: String〜の箇所には「Cannot convert value of type 'UIImage' to specified type 'String'」のエラーメッセージが、また、cell.setImageName(imageName)の箇所には、「Value of type 'viewCell' has no member 'setImageName'」が出てしまいました。

[退会済みユーザー]

UIImageViewのレイアウトはStoryboard上で設定してね。

[otakaraya]

何度もご足労をおかけして申し訳ありません。imageViewを、ユーティリティエリアのcontentModeでAspectFitに選択し直してみましたが、何も変わりませんでした。

[退会済みユーザー]

回答の方法で実行する場合なのですが、
UIImageViewのレイアウトをStoryboardで設定していますか？
レイアウトとはUIImageViewの大きさをAutoLayoutで設定したことはありますかということなんですが。
なにかUIImageViewの大きさ、位置をご自身で設定した記憶はありますか？

[otakaraya]

また、編集し直していただいたコード使用しましたが、cellのimageは拡大表示のままでした。iosのバグでしょうか？皆目見当がつきません。

[otakaraya]

返答が前後してしまいましたが、UIImageViewの大きさはcellと同じサイズで、AutoLayout設定しています。

[otakaraya]

追記。UIImageViewはcellの上に置いています。

[退会済みユーザー]

じゃあ、セルの大きさの設定はされていますか？
サンプル上げときました参考にでもしてください？

[otakaraya]

cellの大きさは設定してあります。色々とお考えいただき、有難うございました。

[退会済みユーザー]

サンプル内のことですが、imageViewのcontentModeの設定は変更すればきちんと反映されますね…。