web-dev-qa-db-ja.com

UITableViewのようなセクションヘッダーを持つUICollectionView

TableViewのヘッダーに似たCollectionViewのセクションヘッダーを作成して実装できる人は誰ですか?私は多くの研究を行い、コードのスニペットを見つけましたが、これを成功裏に達成した人の実例はありませんでした。私は写真のCollectionViewを持っています、私が達成しようとしているのは、それらが撮影された月に応じてセクションにグループ化することですそれらをこれらのセクションに分割することができましたが、現在は各セクションの先頭のすぐ上の空白のヘッダーがあります。私がしたいのは、それらの現在空白のヘッダーに月を表示することです。連絡先を表示するテーブルビューに各セクションの文字が表示されるのと同じ方法。事前にご回答いただきありがとうございます。

31
emm
  1. ストーリーボードでセクションヘッダー/フッタービューを有効にします。

  2. 実装collectionView:viewForSupplementaryElementOfKind 方法。

このリンク を参照

35
david72

コレクションビューにセクションヘッダーを追加すると、次のように設定できます。

  1. xibファイルを追加して、ヘッダービューのコンテンツを定義します。 xibファイルには、セルタイプ定義が1つだけ含まれています。私の場合、ヘッダービューには、UICollectionViewCellから派生したカスタムタイプ(ImageCollectionViewHeaderCell)があります。必要だと思いますが、よくわかりません。セル識別子は、事前定義された文字列(例)「ImageCollectionViewHeaderCellId」にも設定されます

  2. カスタムタイプのヘッダーファイルと実装ファイルを追加します。 UINibオブジェクト(手順1で作成されたxibファイルの一種のプロキシ)を取得するメソッドがあると便利です。

    @implementation ImageCollectionViewHeaderCell
    + (UINib*) nib
    {
      return [UINib nibWithNibName:@"nameOfXibFileCreatedAtStep1" bundle:nil];
    }
    
    @end
    
  3. コレクションビューコントローラー(この場合、これはdataSourceおよびUICollectionViewのデリゲートでもあります)、viewDidLoadメソッドで、補足要素タイプの登録を追加します

    - (void) viewDidLoad
    {
       [_collectionView registerNib:[ImageCollectionViewHeaderCell nib] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"ImageCollectionViewHeaderCellId"];
    }
    
  4. コレクションビューコントローラーで、null以外のヘッダーの高さとヘッダービューのインスタンスを返すメソッドを追加します

    - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section
    {
      return CGSizeMake(0., 30.);
    }
    
    - (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
    {
      NSAssert([kind isEqualToString:UICollectionElementKindSectionHeader], @"Unexpected supplementary element kind");
      UICollectionReusableView* cell = [collectionView dequeueReusableSupplementaryViewOfKind:kind
                                                                  withReuseIdentifier:ImageCollectionViewHeaderCellIdentifier
                                                                         forIndexPath:indexPath];
    
      NSAssert([cell isKindOfClass:[ImageCollectionViewHeaderCell class]], @"Unexpected class for header cell");
    
      ImageCollectionViewHeaderCell* header_view = (ImageCollectionViewHeaderCell*) cell;
    
      // custom content
    
      return cell;
    }
    
18
Etienne