2013-05-28 19 views
6

UICollectionViewのカスタムフローレイアウトを定義しようとしていますが、UICollectionViewFlowLayoutをサブクラス化しています。UICollectionViewFlowLayout変数のセル幅と高さが空白の場合

layout

あなたが見ることができるように、私は水平真ん中デバイドに沿って2列に等しいコレクションビューを分割しています。私が欲しいのレイアウトは次のようになります一番上の行は3列に分割され、下の行は半分に分割されて2列になります。

layout

:5個のセルがレンダリングされて終了した後

すべてが動作します(コレクションビューのスクロールがUICollectionViewScrollDirectionHorizo​​ntalにある)右にスクロールするまで罰金を見て、そこに大きなスペースを見ているようです

なぜこれが起こっているのか分かりませんが、空のスペースは上の行のセルと同じ幅に見えます。コレクションビューの幅の3分の1。

:ここ

は、どのように私のセットアップUICollectionViewとUICollectionViewFlowLayoutサブクラス

- (void)loadView { 
    [super loadView]; 
    [self setupCollectionView]; 
} 

- (void)setupCollectionView { 
    CustomFlowLayout *flowLayout = [[CustomFlowLayout alloc] init]; 
    flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal; 
    flowLayout.minimumInteritemSpacing = 0.0; 
    flowLayout.minimumLineSpacing = 0.0f; 

    CGRect frame = CGRectMake(0, 0, 748, 1024); 
    UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:frame collectionViewLayout:flowLayout]; 

    [collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:CollectionViewCellID]; 

    collectionView.delegate = self; 
    collectionView.dataSource = self; 

    collectionView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth; 

    collectionView.backgroundColor = [UIColor whiteColor]; 

    collectionView.pagingEnabled = YES; 


    self.collectionView = collectionView; 

    [self.view addSubview:self.collectionView]; 
} 

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

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { 

    return 5; 
} 

コレクションビュー内の項目のサイズが与えられたセクションのレイアウト構成によって定義されたので、私はそうのようなcollectionView:layout:sizeForItemAtIndexPath:を実装されています

- (CGSize)collectionView:(UICollectionView *)collectionView 
        layout:(UICollectionViewLayout*)collectionViewLayout 
    sizeForItemAtIndexPath:(NSIndexPath *)indexPath { 

    return [collectionViewLayout layoutAttributesForItemAtIndexPath:indexPath].size; 

} 

次のようにUICollectionViewLayoutの私のカスタムサブクラスが実装されています

@implementation CustomFlowLayout 

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect { 
    NSArray* attributesToReturn = [super layoutAttributesForElementsInRect:rect]; 
    for (UICollectionViewLayoutAttributes* attributes in attributesToReturn) { 
     if (nil == attributes.representedElementKind) { 
      NSIndexPath* indexPath = attributes.indexPath; 
      attributes.frame = [self layoutAttributesForItemAtIndexPath:indexPath].frame; 
     } 
    } 
    return attributesToReturn; 
} 

- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath { 
    UICollectionViewLayoutAttributes* currentItemAttributes = [super layoutAttributesForItemAtIndexPath:indexPath]; 

    if (!currentItemAttributes) { 
     currentItemAttributes = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath]; 
    } 

    float height = self.collectionView.frame.size.height; 
    float width = self.collectionView.frame.size.width; 

    CGRect frame = CGRectZero;  
    switch (indexPath.row) { 
     case 0: 
      frame.size = CGSizeMake(width/3, height/2); 
      frame.origin = CGPointMake(0, 0); 
      break; 
     case 1: 
      frame.size = CGSizeMake(width/3, height/2); 
      frame.origin = CGPointMake(width/3, 0); 
      break; 
     case 2: 
      frame.size = CGSizeMake(width/3, height/2); 
      frame.origin = CGPointMake(2*width/3, 0); 
      break; 
     case 3: 
      frame.size = CGSizeMake(width/2, height/2); 
      frame.origin = CGPointMake(0, height/2); 
      break; 
     case 4: 
      frame.size = CGSizeMake(width/2, height/2); 
      frame.origin = CGPointMake(width/2, height/2); 
      break; 
     default: 
      break; 
    } 

    currentItemAttributes.frame = frame; 
    currentItemAttributes.size = frame.size; 
    return currentItemAttributes; 
} 

誰もが、すべてのセルがレンダリングされた後に大きな空きスペースがある理由を知りましたか?あるいは、誰かが後にレイアウトをレンダリングするためのより良いアプローチを持っていますか?すべてのコードは、サンプルXCodeプロジェクトhereとして入手できます。回答、ヒント、思考、プルの要求は非常に高く評価されています。

答えて

4

異なる幅のセルが2行あったときに、collectionviewのcontentSizeが計算され、右側に空白の領域が残っているように見えました。変更hereとGitHubのレポを更新

- (CGSize)collectionViewContentSize { 
    return CGSizeMake(1024, 748); 
} 

:簡単な問題を解決する必要がありました。これは将来誰かを助けてくれることを願っています。

関連する問題