collectionView cells overlapping

Question

I am trying to create multiple collectionViewCells with 4 different types. And every cell has a different view of one of those 4 types. Every view of those types can have different contents based on user selection.

The problem I am having is the fact that some of the cards are overlapping/not loading correctly when multiple views/cells of the same type are on the screen.

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    Card *card = [[[usermanager getSelectedUser] getCards] objectAtIndex:indexPath.item];
    NSLog(@"CARD LOADING: %@", card.title);
    [card setupLayout];
    UICollectionViewCell *cell;
    if(card.type.intValue == 1){
        cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"lifestyleCell" forIndexPath:indexPath];
    }else if(card.type.intValue == 2){
        cell= [collectionView dequeueReusableCellWithReuseIdentifier:@"sceneCell" forIndexPath:indexPath];
    }else if(card.type.intValue == 3){
        cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"energyCell" forIndexPath:indexPath];
    }else if(card.type.intValue == 4){
        cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"productCell" forIndexPath:indexPath];
    }else{
        cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cardCell" forIndexPath:indexPath];
    }
    [cell addSubview:card];

    //Add dropshadow
    cell.contentView.layer.borderWidth = 1.0f;
    cell.contentView.layer.borderColor = [UIColor clearColor].CGColor;
    cell.contentView.layer.masksToBounds = YES;

    cell.layer.shadowColor = [UIColor blackColor].CGColor;
    cell.layer.shadowOffset = CGSizeMake(0, 5.0f);
    cell.layer.shadowRadius = 2.0f;
    cell.layer.shadowOpacity = 0.5f;
    cell.layer.masksToBounds = NO;

    return cell;
}

The card is the view I add to the cell. As mentioned above there are multiple types of those cards.

Answer 1

As you scroll a UICollectionView , cells that disappear offscreen are re-used for the new cells coming on-screen. That means if you add subviews in your collectionView:cellForItemAtIndexPath: method, they will still be part of the cell's view hierarchy when that cell is re-used. Every time the cell is re-used, it will add a new subview when you call [cell addSubview:card] . Your card subviews will simply stack on top of each other.

It seems that you're using a collection of Card objects, custom UIView subclasses, to store each user's deck of cards. I would suggest instead that you separate out the model from the view - store each card as a simple data model which represents the card independently of how it is displayed (see MVC). Then you can create a custom UICollectionViewCell subclass which can display any card. In your collectionView:cellForItemAtIndexPath: you would simply reconfigure the cell's view according to the corresponding card data. That way you do not need to call addSubview: within your collectionView:cellForItemAtIndexPath: method.

Answer 2

尝试使用：

cell.clipsToBounds = YES;