CODEWITHSUNDEEP
iosobjective-cuicollectionview
Erika Electra
Erika Electra

Reputation: 1882

Highlighting or Enlargening selected cell?

I'm working in a UIViewController with a UICollectionView arranged in standard grid layout, with allowsMultipleSelection = NO. When a user selects a cell (selected through a handleTap UITapGestureRecognizer), I'd like to do one or all of the following:

(1) highlight/color the cell a different color -- change its alpha and background color

(2) slightly enlarge the cell without altering any other cell around it

(3) draw a border around the modified cell's frame or bounds

I am currently using the following function, which is never getting called despite the cell being properly demarcated selected, and stored in local variable selectedCell.

-(CGSize) collectionView:(UICollectionView*)collectionView layout:(UICollectionViewFlowLayout*)layout sizeForItemAtIndexPath: (NSIndexPath*)indexPath
{
    if ([indexPath isEqual:selectedCellIndexPath]) 
 {

        return CGSizeMake([MyCollectionViewCell width] + 4, [MyCollectionViewCell height] + 4);
    } else {
        return CGSizeMake([MyCollectionViewCell width], [MyCollectionViewCell height]);
    }
}

I've also tried invalidating the layout as suggested here, but for whatever reason it creates a huge buffer around my selected cell, disturbing all the other cells around it (causing them to move to a new position), and yet the content (imageView) inside my enlarged custom cell does not enlarge. I.e. the imageView inside it stays the same size, even though I specifically transformed the size of the imageView.frame and imageView.image as well: UICollectionView: Animate cell size change on selection

Here is more sample code that didn't work even though it executed on a selected cell:

-(void) collectionView:(UICollectionView*)collectionView didSelectItemAtIndexPath:(NSIndexPath*)indexPath
{
    NSLog(@"Cell Selected!");
    MyCollectionViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"StorageCell" forIndexPath:indexPath];
    MyImageView* selectedCellView = cell.imgView;

    MyCollectionViewFlowLayout* layout = (MyCollectionViewFlowLayout*)self.collection.collectionViewLayout;

    layout.currentCellPath = indexPath;
    layout.currentCellCenter = selectedCellView.center;
    layout.currentCellScale = 1.25;

    [self.collection.collectionViewLayout invalidateLayout];

    // Animate

    [UIView transitionWithView:cell duration:0.1f options: UIViewAnimationOptionCurveLinear animations:^(void)
     {
         CGRect frame = cell.frame;
         frame.size = CGSizeMake(60.0, 100.0);
         cell.frame = frame;

         selectedCellView.imgView.image = [UIImage imageNamed:@"wood2.png"];
         [self.collection reloadItemsAtIndexPaths:@[indexPath]];

         NSLog(@"Cell Frame animated to: %f,%f", cell.frame.size.width, cell.frame.size.height);

         frame = selectedCellView.frame;
         frame.size.width = 1.25*frame.size.width;
         frame.size.height = 1.25*frame.size.height;
         selectedCellView.frame = frame;

         frame = selectedCellView.imgView.frame;
         frame.size.width = 1.25*frame.size.width;
         frame.size.height = 1.25*frame.size.height;
         selectedCellView.imgView.frame = frame;

         UICollectionViewLayoutAttributes* attrib = [collection layoutAttributesForItemAtIndexPath:indexPath];
         attrib.transform3D = CATransform3DMakeScale(2, 2, 1.0);
         selectedCellView.imgView.frame.transform = CGAffineTransformScale(selectedCellView.imgView.transform, 1.1, 1.1);

     }
                    completion:nil];

}

Upvotes: 2

Views: 1403

Answers (1)

NavinDev
NavinDev

Reputation: 995

You Don't need to call invalidateLayout to perform these animations.

Just get the instance of the cell in the didSelectItemAtIndexPath by calling 

 MyCollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];

And animate the cell.

Here is a code snippet I used to zoom a cell.

 [self animateZoomforCell:cell];

//---Method Implementation-- //

-(void)animateZoomforCell:(MyCollectionViewCell*)zoomCell
    {
         [UIView animateWithDuration:0.2 delay:0 options:UIViewAnimationOptionCurveEaseOut animations:^{

            zoomCell.transform = CGAffineTransformMakeScale(1.6,1.6);
        } completion:^(BOOL finished){
         }];
    }

Upvotes: 9

Related Questions