ios - 如何在 CollectionView 中自动布局 ImageView 以便单元格到边缘的间距与内部单元格间距相同?

标签 ios swift uiimageview autolayout uicollectionviewcell

我在 CollectionViewCell 中创建了 UIImageView。我希望布局最左边的单元格到左边缘的间距与内部单元格之间的间距相同,并且最右边的单元格到屏幕右边缘的间距相同。我目前的布局是这样的:

this picture below


在上图中,左边缘到左侧的大多数单元格间距为 10 点,而内部单元格间距是其两倍。那是因为我的 UIImageView 在所有 4 个方向(上、下、左、右)上都比 CollectionViewCell 小 10points。


我在这个问题上花了很多时间,包括搜索 StackOverflow,但似乎找不到答案。


我可以按照 this posting
连续创建 N 个单元格,而且我还按照 this posting 调整单元格间距

最佳答案

我设法找到了上述问题的解决方案。

我做了以下事情:

  1. 移除 UIImageViewCollectionViewCell 之间的所有内部间距。然后删除任何偏移量并使大小匹配。在所有 4 个方向上设置 0 约束。
  2. 使用 second reference mentioned above作为模板。我用以下内容更新了我的 ViewController:

    扩展 ToDoCategoryViewController: UICollectionViewDelegateFlowLayout {

    fileprivate var sectionInsets: UIEdgeInsets {
        return UIEdgeInsetsMake(0, Constant.hardCodedPadding, 0, Constant.hardCodedPadding)
    }
    
    fileprivate var innerSpacing: CGFloat { return Constant.hardCodedPadding }
    fileprivate var rowSpacing: CGFloat { return Constant.hardCodedPadding }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    
        var itemPerRow: CGFloat {
            switch collectionView.bounds.width {
            case 300..<500:
                return 3
            case 500..<800:
                return 4
            default:
                return 5
            }
        }
    
        let innerSpacingCount = itemPerRow - 1
        let edgesPadding = Constant.hardCodedPadding * 2.0
        let itemWidth = (collectionView.bounds.width - (innerSpacing * innerSpacingCount + edgesPadding)) / itemPerRow
        let itemHeight = itemWidth * CGFloat(1.25)
        return CGSize(width: itemWidth, height: itemHeight)
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return sectionInsets
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return rowSpacing
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return innerSpacing
    }
    

在我其他地方的代码中,我设置了 Constant.hardcodedPadding 值,例如CGFloat(30.0)

因此,我得到以下 View :same spacing inner and outer

关于ios - 如何在 CollectionView 中自动布局 ImageView 以便单元格到边缘的间距与内部单元格间距相同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44534357/

相关文章:

ios - 图片无法加载?

ios - 将图像链接转换为 UIImageView- Swift

IOS 表情符号 unicode 列表

ios - UITableViewCell 不响应响应者链

ios - 纯粹在 Swift 中 React Native 应用程序

ios - UIImageView 来回弹跳

ios - 拍摄数据快照时出现 Firebase NSNull 异常

ios - 扩展自定义 TableviewCell 无法正常工作并显示不正确的 View

swift - 将 NSDictionary 设置为 UserDefaults 时出现异常

ios - 如何使用 Swift 删除注销按钮并永久存储 session FBSDK IOS