UICollectionView二级树展开

公司项目是社区类的,上周就下载了些社区类APP看了下,发现小区无忧首页的顶部蛮好玩,就试着做了一下,现在先把UICollectionView的二级树展开功能分享一下 .

1.效果图

2.创建子CollectionView

//
//  DeatilView.h
//  Spread
//
//  Created by City--Online on 15/10/30.
//  Copyright  2015年 City--Online. All rights reserved.
//

#import <UIKit/UIKit.h>

typedef void(^DetailIndexPathBlock) (NSIndexPath *indexPath);

@interface DetailView : UIView

@property (nonatomic,copy) DetailIndexPathBlock detailIndexPathBlock;

- (instancetype)initWithFrame:(CGRect)frame withTitleArray:(NSArray *)titleArray;

@end

//
//  DeatilView.m
//  Spread
//
//  Created by City--Online on 15/10/30.
//  Copyright  2015年 City--Online. All rights reserved.
//

#import "DetailView.h"

static const int columns=4;
static const float rowHeight=30.0;
//static const int rows=2;
@interface DetailView ()<UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>

@property (nonatomic,strong) UICollectionView *collectionView;

@property (nonatomic,strong) NSArray *titleArray;
@end

@implementation DetailView

- (instancetype)initWithFrame:(CGRect)frame withTitleArray:(NSArray *)titleArray
{
    _titleArray=titleArray;
    return [self initWithFrame:frame];
}

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {

        UICollectionViewFlowLayout  *collectionViewFlowLayout=[[UICollectionViewFlowLayout alloc]init];
        collectionViewFlowLayout.minimumInteritemSpacing=0.0;
        collectionViewFlowLayout.minimumLineSpacing=0.0;
        collectionViewFlowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
        collectionViewFlowLayout.sectionInset = UIEdgeInsetsMake(0.0, 0.0, 0, 0.0);

        float columuWidth=self.bounds.size.width/columns;
        collectionViewFlowLayout.itemSize=CGSizeMake(columuWidth, rowHeight);
        collectionViewFlowLayout.estimatedItemSize=CGSizeMake(columuWidth, rowHeight);

        collectionViewFlowLayout.scrollDirection=UICollectionViewScrollDirectionVertical;

        collectionViewFlowLayout.headerReferenceSize=CGSizeMake(0, 0);
        collectionViewFlowLayout.footerReferenceSize=CGSizeMake(0, 0);

        _collectionView=[[UICollectionView alloc]initWithFrame:self.bounds collectionViewLayout:collectionViewFlowLayout];
        _collectionView.backgroundColor=[UIColor whiteColor];
        _collectionView.delegate=self;
        _collectionView.dataSource=self;
        _collectionView.allowsSelection=YES;
//        _collectionView.allowsMultipleSelection=YES;

        [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
        [self addSubview:_collectionView];
    }
    return self;
}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return 1;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return _titleArray.count;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewCell *cell =[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.backgroundColor = [UIColor colorWithRed:arc4random()%256/ 255.0  green:arc4random()%256 / 255.0 blue:arc4random()% 256 / 255.0  alpha:1];
    return cell;
}
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    if (self.detailIndexPathBlock != nil) {
        self.detailIndexPathBlock(indexPath);
    }
}

@end

3.主视图

//
//  MainView.h
//  Spread
//
//  Created by City--Online on 15/10/30.
//  Copyright  2015年 City--Online. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface MainView : UIView

- (instancetype)initWithFrame:(CGRect)frame withTitleArray:(NSArray *)mainArray;

@end

//
//  MainView.m
//  Spread
//
//  Created by City--Online on 15/10/30.
//  Copyright  2015年 City--Online. All rights reserved.
//

#import "MainView.h"
#import "DetailView.h"

static const int columns=4;

@interface MainView ()<UICollectionViewDataSource,UIBarPositioningDelegate,UICollectionViewDelegateFlowLayout>

@property (nonatomic,strong) UICollectionView *collectionView;

@property (nonatomic,strong) NSArray *mainArray;

@property (nonatomic,strong) NSMutableArray *detailArray;

@property (nonatomic,strong) NSIndexPath *selectIndexPath;

@property (nonatomic,strong) DetailView *detailView;

@property (nonatomic,assign) bool    *IsSpread;

