如何设置动态宽度UICollectionViewCell

时间:2017-08-10 08:41:06

标签: ios iphone swift uicollectionview

我构建了一个iOS应用程序,我正在使用Collection View with Collection View Cell。我已经将Collection View约束设置为主视图。但是,如果我运行应用程序,它会给出不同的结果。甚至,在iPhone 5版本中,内容与屏幕宽度重叠。

请查看下面的屏幕截图

iphone 5 version

集合视图的内容与屏幕大小重叠。请与下面的iPhone 7和7plus版本进行比较

iphone 7 version

这是iPhone 7p版本

iphone 7p

我已经尝试为top,left,bottom,right设置特定约束,但它没有给出任何结果。这是我的视图控制器的故事板

storyboard

我搜索整个网站,但我只找到了如何设置动态高度,而不是宽度。我只想设置动态宽度,因为内容高度是不变的。有人能给我任何建议吗?

注意:这是我的集合视图代码(也许有人想看)

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    let screenSize: CGRect = UIScreen.main.bounds


    return CGSize(width: collectionPromo.bounds.size.width, height: collectionPromo.collectionViewLayout.collectionViewContentSize.height);
}

我尝试设置代码的动态宽度(我在互联网上找到)

注意:这不是图像视图内容模式问题,因为重叠的是整个内容(包括标签)不仅是图像视图 这是我的集合视图代码

public func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cellPromo", for: indexPath)

    var labelPromo = cell.viewWithTag(3) as! UILabel
    labelPromo.text = list[indexPath.row].Period

    var imagePromo = cell.viewWithTag(2) as! UIImageView
    let promimg = try? UIImage(data: Data(contentsOf: URL(string: list[indexPath.row].ImageUrl)!))
    imagePromo.image = promimg!
    imagePromo.contentMode = UIViewContentMode.scaleAspectFit
    //imagePromo.layer.masksToBounds = true
    imagePromo.clipsToBounds = true


    cell.layer.masksToBounds = false
    cell.layer.borderColor = UIColor.white.cgColor
    cell.layer.borderWidth = 5.0
    //cell.layer.contentsScale = UIScreen.main.scale
    cell.layer.shadowOpacity = 0.25
    cell.layer.shadowRadius = 5.0
    cell.layer.shadowOffset = CGSize.zero
    cell.layer.shadowPath = UIBezierPath(rect: cell.bounds).cgPath
    cell.layer.shouldRasterize = true
    cell.layer.backgroundColor = UIColor.white.cgColor


    return cell
}

2 个答案:

答案 0 :(得分:0)

enter image description here您可以为图片视图添加背景颜色。在方面适合看它。您需要在应用中添加未处于纵向模式的图像。您还需要添加约束,以便没有图像扩展边界。

简单的建议是调试它在特定设备上拉伸的原因? 按照三个步骤 1)使用背景颜色

2)对imageview的约束

3)使用图像宽高比

    Try this - let IS_OS_8_OR_LATER = 
    Float(UIDevice.currentDevice().systemVersion) >= 8.0

   let IS_IPHONE = UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiom.Phone

   let IS_STANDARD_IPHONE_6 = (IS_IPHONE && 
   UIScreen.mainScreen().bounds.size.height == 667.0 && IS_OS_8_OR_LATER && 
    UIScreen.mainScreen().nativeScale == UIScreen.mainScreen().scale)

let IS_ZOOMED_IPHONE_6 = (IS_IPHONE && 
UIScreen.mainScreen().bounds.size.height == 568.0 && IS_OS_8_OR_LATER && 
 UIScreen.mainScreen().nativeScale > 
UIScreen.mainScreen().scale)

let IS_STANDARD_IPHONE_6_PLUS = (IS_IPHONE && 
UIScreen.mainScreen().bounds.size.height == 736.0 )

let IS_ZOOMED_IPHONE_6_PLUS = (IS_IPHONE && 
UIScreen.mainScreen().bounds.size.height == 667.0  && IS_OS_8_OR_LATER && 
UIScreen.mainScreen().nativeScale < UIScreen.mainScreen().scale)

if IS_ZOOMED_IPHONE_6_PLUS {
    //do something
}

答案 1 :(得分:0)

使用collectionView方法设置CollectionView的Edge。 Collection View自动计算其动态宽度。

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets
{
    return UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)
}

或者U可以使用它。

但是尝试将以下代码放在viewDidLoad()中:

collectionView!.contentInset = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

这将为collectionView的每一侧添加填充。