【问题标题】:Placing a margin around each edge of the UICollectionView在 UICollectionView 的每个边缘周围放置一个边距
【发布时间】:2013-05-31 20:27:26
【问题描述】:

当 UICollectionView 填充了项目时,它们总是像这样直接到达 UICollectionView 的边缘:

---------------
|X X X X X X X|
|X X X X X X X|
|X X X X X X X|
|X X X X X X X|
|X X X X X X X|
|X X X X X X X|
---------------

我想像这样在每个边缘周围放置一个边距:

---------------
| X X X X X X |
| X X X X X X |
| X X X X X X |
| X X X X X X |
| X X X X X X |
| X X X X X X |
---------------

我试图通过将 UICollectionView 放置在其宿主 UIView 中来实现这一点,方法是将其 Frame 设置为模拟边框,但它在 Frame 内滚动,因此在顶部和底部被切断,并且滚动条也出现在框架的边界中.

我查看了 API,但看不到任何明显可以实现此目的的东西。有什么想法吗?

【问题讨论】:

    标签: ios uicollectionview uicollectionviewlayout


    【解决方案1】:

    我知道这是一个老问题,但不要忘记 UICollectionView 继承自 UIScrollView。

    UICollectionView *collectionView = [[UICollectionView alloc] init];
    collectionView.contentInset = UIEdgeInsetsMake(x.x, x.x, x.x, x.x);
    
    // Swift 3 for good measure
    let collectionView = UICollectionView()
    collectionView.contentInset = UIEdgeInsets(top: x.x, left: x.x, bottom: x.x, right: x.x)
    

    请注意,contentInset 和 sectionInset 都可能会更改视图中单元格的间距。有关这方面的更多信息,请参阅this 帖子。

    【讨论】:

    • collectionView.contentInset 是我所需要的。谢谢
    【解决方案2】:

    您可以使用以下功能。

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

    您将不得不使用数字来弄清楚如何将collectionviewCells 强制放在一行中。

    UIEdgeInsetsMake ( CGFloat top,CGFloat left,CGFloat bottom,CGFloat right); 
    

    对于 Swift 3

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return UIEdgeInsetsMake(10, 4, 10, 4)
    }
    

    【讨论】:

    • 这是我最喜欢的解决方案——它比给你的单元格填充要少得多。而 contentInset 并不总是适合我。
    • 如何在 swift @Vinayak Kini 中制作这个
    【解决方案3】:

    您几乎可以使用 collectionview 的协议控制网格的各个方面。这是一个例子:

    - (UICollectionViewFlowLayout *)collectionViewFlowLayout
    {
        UICollectionViewFlowLayout *flowLayout = [UICollectionViewFlowLayout new];
        flowLayout.itemSize = CGSizeMake(180, 255);
        flowLayout.sectionInset = UIEdgeInsetsMake(10, 30, 0, 30);
        flowLayout.minimumInteritemSpacing = 0.0f;
        flowLayout.minimumLineSpacing = 0.0f;
        flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
        return flowLayout;
    }
    

    您想要更改的是sectionInsets

    【讨论】:

      【解决方案4】:

      (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath:(NSIndexPath *)indexPath {
      }
      

      您可以在左侧为单元格留出一些边距。

      或者您可以创建具有边距的自定义单元格。

      或者你可以设置CollectionviewFlowLayout的属性.sectionInset,这应该是最简单的方法(如果你使用FlowLayout)

      【讨论】:

      • 不要认为 cellForItem 回答了这个问题,因为问题是询问 collectionViewController 的边缘,而不是每个单元格的边缘。
      【解决方案5】:

      斯威夫特 2.0

      self.automaticallyAdjustsScrollViewInsets = false
      self.collectionView.contentInset = UIEdgeInsets(top: 10, left: 0, bottom: 0, right: 0)
      

      【讨论】:

        【解决方案6】:

        在 Xcode 8 上,如果您使用界面生成器,您可以在 Size Inspector 上设置 Section Insets:

        【讨论】:

          【解决方案7】:

          Swift 4 更新Vinayak Kini 回答):

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

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2011-01-31
            • 1970-01-01
            • 2011-04-14
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多