@end

@implementation MainView

- (instancetype)initWithFrame:(CGRect)frame withTitleArray:(NSArray *)mainArray
{
    _mainArray=mainArray;
    _selectIndexPath=nil;
    return [self initWithFrame:frame];
}
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        UICollectionViewFlowLayout  *collectionViewFlowLayout=[[UICollectionViewFlowLayout alloc]init];
        collectionViewFlowLayout.minimumInteritemSpacing=1.0;
        collectionViewFlowLayout.minimumLineSpacing=0.0;
        collectionViewFlowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
        collectionViewFlowLayout.sectionInset = UIEdgeInsetsMake(0.0, 0.0, 0, 0.0);
        float columuWidth=(self.bounds.size.width-columns+1)/columns;
        collectionViewFlowLayout.itemSize=CGSizeMake(columuWidth, columuWidth);
        collectionViewFlowLayout.estimatedItemSize=CGSizeMake(columuWidth, columuWidth);
        collectionViewFlowLayout.scrollDirection=UICollectionViewScrollDirectionVertical;
        collectionViewFlowLayout.headerReferenceSize=CGSizeMake(0, 0);
        collectionViewFlowLayout.footerReferenceSize=CGSizeMake(0, 0);
        _collectionView=[[UICollectionView alloc] initWithFrame:self.bounds collectionViewLayout:collectionViewFlowLayout];
        _collectionView.backgroundColor=[UIColor whiteColor];
        _collectionView.delegate=self;
        _collectionView.dataSource=self;
        _collectionView.allowsSelection=YES;
        [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
        [_collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footer"];
        [self addSubview:_collectionView];
    }
    return self;
}

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

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewCell *cell =[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];

    cell.backgroundColor=indexPath.section%2? [UIColor redColor]:[UIColor yellowColor];
    if (indexPath.section*columns+indexPath.row>_mainArray.count) {
        cell.backgroundColor=[UIColor clearColor];
    }
    return cell;
}
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{

    if (_selectIndexPath!=indexPath&&_selectIndexPath!=nil) {
        _IsSpread=YES;
    }
    else
    {
        _IsSpread=!_IsSpread;
    }

    if (!_IsSpread) {
        //改变主CollectionView视图Frame和子CollectionView的Frame
        self.frame=CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.width);
    }
    else
    {
        self.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.width+((int)(_detailArray.count+3)/4)*30.0);
    }

    _collectionView.frame = self.frame;
    _selectIndexPath=indexPath;
    //改变数据源
     _detailArray=[(@[@"AAA",@"BBB",@"CCC",@"DDD",@"EEE"]) mutableCopy];
    [_collectionView reloadData];

}
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return (_mainArray.count+columns-1)/4;
}
//针对每个分区的页眉和页脚, 返回对应的视图对象, 重用的
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{

    UICollectionReusableView *footerView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"footer" forIndexPath:indexPath];

    //将第二个视图控制器添加到区尾上
    if (_detailView!=nil) {
        [_detailView removeFromSuperview];
        _detailView=nil;
    }
    _detailView =[[DetailView alloc] initWithFrame:CGRectMake(0, 0, self.bounds.size.width, ((int)(5+3)/4)*30.0) withTitleArray:_detailArray];
    _detailView.detailIndexPathBlock=^(NSIndexPath *indexPath)
    {
        NSLog(@"%@",indexPath);
    };
    [footerView addSubview:_detailView];

    return footerView;
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section
{
    if (section==_selectIndexPath.section&&_IsSpread) {
        return CGSizeMake(self.bounds.size.width, ((int)(_detailArray.count+3)/4)*30.0) ;
    }
    else
    {
        return CGSizeZero;
    }
}
@end

4.调用

//
//  ViewController.m
//  Spread
//
//  Created by City--Online on 15/10/30.
//  Copyright  2015年 City--Online. All rights reserved.
//

#import "ViewController.h"
#import "MainView.h"
#import "DetailView.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    MainView *mainView=[[MainView alloc]initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.width) withTitleArray:@[@"1",@"2",@"3",@"4",@"5",@"6"]];
    [self.view addSubview:mainView];
}

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

@end

5.结果图

 今天又添加了ScrollView分页 demo地址:https://github.com/ywcui/Spread