ios CollectionView 예제 - Section 생성

ios CollectionView 예제 - Section 생성 방법 (1)

 

1. ViewController에 Section을 생성하는 메소드를 추가하고 생성할 Section 개수를 넣어준다.

/* 색션 개수 설정 */
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 5;
}

 

2. ViewDidLoad 메소드에 섹션 레이아웃을 설정해준다. (레이아웃 셋팅)

- (void)viewDidLoad {
    [super viewDidLoad];

    self.navigationItem.title = @"Yeah";
    
    /* 컬렉션 뷰 셀 델리게이트 설정 */
    [collectionView setDelegate:self];
    [collectionView setDataSource:self];
    
    //섹션 사이즈(레이아웃 셋팅)
    UICollectionViewFlowLayout *collectionViewLayout = (UICollectionViewFlowLayout *)self.collectionView.collectionViewLayout;
    //top, left, bottom, right - 설정
    collectionViewLayout.sectionInset = UIEdgeInsetsMake(20, 0, 20, 0);
   
}

 

---

 

ios CollectionView 예제 - Section 생성 방법 (2)

1. StoryBoard에서 Collection Reusable View를 CollectionView 상단에 드래그앤 드롭으로 배치한다.

 

2. 위에서 추가한 Collection Reusable View의 Identifier를 "MyHeader"라고 작성한다.

 

3. 방법 1번에서 추가한 UICollectionViewFlowLayout 설정을 주석처리 한다.

- (void)viewDidLoad {
    [super viewDidLoad];

    self.navigationItem.title = @"Yeah";
    
    /* 컬렉션 뷰 셀 델리게이트 설정 */
    [collectionView setDelegate:self];
    [collectionView setDataSource:self];
    
    
    //섹션 사이즈(레이아웃 셋팅) - 주석처리
    //UICollectionViewFlowLayout *collectionViewLayout = (UICollectionViewFlowLayout *)self.collectionView.collectionViewLayout;
    //top, left, bottom, right - 설정
    //collectionViewLayout.sectionInset = UIEdgeInsetsMake(20, 0, 20, 0);
   
}

 

 

4. Collection Reusable View Header를 꾸미는 메소드를 작성하고 라벨로 표시해준다.

/* 헤더 설정 */
- (UICollectionReusableView *) collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
    
    if([kind isEqualToString:UICollectionElementKindSectionHeader]){
        UICollectionReusableView *rView = [self.collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"MyHeader" forIndexPath:indexPath];
        
        UILabel *lable = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, 30)];
        
        [lable setText:[NSString stringWithFormat:@"%ld번 헤더",(long)indexPath.section]];
        [lable setTextAlignment:NSTextAlignmentRight];
        [lable setFont:[UIFont systemFontOfSize:20.0f]];
        [lable setBackgroundColor:[UIColor yellowColor]];
        
        [rView addSubview:lable];
        
        return rView;
    }
    return nil;
}

 

5.완성

Collection Reusable View Header