突出显示或放大选定的单元格？

Posted 2023-03-13

【中文标题】突出显示或放大选定的单元格？

【英文标题】：Highlighting or Enlargening selected cell?

【发布时间】：2014-05-22 10:22:02

【问题描述】：

我在UIViewController 中工作，UICollectionView 以标准网格布局排列，allowsMultipleSelection = NO。当用户选择一个单元格（通过 handleTap UITapGestureRecognizer 选择）时，我想做以下一项或全部操作：

(1) 以不同的颜色突出显示/着色单元格——更改其 alpha 和背景颜色

(2) 稍微放大单元格而不改变它周围的任何其他单元格

(3) 在修改后的单元格的框架或边界周围画一个边框

我目前正在使用以下函数，尽管单元格被正确划分选择并存储在局部变量 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]);
    

我也尝试过按照此处的建议使布局无效，但无论出于何种原因，它都会在我选择的单元格周围创建一个巨大的缓冲区，干扰它周围的所有其他单元格（导致它们移动到新位置），但我放大的自定义单元格内的内容（imageView）没有放大。 IE。尽管我还专门改变了 imageView.frame 和 imageView.image 的大小，但其中的 imageView 大小保持不变：UICollectionView: Animate cell size change on selection

这里有更多示例代码，即使它在选定的单元格上执行也不起作用：

-(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];

【参考方案1】：

您不需要调用 invalidateLayout 来执行这些动画。

只需通过调用获取didSelectItemAtIndexPath中的单元格实例

 MyCollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];

并为单元格设置动画。

这是我用来缩放单元格的代码 sn-p。

 [self animateZoomforCell:cell];

//---方法实现-- //

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

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

【讨论】：

谢谢。我是否需要在 Deselect 方法中执行任何操作来撤消放大？

是的，只需实现类似的方法并将转换设置为CGAffineTransformMakeScale(1,1) 即可恢复。