快速查看收藏夹视图单元格

时间:2020-06-28 02:53:40

标签: ios swift xcode collections view

我正在尝试在集合视图单元格中显示一个紧随UILabel的图像,但问题是集合视图被压缩,因此仅图像的1/4部分可见,并且ui标签被隐藏。解决了这个问题。我还为集合视图单元格中的图像视图添加了约束,但是它不起作用。

Click here to see interface builder design

Click here to see the simulator output

ViewControllerCode

import UIKit

class ShopVC: UIViewController,UICollectionViewDelegate,UICollectionViewDataSource{
  
    

    @IBOutlet weak var productcollection: UICollectionView!
    var selectedpname: String!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        print(selectedpname!)
        productcollection.delegate = self
        productcollection.dataSource = self
    }
    
    
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return DataService.serviceobj.getProducts(product: selectedpname).count
        }
    
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        
        
        if let collectioncell = collectionView.dequeueReusableCell(withReuseIdentifier: "collectioncell", for: indexPath) as? ProductCell
        {
            let parray = DataService.serviceobj.getProducts(product: selectedpname)
            let product = parray[indexPath.row]
            
            collectioncell.updateCollectionCell(productname: product.pname, productimage: product.pimage)
            
            return collectioncell
        }
        
        
        return UICollectionViewCell()
        
    }
    


}

型号代码

import Foundation

struct Products
{
    private(set) public var pname:String
    private(set) public var pimage:String
    
    init(pname: String,pimage: String) {
        self.pname = pname
        self.pimage = pimage
    }
}

CollectionView单元格代码

import UIKit

class ProductCell: UICollectionViewCell {
    
    @IBOutlet weak var productname: UILabel!
    
    @IBOutlet weak var productimage: UIImageView!
    
    
    override  func awakeFromNib() {
        super.awakeFromNib()
        
        layer.cornerRadius = 10
        layer.shadowColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)
        layer.shadowRadius = 5
        layer.shadowOpacity = 10
    }
    
    func updateCollectionCell(productname: String,productimage: String)
    {
        
        self.productimage.image = UIImage(named: productimage)
        self.productname.text = productname
    }
}

数据服务代码

import Foundation


    class DataService
    {
         static let serviceobj = DataService()
        
       private let categories = [Products(pname: "Shirts", pimage: "shirts.png"),
        Products(pname: "Hoodies", pimage: "hoodies.png"),
        Products(pname: "Hats", pimage: "hats.png"),
        Products(pname: "Digital", pimage: "digital.png")]
        
        private let shirts = [Products(pname: "Shirt1", pimage: "shirt01.jpg"),
        Products(pname: "Shirt2", pimage: "shirt02.jpg"),
        Products(pname: "Shirt3", pimage: "shirt03.jpg"),
        Products(pname: "Shirt4", pimage: "shirt04.jpg")]
    
        
        private let hoodies = [Products(pname: "Hoodie1", pimage: "hoodie01.jpg"),
                               Products(pname: "Hoodie2", pimage: "hoodie02.jpg"),
                               Products(pname: "Hoodie3", pimage: "hoodie03.jpg"),
                               Products(pname: "Hoddie4", pimage: "hoodie04.jpg")]
        
       func getCategories() -> [Products]
        {
            return categories
        }
        
        func getProducts(product: String) -> [Products]
        {
            switch product {
            case "Shirts":
                return shirts
            case "Hoodies":
                return hoodies
           
            default:
                return categories
                
            }
            
            
        }
        
        
    }

1 个答案:

答案 0 :(得分:0)

我拉了你的仓库,看看。看来您尚未在集合视图单元格中设置任何约束。

您需要为单元格中的所有视图设置开头,顶部,尾部和底部约束。您还需要在图像视图和标签上设置宽度/高度约束。

UIImageView constraints UILabel constraints Result