如何使用约束在表格视图单元格之间创建空间? [英] How can I create space between table view cells using constraints?

问题描述

正如您在屏幕截图中看到的，顶部图像和屏幕顶部之间没有空间.另外，我所有的图像大小都不一样.如何在这些单元格之间创建空间并使所有图像的大小相同.

As you can see in the screenshot, there's no space between the top image and the top of the screen. Also, all my images are not the same size. How can I create space between these cells and also make all the images the same size.

推荐答案

我建议使用集合视图，您可以轻松管理单元格间距-:

I would suggest go for collection views you can manage cell spacing easily-:

1) 在故事板上添加collection view.

1) Add collection view on storyboard.

2) 以类似于 table view 的方式添加它的 DataSource 和 Delegate.(选择集合视图，然后拖放到黄色图标).

2) Add its DataSource and Delegate in similar way to table view.(select collection view, and drag drop to yellow icon).

3) 在单元格上添加 imageView.

3) Add imageView on cell.

4) 相应地调整 cell 大小.

4) Adjust cell size accordingly.

5) 还提供下图的单元格间距检查.

5) Also to provide cell spacing check below image.

6) 调整行的最小间距，它将提供您要查找的内容.

6) Adjust minimum spacing for lines it will provide what you looking for.

控制器类-:

import UIKit

//controller class with 3 needed protocols
class UnderlineViewController: UIViewController,UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout {

    //viewDidLoad
    override func viewDidLoad() {
        super.viewDidLoad()

        }
    //didReceiveMemoryWarning
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    //numberOfItemsInSection
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int{
        return 5
    }


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

    //numberOfSections

    func numberOfSections(in collectionView: UICollectionView) -> Int{
        return 1
    }

    // sizeForItemAt for each row
    public func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize{
        return CGSize(width: view.frame.width, height: 200)
    }

}

输出-:

同时取消选中scrollViewInsets.

1) 点击控制器的黄色图标并选择Attribute Inspector.

1) Click on yello icon of your controller and select Attribute Inspector.

2) 查找调整滚动视图插入并取消选中它.

2) Look for Adjust Scroll View Insets and uncheck it.

这篇关于如何使用约束在表格视图单元格之间创建空间?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！