• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

ios - UICollectionView 的分页以在屏幕上显示一个完整单元格和两个部分单元格

[复制链接]
菜鸟教程小白 发表于 2022-12-12 15:31:10 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题

我以这样一种方式使用 UICollectionView,即 Collection View 单元格将位于屏幕中心,左右单元格部分可见。感染,UICollectionView 宽度等于屏幕宽度,单元格宽度更小,因此左右单元格应该部分可见。 为了启用分页,我实现了将中心单元格设置在屏幕中心的自定义代码。现在它产生了一些问题;我想获得任何默认方式来避免导致问题的自定义实现。

我想以这样一种方式启用分页,以便我可以实现下图中描述的行为。

如果我禁用自定义实现并启用默认分页,则会部分显示两个单元格,但它不是我想要的预期行为。

enter image description here

谢谢



Best Answer-推荐答案


据我所知,“默认”你不能这样做,你需要自定义你的collectionView。我实现这一点的方法是继承 collectionView 的流布局并像这样实现以下方法:

- (CGPoint)targetContentOffsetForProposedContentOffsetCGPoint)proposedContentOffset withScrollingVelocityCGPoint)velocity
{
    CGFloat offSetAdjustment = MAXFLOAT;
    CGFloat horizontalCenter = (CGFloat) (proposedContentOffset.x + (self.collectionView.bounds.size.width / 2.0));

    CGRect targetRect = CGRectMake(proposedContentOffset.x, 0.0, self.collectionView.bounds.size.width, self.collectionView.bounds.size.height);

    NSArray *array = [self layoutAttributesForElementsInRect:targetRect];

    UICollectionViewLayoutAttributes *currentAttributes;

    for (UICollectionViewLayoutAttributes *layoutAttributes in array)
    {
        if(layoutAttributes.representedElementCategory == UICollectionElementCategoryCell)
        {
            CGFloat itemHorizontalCenter = layoutAttributes.center.x;
            if (ABS(itemHorizontalCenter - horizontalCenter) < ABS(offSetAdjustment))
            {
                currentAttributes   = layoutAttributes;
                offSetAdjustment    = itemHorizontalCenter - horizontalCenter;
            }
        }
    }

    CGFloat nextOffset          = proposedContentOffset.x + offSetAdjustment;

    proposedContentOffset.x     = nextOffset;
    CGFloat deltaX              = proposedContentOffset.x - self.collectionView.contentOffset.x;
    CGFloat velX                = velocity.x;

    // detection form  gist.github.com/rkeniger/7687301
    // based on http://stackoverflow.com/a/14291208/740949
    if(deltaX == 0.0 || velX == 0 || (velX > 0.0 && deltaX > 0.0) || (velX < 0.0 && deltaX < 0.0)) {

    } else if(velocity.x > 0.0) {
        for (UICollectionViewLayoutAttributes *layoutAttributes in array)
        {
            if(layoutAttributes.representedElementCategory == UICollectionElementCategoryCell)
            {
                CGFloat itemHorizontalCenter = layoutAttributes.center.x;
                if (itemHorizontalCenter > proposedContentOffset.x) {
                    proposedContentOffset.x = nextOffset + (currentAttributes.frame.size.width / 2) + (layoutAttributes.frame.size.width / 2);
                    break;
                }
            }
        }
    } else if(velocity.x < 0.0) {
        for (UICollectionViewLayoutAttributes *layoutAttributes in array)
        {
            if(layoutAttributes.representedElementCategory == UICollectionElementCategoryCell)
            {
                CGFloat itemHorizontalCenter = layoutAttributes.center.x;
                if (itemHorizontalCenter > proposedContentOffset.x) {
                    proposedContentOffset.x = nextOffset - ((currentAttributes.frame.size.width / 2) + (layoutAttributes.frame.size.width / 2));
                    break;
                }
            }
        }
    }

    proposedContentOffset.y = 0.0;

    return proposedContentOffset;
}

(这段代码的灵感很大程度上来 self 在 SO 上找到的其他内容,但我现在找不到引用)。

在我的例子中,collection view 没有分页,但是这个方法让它表现得像原来那样。

另外,如果你想让 Collection View 的第一个单元格从屏幕的中心开始(最后一个单元格也是一样),你必须在 UICollectionViewDelegateFlowLayout 中重写这个方法>

- (UIEdgeInsets)collectionViewUICollectionView *)collectionView layoutUICollectionViewLayout *)collectionViewLayout insetForSectionAtIndexNSInteger)section
{
    CGFloat leftInset = (self.view.bounds.size.width - CELL_WIDTH) / 2;    // CELL_WIDTH is the width of your cell
    return UIEdgeInsetsMake(0, leftInset, 0, leftInset);
}

此方法假定 collectionView 与屏幕一样宽。如果您不是这种情况,请通过计算 collectionView 的左右插图来调整它以适应您的需求。

关于ios - UICollectionView 的分页以在屏幕上显示一个完整单元格和两个部分单元格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30861991/

回复

使用道具 举报

懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关注0

粉丝2

帖子830918

发布主题
阅读排行 更多
广告位

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap