タップでアニメーションUICollectionViewCell

Question

ユーザーがセルをタップすると、UICollectionViewCellでアニメーションを開始したいと思います。私の考えは、didSelectItemAtIndexPathの対応するセルを選択し、アニメーションをトリガーすることでした。しかし、これは動作しない：（animateWithDurationは5に設定されているが）

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

実際には、アニメーションの開始と同時に終了します。次の試みは、アニメーションをスキップすることだったし、単にインスタンスに異なる境界線スタイルを設定します（？私は手動でセルを再描画する必要があるからでしょう）

- (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をアニメーション化する方法はありますか？

敬具、 クリスチャン

Answer 1

それはあなたが間違ったセルを取得しているように思われます。 dequeueReusableCellWithReuseIdentifier:forIndexPath:メッセージを送信すると、ではなく、のビューで使用されているセルが2番目のパラメータのindexPathに取得されますが、以前に使用された再利用可能なセルはデキューされます。再使用可能なセルがない場合は、新しいセルが作成されます。下記の参考文献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

Answer 2

選択/コードに従って、カスタムアニメーションの再生時間と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]; 
      } 
  ];