是否可以创建自定义CollectionViewLayout,其中单个单元格之间的间距可以专门控制

时间:2014-07-22 11:28:55

标签: ios objective-c uicollectionview uicollectionviewcell

我正在尝试使用UiCollectionView构建一个蜂窝。我使用https://github.com/cyrilchandelier/CCHexagonFlowLayout组件来创建视图的基本结构。

Before tapped to any cell

根据点击任何单元格时的要求,相邻单元格应从动态单元格中移出距离x。

我创建了两个具有不同间距值的collectionViewLayout,并在didSelectItemAtIndexPath方法

更改它

这是我的代码......

#import "HoneycombViewController.h"


@interface HoneycombViewController ()
// Collection view
@property (nonatomic, strong) UICollectionView *collectionView;
@property(nonatomic,strong)  CCHexagonFlowLayout *layout;

@property(nonatomic,strong)  CCHexagonFlowLayout *largeLayout;

@property(nonatomic) CGFloat minimumItemSpacingFactor;
@property(nonatomic) CGFloat minimumLineSpacingFactor ;
@property(nonatomic) CGFloat layoutGapFactor ;

@end

@implementation A3HoneycombViewController
@synthesize minimumLineSpacingFactor,minimumItemSpacingFactor,layoutGapFactor;

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.minimumItemSpacingFactor = 10.0f;
    self.minimumLineSpacingFactor = 10.0f;
    self.layoutGapFactor = 10.0f;

    // Build layout
    self.layout = [[CCHexagonFlowLayout alloc] init];
    self.layout.delegate = self;
     //layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    self.layout.scrollDirection = UICollectionViewScrollDirectionVertical;
    self.layout.minimumInteritemSpacing = -30.0f;
    self.layout.minimumLineSpacing = 10.0f;
    self.layout.sectionInset = UIEdgeInsetsMake(20.0f, 15.0f, 20.0f, 15.0f);
    self.layout.itemSize = RootCell_SIZE;

    //layout.headerReferenceSize = HeaderView_SIZE(layout.scrollDirection);
    //layout.footerReferenceSize = FooterView_SIZE(layout.scrollDirection);

    self.layout.headerReferenceSize = CGSizeMake(self.view.frame.size.width,50) ;
    self.layout.footerReferenceSize = CGSizeMake(self.view.frame.size.width,50) ;
    self.layout.gap = 76.0f;

    //create large layout
    self.largeLayout = [[CCHexagonFlowLayout alloc] init];
    self.largeLayout.delegate = self;
    self.largeLayout.scrollDirection = self.layout.scrollDirection;
    self.largeLayout.minimumLineSpacing = self.layout.minimumLineSpacing+self.minimumLineSpacingFactor;
    self.largeLayout.minimumInteritemSpacing = self.layout.minimumInteritemSpacing+self.minimumItemSpacingFactor;
    self.largeLayout.itemSize =  self.layout.itemSize;
    self.largeLayout.sectionInset = self.layout.sectionInset;
    self.largeLayout.headerReferenceSize =self.layout.headerReferenceSize;
    self.largeLayout.footerReferenceSize =  self.layout.footerReferenceSize;
    self.largeLayout.gap = self.layout.gap + self.layoutGapFactor;



    // Build collection view
    _collectionView = [[UICollectionView alloc] initWithFrame:self.view.bounds collectionViewLayout:self.layout];
    _collectionView.dataSource = self;
    _collectionView.delegate = self;
    _collectionView.backgroundColor = [UIColor whiteColor];

    // Register cell and views
    [_collectionView registerNib:[RootCell cellNib] forCellWithReuseIdentifier:RootCell_ID];
    [_collectionView registerNib:[HeaderView viewNib] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:HeaderView_ID];
    [_collectionView registerNib:[FooterView viewNib] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:FooterView_ID];

    // Add to view
    [self.view addSubview:_collectionView];

    // Reload data
    [_collectionView reloadData];

}

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

#pragma mark - UICollectionDataSource methods
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return 1;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    switch (section)
    {
        case 0:
            return 10;

        default:
            return 10;
    }
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    RootCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:RootCell_ID forIndexPath:indexPath];
    [cell configureWithInt:indexPath.item];

    return cell;
}

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView
           viewForSupplementaryElementOfKind:(NSString *)kind
                                 atIndexPath:(NSIndexPath *)indexPath
{
    // Section header
    if ([kind isEqualToString:UICollectionElementKindSectionHeader])
        return [_collectionView dequeueReusableSupplementaryViewOfKind:kind
                                                   withReuseIdentifier:HeaderView_ID
                                                          forIndexPath:indexPath];

    // Section footer
    if ([kind isEqualToString:UICollectionElementKindSectionFooter])
        return [_collectionView dequeueReusableSupplementaryViewOfKind:kind
                                                   withReuseIdentifier:FooterView_ID
                                                          forIndexPath:indexPath];

    return nil;
}
-(CGSize)collectionViewContentSize { //Workaround
    CGSize superSize = [self.layout collectionViewContentSize];
    CGRect frame = self.collectionView.frame;
    return CGSizeMake(fmaxf(superSize.width, CGRectGetWidth(frame)), fmaxf(superSize.height, CGRectGetHeight(frame)));
}
//
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{

     UICollectionViewLayout *toLayout = self.layout == self.collectionView.collectionViewLayout ? self.largeLayout : self.layout;
    [self.collectionView setCollectionViewLayout:toLayout animated:YES completion:^(BOOL finished) {
        NSLog(@"animation end ");
    }];



}

After tabbing to hexagon 1

在屏幕截图2中,我点击了单元格1,现在相邻的单元格如0,5,6,7,2正确移动,标记为绿色但其他单元格也标记为红色。

根据这段代码,所有的单元格布局都有所改变,但是我只希望我的标签式单元格应该坚持它的位置并改变它的单元格间距,这表明看起来它的相邻单元格在距离x处也移动了空间之间的其他单元格应保持较旧的价值。是否可以创建自定义CollectionViewLayout,其中单个单元格之间的间距可以专门控制?另外我们如何为不同的细胞使用不同的CollectionViewLayout

0 个答案:

没有答案