collectionViewLayout sizeForItemAtIndexPath -> CGSize的行为奇怪

Question

我正在尝试使用collectionViewLayout sizeForItemAtIndexPath以水平滚动的方式仅显示一个项目，这很有趣。 我尝试了以下代码：

- (void)viewDidLoad {
    [super viewDidLoad];

    flowLayout = [[UICollectionViewFlowLayout alloc]init];
    
    flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    flowLayout.minimumInteritemSpacing = 0.0;
    
    flowLayout.minimumLineSpacing = 0.0;
    
    _obj_CollectionView.pagingEnabled = YES;
    _obj_CollectionView.collectionViewLayout = flowLayout;
    
    self.obj_CollectionView.delegate = self;
    self.obj_CollectionView.dataSource = self;
    _obj_CollectionView.backgroundColor = [UIColor redColor];
}


-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
    return CGSizeMake(collectionView.frame.size.width, collectionView.frame.size.height);
}

这是collectionView的截图： 这里紫色是我的单元格，红色是我的collectionView，但我希望整个区域都是紫色。

请指导我，我有点困惑。 :)

- Mad Burea

---

好的，你可以打印一下collectionView的headerView和footerView的大小吗？ - Alexandre Barbier

或者节标题大小 - Alexandre Barbier

没有节头或页脚视图。 - Mad Burea

你是如何设置UI组件的？ - vaibhav

根据我的经验，您需要为UICollectionViewFlowLayout创建自定义类，以便解决您的问题。 - CodeChanger

Answer 1

首先，您不需要在程序中创建一个UICollectionViewFlowLayout对象。也不需要在viewDidLoad()中编写代码。所有这些都可以使用storyboard和delegate方法完成。

以下是解决问题的代码：

import UIKit

class ViewController: UIViewController
{
    @IBOutlet weak var collectionView: UICollectionView!

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

extension ViewController : UICollectionViewDataSource
{
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int
    {
        return 10
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
    {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        cell.backgroundColor = (indexPath.item % 2 == 0) ? UIColor.purple : UIColor.blue
        return cell
    }
}

extension ViewController : UICollectionViewDelegateFlowLayout
{
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
    {
        return CGSize(width: collectionView.bounds.width, height: collectionView.bounds.height)
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat
    {
        return 0
    }

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

故事板截图：

输出屏幕：

- PGDev

---

仍然不保持不变 - Mad Burea

你在这方面遇到了什么问题？ - PGDev

我发布了屏幕截图，发现同一个单元格的视图并不是整个单元格都是紫色的。正如您在截图中看到的那样，它有一些空间。 - Mad Burea

我已经更新了答案并添加了一个新的方法到UICollectionViewDelegateFlowLayout中，请看一下。 - PGDev

Answer 2

试试这个：

func collectionView(collectionView: UICollectionView,
                    layout collectionViewLayout: UICollectionViewLayout,
                           minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat {
    return 1.0
}

func collectionView(collectionView: UICollectionView, layout
    collectionViewLayout: UICollectionViewLayout,
    minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat {
    return 1.0
}

ViewDidload:

layout.minimumInteritemSpacing = 20
layout.minimumLineSpacing = 10

CellforrowAtIndexPath:

cell.image.clipsToBounds = true
cell.contentView.frame = cell.bounds

- VJVJ

---

什么是 "CellforrowAtIndexPath:"？ - Elise van Looij

Answer 3

您有一些调试选项可以检查原因：

• NSLog（）您的UICollectionView 帧
• NSLog（） CGSize 以检查返回的实际大小
• 尝试设置硬编码大小以检查行为。
• 如果使用autoLayout，请尝试删除约束后再尝试。

希望这能帮到您。

- iBug

---

尝试了所有的方法，但仍然无法弄清楚 :) - Mad Burea

Answer 4

我做了一个小的概念验证，对我来说它按预期工作。 也许你的CollectionViewCell有问题（错误/缺少约束）？

import UIKit


class CollectionViewController: UICollectionViewController {
    let layout = UICollectionViewFlowLayout()

    override func viewDidLoad() {
        super.viewDidLoad()

        layout.scrollDirection = .horizontal
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0

        collectionView?.collectionViewLayout = layout
        collectionView?.isPagingEnabled = true
    }


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


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


    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        cell.backgroundColor = (indexPath.item % 2 == 0) ? UIColor.purple : UIColor.blue

        return cell
    }
}

extension CollectionViewController: UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return self.view.frame.size
    }
}

- d.felber

---

我已经设置了适当的约束并多次检查，但仍然无法得到结果。我也尝试过这个方法。 - Mad Burea

Answer 5

好的，我已经想通了。 首先让我发布我的故事板的布局。

我采用了iPhone6的布局，并给集合视图设置了以下约束条件

设置布局

1. 将集合视图的宽度固定为视图的宽度

   

2. 接下来，我固定了集合视图的纵横比，以便它始终是一个正方形

3. 最后，我们添加了顶部、尾部和前导约束。

现在，我已将布局从垂直滚动改为水平滚动，并添加了以下代码。

代码实现

 #import "ViewController.h"

 @interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>

 @property (nonatomic,weak) IBOutlet UICollectionView *clcnView;

 @end

 @implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
}

#pragma mark - Collection View methods- 

 -(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
     static NSString *reuse = @"cell";
     UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuse forIndexPath:indexPath];
     cell.backgroundColor = randomColor();
     return cell;
 }


-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
     return 10;
 }


 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {

     CGFloat fl = self.clcnView.frame.size.width;
     CGSize mElementSize = CGSizeMake(fl-1, fl-1);
     return mElementSize;
 }
 - (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section {
     return 1.0;
 }

   - (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout  minimumLineSpacingForSectionAtIndex:(NSInteger)section {
     return 1.0;
 }

  - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
     return UIEdgeInsetsMake(0,0,0,0);
 }


 UIColor * randomColor(){
     return [UIColor colorWithRed:arc4random_uniform(255)/255.0f green:arc4random_uniform(255)/255.0f blue:arc4random_uniform(255)/255.0f alpha:1.0];
 }


 @end

这就是诀窍。以下是屏幕截图

在iPhone上

在iPad中

希望这能解决你的问题。

- Saheb Roy

---

你按照这里提到的所有步骤了吗？在这里它运行良好。 - Saheb Roy

另外，如果您已经实现了任何布局代码，例如自定义布局，请将其删除，并让布局保持为故事板中的流式布局（默认）。 - Saheb Roy

Answer 6

请尝试这个，它会帮助你的。

#pragma mark -- Collection View Delegate and datasource method --
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return 10;
}


- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *identifier = @"Cell";


    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath];

    UILabel *title = [[UILabel alloc]initWithFrame:CGRectMake(10, 10, cell.bounds.size.width - 40, 22)];
    title.tag = 200;
    title.backgroundColor = [UIColor purpleColor];
    [cell.contentView addSubview:title];

    return cell;
}

- (CGSize)collectionView:(UICollectionView *)collectionView
                  layout:(UICollectionViewLayout *)collectionViewLayout
  sizeForItemAtIndexPath:(NSIndexPath *)indexPath {

    CGFloat width = self.collectionViewSearchCity.frame.size.width/2-20;
    return CGSizeMake(width, 50.0);
}



- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
    return UIEdgeInsetsMake(0, 15, 0,15);
}

- Sanjukta