ios6 - 点击动画 UICollectionViewCell

Question

我想UICollectionViewCell在用户点击单元格时开始一些动画。我的想法是选择相应的单元格didSelectItemAtIndexPath并触发动画。但是，这不起作用：

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    // animate the cell user tapped on
    ProductCollectionViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"ProductReuseID" forIndexPath:indexPath];
    
    [UIView animateWithDuration:5.0
                          delay:0
                        options:(UIViewAnimationOptionAllowUserInteraction)
                     animations:^{
                         NSLog(@"animation start");
                         [cell.layer setBackgroundColor:[UIColor colorWithRed: 180.0/255.0 green: 238.0/255.0 blue:180.0/255.0 alpha: 1.0].CGColor];
                     }
                     completion:^(BOOL finished){
                         NSLog(@"animation end");
                         [cell.layer setBackgroundColor:[UIColor whiteColor].CGColor];
                     }
    ];
}

实际上，动画同时开始和结束（虽然animateWithDuration设置为 5）。下一次尝试是跳过动画并简单地设置例如不同的边框样式：

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    // animate the cell user tapped on
    ProductCollectionViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"ProductReuseID" forIndexPath:indexPath];
    
    [cell.layer setBorderWidth:5.0f];
}

但是，这并没有改变任何东西（可能是因为我必须手动重绘单元格？）。

当用户点击 UICollectionViewCell 时，您有什么想法吗？

亲切的问候，克里斯蒂安

score 33 · Accepted Answer

您似乎获得了错误的单元格。发送dequeueReusableCellWithReuseIdentifier:forIndexPath:消息不会在第二个参数中的indexPath处获取视图中正在使用的cell，而是将一个之前使用过但可复用的cell出列；如果没有可重复使用的单元格，则创建一个新单元格。请参阅下面的参考文献 1。

更换：

ProductCollectionViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"ProductReuseID" forIndexPath:indexPath];

和：

ProductCollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];

在上面的代码中，应该为您提供合适的单元格来使用。

这是您的第一个示例，已重写。

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath(NSIndexPath *)indexPath
{
    // animate the cell user tapped on
    UICollectionViewCell  *cell = [collectionView cellForItemAtIndexPath:indexPath];    
    [UIView animateWithDuration:5.0
            delay:0
            options:(UIViewAnimationOptionAllowUserInteraction)
                animations:^{
                    NSLog(@"animation start");
                    [cell setBackgroundColor:[UIColor colorWithRed: 180.0/255.0 green: 238.0/255.0 blue:180.0/255.0 alpha: 1.0]];
                }
                completion:^(BOOL finished){
                    NSLog(@"animation end");
                    [cell setBackgroundColor:[UIColor whiteColor]];
                }
    ];
}

参考：

http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UICollectionView_class/Reference/Reference.html#//apple_ref/occ/cl/UICollectionView

score 2 · Accepted Answer

您可以按照代码在选择/点击具有自定义动画持续时间的 UICollectionViewCell 时自定义动画。所以，你不需要改变它的背景颜色。

使用以下选项 - UIViewAnimationOption

UIViewAnimationOptionCurveEaseIn
UIViewAnimationOptionCurveEaseOut

UIViewAnimationOptionAllowUserInteraction

UICollectionViewDelegate - didSelectItemAtIndexPath 方法

UICollectionViewCell *uviCollectionCell =  [collectionView cellForItemAtIndexPath:indexPath];

[UIView animateWithDuration:0.4 delay:0 options:(UIViewAnimationOptionCurveEaseIn) animations:^{
        NSLog(@"animation start");
        CALayer *layer = uviCollectionCell.layer;
        CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
        rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, 15.0f * M_PI / 180.0f, 1.0f, 0.0f, 0.0f);
        layer.transform = rotationAndPerspectiveTransform;
} completion:^(BOOL finished) {
        [UIView animateWithDuration:0.3 delay:0 options:(UIViewAnimationOptionCurveEaseOut) animations:^{
            NSLog(@"animation end");
            CALayer *layer = uviCollectionCell.layer;
            CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
            rotationAndPerspectiveTransform.m24 = 0;
            rotationAndPerspectiveTransform =CATransform3DRotate(rotationAndPerspectiveTransform, 0.0f * M_PI / 180.0f, 1.0f, 0.0f, 0.0f);
            layer.transform = rotationAndPerspectiveTransform;
        } completion:nil];
    }
];

ios6 - 点击动画 UICollectionViewCell

2 回答 2

UICollectionViewDelegate - didSelectItemAtIndexPath 方法

Related

Reference