Animate UICollectionViewCell on Tap

Question

Vorrei iniziare l'animazione su un UICollectionViewCell quando l'utente tocca una cella. La mia idea era di selezionare la cella corrispondente in didSelectItemAtIndexPath e attivare un'animazione. Tuttavia, questo non funziona:

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

realtà, inizia l'animazione e termina nello stesso tempo (anche se animateWithDuration è impostato a 5). tentativo successivo è stato quello di ignorare l'animazione e semplicemente impostare per esempio un diverso stile di bordo: (? Probabilmente perché devo ridisegnare la cella manualmente)

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

Tuttavia, questo non cambia nulla.

Avete qualche idea su come animare un UICollectionViewCell quando l'utente ha toccato su di esso?

Cordiali saluti, cristiane

Answer 1

Sembrerebbe che si desidera ottenere la cella errata. L'invio del messaggio dequeueReusableCellWithReuseIdentifier:forIndexPath: fa non ottiene la cella in uso nella vista in IndexPath nel secondo parametro, ma rimuove una cella precedentemente utilizzata ma riutilizzabile; se nessuna cella riutilizzabile è disponibile, ne viene creata una nuova. Vedere il riferimento 1 di seguito.

Sostituzione:

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

Con:

ProductCollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath]; 

Nel codice di cui sopra, dovrebbe dare la cella corretta con cui lavorare.

Ecco il tuo primo esempio, riscritto.

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

Riferimenti:

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

Answer 2

È possibile personalizzare l'animazione, mentre select/toccare l'UICollectionViewCell con la durata Animazione personalizzata seguendo il codice. Quindi, non è necessario cambiare il colore di sfondo di esso.

Con seguenti opzioni - UIViewAnimationOption

• UIViewAnimationOptionCurveEaseIn
• UIViewAnimationOptionCurveEaseOut

• UIViewAnimationOptionAllowUserInteraction

  UICollectionViewDelegate - metodo 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]; 
      } 
  ];