如何在单元格之间添加边距 - 启用UICollectionView分页

时间:2014-07-28 11:11:08

标签: ios interface-builder uicollectionview

我有一个启用了分页的UICollectionView。每个单元格占用屏幕的大小。它的工作原理类似于图像库,但是,我想在我的单元格之间添加5px的填充。当我在InterfaceBuilder中执行此操作时,它会影响我的细胞的排列(屏幕上的第一个细胞,第二个细胞在淋浴时结束5pxs,第一个细胞的末端等)。

我整个早上一直把头发拉出来。这是我的代码;

的.m

@interface GCViewController ()<UICollectionViewDataSource,UICollectionViewDelegate>
@property (weak, nonatomic) IBOutlet UICollectionView *collectionView;
@property (nonatomic) CGFloat minimumLineSpacing;
@property (nonatomic) UIEdgeInsets sectionInset;

@property (nonatomic)NSMutableArray * collArray;
@end

@implementation GCViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    self.collectionView.delegate =self;
    self.collectionView.dataSource=self;
    self.collArray = [[NSMutableArray alloc] initWithObjects:[UIColor greenColor],[UIColor redColor],[UIColor blueColor],[UIColor purpleColor],[UIColor greenColor], nil];

}

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
    return UIEdgeInsetsMake(0, 0, 0, 0);
}
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
CGSize size = CGSizeMake(self.view.frame.size.width, self.view.frame.size.height);

    return size;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{

    return self.collArray.count;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"Cell" forIndexPath:indexPath];
    cell.backgroundColor = [self.collArray objectAtIndex:indexPath.row];
    return cell;
}


- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{

}

- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{

}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


@end

enter image description here enter image description here

1 个答案:

答案 0 :(得分:0)

我使用以下简单的解决方案在每个项目之间插入一个边距(如UIScrollView&#39; s):使用固定值&#39; pageSpacing&#39;扩展每个collectionViewItem的宽度。 (例如10.0),并将collectionView的宽度扩展为相同的值。并且不要忘记,在布局collevtionViewCell的子视图时,还有一个额外的间距,而不是用于绘制真实内容。

继续使用Swift 3.1编写的代码,我确信它很容易为您理解:

 let pageSpacing: CGFloat = 10

 class ViewController: UITableViewController {
      override func viewDidLoad() {
         super.viewDidLoad()

         let layout = UICollectionViewFlowLayout()
         layout.itemSize                = CGSize(width: view.frame.width + pageSpacing, height: view.frame.height)
         layout.scrollDirection         = .horizontal
         layout.minimumInteritemSpacing = 0
         layout.minimumLineSpacing      = 0

         let frame = CGRect(x: 0, y: 0, width: view.frame.width + pageSpacing, height: view.frame.height)
         let collectionView = UICollectionView(frame: frame, collectionViewLayout: layout)
         view.addSubview(collectionView)
     }
 }

 class MyCell: UICollectionViewCell {
     var fullScreenImageView = UIImageView()
     override func layoutSubviews() {
         super.layoutSubviews()
         fullScreenImageView.frame = CGRect(x: 0, y: 0, width: frame.width - pageSpacing, height: frame.height)
     }
 }

希望能帮到你。